Upload
others
View
12
Download
0
Embed Size (px)
Citation preview
49
33
BAB IV
RANCANGAN SISTEM DAN PROGRAM USULAN
4.1. Analisa Kebutuhan Sistem
A. Tahapan Analisa
Sistem informasi sekolah berbsais web sangatlah diperlukan bagi
masyarakat untuk mengakses informasi-informasi tentang sekolah yang menjadi
tujuan pendidikan. Di samping itu untuk memudahkan akses yang lebih efisien
serta efektif bagi pihak sekolah untuk mempromosikan lembaganya, maka untuk
menunjang hal tersebut di butalah sistem informasi sekolah berbasis web pada
Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari
sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta :
Halaman Administrator
A1. Admin dapat menulis, melihat, merubah dan menghapus berita.
A2. Admin dapat memasukkan, merubah, melihat dan menghapus data siswa.
A3. Admin dapat menulis, merubah, melihat, dan menghapus data guru.
A.4 Admin dapat mengkonfirmasi calon siswa baru yang telah mendaftar A5.
dan melunasi biaya administrasi.
A6. Admin dapat merubah tampilan serta isi dari web.
Halaman Guru
B1. Guru dapat melihat data siswa.
B2. Guru dapat melihat data pribadi.
34
B3. Guru dapat mengunggah file berupa foto tentang kegiatan belajar mengajar
di Taman Kanak-Kanak Kepompong Alam.
B4. Guru dapat merubah password.
B5. Guru dapat melihat galery yang berisi file berupa foto tentang kegiatan
belajar mengajar di Taman Kanak-Kanak Kepompong Alam.
Halaman Orang Tua
C1. Orang Tua dapat melihat data pribadi siswa.
C2. Orang Tua dapat melihat galery yang berisi file berupa foto tentang
kegiatan belajar mengajar di Taman Kanak-Kanak Kepompong C3. Alam
yang diunggah oleh guru.
C4. Orang Tua dapat saling berinteraksi sesama User Orang Tua.
C5. Orang Tua dapat merubah password
Halaman Pengunjung
D1. Pengunjung dapat melihat tampilan beranda.
D2. Pengunjung dapat melihat informasi tentang Taman Kanak-Kanak
Kepompong Alam.
D3. Pengunjung dapat melihat dan membaca berita.
D4. Pengunjung dapat melihat galery.
D5. Pengunjung dapat mendaftarkan anaknya menjadi calon siswa Taman
Kanak-Kanak Kepompong Alam Jakarta.
35
B. Usecase Diagram
1. Usecase Diagram Admin
Gambar IV.1
Use Case Diagram Admin
Tabel IV.1
Deskripsi Use Case Beranda
Nama Beranda
Aktor Admin
Deskripsi Di dalam halaman beranda, admin dapat melihat info dari
sekolah Taman Kanak-Kanak Kepompong Alam Jakarta
Tabel IV.2
Deskripsi Use Case Edit Isi Web
Nama Edit Isi Web
Aktor Admin
Deskripsi Di dalam menu edit isi web terdapat beberapa sub menu.
Sub menu sejarah berfungsi untuk mengubah isi dari
halaman sejarah. Sub menu visi dan misi berfungsi
untuk mengubah isi dari halaman visi dan misi. Sub
menu fasilitas berfungsi untuk mengubah isi dari
halaman fasilitas. Sub menu info peraturan berfungsi
untuk mengubah isi dari halaman info peraturan pada
pendaftaran psb. Sub menu info persyaratan berfungsi
untuk mengubah isi dari halaman info persyaratan pada
36
pendaftaran psb.
Tabel IV.3
Deskripsi Use Case Management
Nama Management
Aktor Admin
Deskripsi Di dalam menu management terdapat beberapa sub
menu. Sub menu guru berisi semua data guru, dan admin
dapat menginput, merubah, melihat, dan menghapus data
guru. Sub menu siswa berisi semua data siswa, dan
admin dapat menginput, merubah, melihat, dan
menghapus data siswa. Sub menu galery berisi semua file
yang berupa foto dokumentasi yang telah di unggah oleh
guru dan admin, dan admin dapat menghapus isi dari
galery. Sub menu berita berisi semua berita yang telah di
post oleh admin, dan admin dapat menginput, merubah,
melihat, dan menghapus berita.
Tabel IV.4
Deskripsi Use Case Upload Foto
Nama Upload Foto
Aktor Admin
Deskripsi Halaman ini berisi form untuk admin yang berfungsi
untuk mengupload foto seputar kegiatan belajar dan
mengajar yang dilaksanakan
Tabel IV.5
Deskripsi Use Case Input Berita
Nama Input Berita
Aktor Admin
Deskripsi Halaman ini berisi form untuk admin yang berfungsi
untuk menulis berita seputar kegiatan maupun info dari
taman kanak-kanak kepompong alam.
37
Tabel IV.6
Deskripsi Use Case Tulis Pemberitahuan
Nama Tulis Pemberitahuan
Aktor Admin
Deskripsi Pada halaman ini terdapat sub menu guru dan orang tua,
dimana pada sub menu guru terdapat form yg dapat diisi
dengan pemberitahuan atau pengumuman kepada guru.
Begitu juga pada sub menu orang tua juga terdapat form
yg dapat diisi dengan pemberitahuan atau pengumuman
kepada orang tua.
Tabel IV.7
Deskripsi Use Case PSB
Nama PSB
Aktor Admin
Deskripsi Halaman ini berisi data dari calon siswa yang mendaftar
secara online. Admin dapat melihat data calon siswa,
mengkonfirmasi dan menghapus data psb.
2. Use Case Diagram Guru
Gambar IV.2
Use Case Diagram Guru
38
Tabel IV.8
Deskripsi Use Case Beranda Guru
Nama Beranda
Aktor Guru
Deskripsi Di dalam halaman beranda, guru dapat melihat info dari
sekolah Taman Kanak-Kanak Kepompong Alam Jakarta
Tabel IV.9
Deskripsi Use Case Lihat Data Pribadi Guru
Nama Lihat Data Pribadi
Aktor Guru
Deskripsi Di dalam halaman lihat data pribadi ini, guru dapat
melihat data pribadi guru
Tabel IV.10
Deskripsi Use Case Lihat Data Siswa Guru
Nama Lihat Data Siswa
Aktor Guru
Deskripsi Di dalam halaman lihat data siswa, guru dapat melihat
data siswa
Tabel IV.11
Deskripsi Use Case Upload Foto Guru
Nama Upload Foto
Aktor Guru
Deskripsi Halaman ini berisi form untuk guru yang berfungsi untuk
mengupload foto seputar kegiatan belajar dan mengajar
yang dilaksanakan.
Tabel IV.12
Deskripsi Use Case Ubah Password Guru
Nama Ubah Password
39
Aktor Guru
Deskripsi Di dalam halaman ini terdapat form yang berguna untuk
mengubah password guru
3. Use Case Diagram Orang Tua
Gambar IV.3
Use Case Diagram Orang Tua
Tabel IV.13
Deskripsi Use Case Beranda
Nama Beranda
Aktor Orang Tua
Deskripsi Di dalam halaman beranda, orang tua dapat melihat info
dari sekolah Taman Kanak-Kanak Kepompong Alam
Jakarta
Tabel IV.14
Deskripsi Use Case Data Siswa
Nama Lihat Data Siswa
Aktor Orang Tua
Deskripsi Di dalam halaman ini, orang tua dapat melihat data
pribadi siswa
40
Tabel IV.15
Deskripsi Use Case Data Guru
Nama Lihat Data Guru
Aktor Orang Tua
Deskripsi Di halaman ini orang tua dapat melihat data dari guru
Tabel IV.16
Deskripsi Use Case Galery
Nama Galery
Aktor Orang Tua
Deskripsi Di halaman ini orang tua dapat melihat file dokumentasi
berupa foto yang berisi tentang proses belajar mengajar
maupun foto dari karya siswa dan siswi
Tabel IV.17
Deskripsi Use Case Ubah Password
Nama Ubah Password
Aktor Orang Tua
Deskripsi Di dalam halaman ini terdapat form yang berguna untuk
mengubah password orang tua
4. Use Case Pengunjung
Gambar IV.4
Use Case Diagram Pengunjung
41
Tabel IV.18
Deskripsi Use Case Beranda
Nama Beranda
Aktor Pengunjung
Deskripsi Pengunjung dapat melihat halaman homepage yang berisi
berita
Tabel IV.19
Deskripsi Use Case Tentang Kami
Nama Tentang Kami
Aktor Pengunjung
Deskripsi Di dalam menu tentang kami terdapat beberapa sub
menu. Sub menu sejarah berisi tentang sejarah berdirinya
Taman Kanak-Kanak Kepompong Alam. Sub menu visi
dan misi berisi tentang visi dan misi dari Taman Kanak-
Kanak Kepompong Alam. Sub menu fasilitas berisi
tentang fasilitas yang dimiliki oleh Taman Kanak-Kanak
Kepompong Alam.
Tabel IV.20
Deskripsi Use Case Berita
Nama Berita
Aktor Pengunjung
Deskripsi Halaman ini berisi tentang berita seputar Taman Kanak-
Kanak Kepompong Alam, sehingga pengunjung dapat
memilih dan melihat berita yang telah diunggah oleh
admin.
Tabel IV.21
Deskripsi Use Case Galery
Nama Galery
Aktor Pengunjung
Deskripsi Halaman ini berisi data berupa dokumentasi dalam
bentuk foto tentang belajar dan mengajar yang diadakan
dan file berupa hasil karya dari siswa siswi.
42
Tabel IV.22
Deskripsi Use Case PSB Online
Nama PSB Online
A+ktor Pengunjung
Deskripsi Halaman ini berisi form pendaftaran siswa siswi baru
secara online.
C. Activity Diagram
Activity Diagram Usulan Taman Kanak-Kanak Kepompong Alam
Jakarta
Pada tahap ini penulis akan menjelaskan alur atau proses yang
diterapkan pada web dengan menggunakan activity diagram.
43
1. Activity Diagram Admin
Gambar IV.5
Activity Diagram Usulan Admin
44
2. Activity Diagram Guru
Gambar IV.6
Activity Diagram Usulan Guru
45
3. Activity Diagram Orang Tua
Gambar IV.7
Activity Diagram Usulan Orang Tua
46
4. Activity Diagram Pendaftaran
Gambar IV.8
Activity Diagram Pendaftaran
47
4.2. Desain
Desain database yang efektif memungkinkan hasil aplikasi berjalan dengan
baik. Maka dari itu untuk mempermudah dan membuat hasil yang lebih baik,
penulis membuat desain database sebelum benar-benar membuat databasenya.
4.2.1. Database
Entity Relationship Diagram menjelaskan hubungan antara data dalam
basis data berdasarkan suatu proses. Relasi antar object dilukiskan dalam grafik
dan simbol-simbol tertentu. Sedangkan ERD dalam sistem usulan website system
informasi sekolah sebagai berikut.
48
1. Entity Relationship Diagram (ERD)
Gambar IV.9
Entity Relationship Diag
49
2. Spesifikasi File
a. Spesifikasi Tabel Admin_S
Nama Database : tk_ka
Nama Tabel : admin_s
Akronim : admin_s.sql
Type File : File Master
Panjang Record : 161 Bytes
Tabel IV.23
Spesifikasi Tabel Admin_S
No Elemen Data Nama Field Type Size Ket
1 Id Admin S id_admin_s int 1 Primary
Key
2 Nama nama varchar 30
3 Email email varchar 30
4 Password pass varchar 100
b. Spesifikasi Tabel Admin
Nama Database : tk_ka
Nama Tabel : admin
Akronim : admin.sql
Type File : File Master
Panjang Record : 475 Bytes
Tabel IV.24
Spesifikasi Tabel Admin
No Elemen Data Nama Field Type Size Ket
1 id admin id_admin int 2 Primary
Key
2 Username username varchar 15
3 Email admin email_admin varchar 30
50
4 Nama nama varchar 30
5 Tempat Lahir tempat varchar 20
6 Tanggal Lahir tanggal date
7 Jenis Kelamin
Admin
jk_admin varchar 10
8 Alamat alamat text
9 Agama agama varchar 10
10 Kewarganegaraan kewarganegaraan varchar 3
11 Foto foto varchar 255
12 password admin password_admin varchar 100
c. Spesifikasi Tabel Berita
Nama Database : tk_ka
Nama Tabel : berita
Akronim : berita.sql
Type File : File Master
Panjang Record : 314 Bytes
Tabel IV.25
Spesifikasi Tabel Berita
No Elemen Data Nama Field Type Size Ket
1 Id berita id_berita int 4 Primary Key
2 Tanggal tanggal date
3 Judul judul varchar 50
4 Isi isi text
5 Foto foto varchar 255
6 Id_admin id_admin int 2
d. Spesifikasi Tabel Calon Siswa
Nama Database : tk_ka
Nama Tabel : calon_siswa
Akronim : calon_siswa.sql
Type File : File Transaksi
51
Panjang Record : 292 Bytes
Tabel IV.26
Spesifikasi Tabel Calon Siswa
No Elemen Data Nama Field Type Size Ket
1 Id Calon Siswa id_cs int 4 Primary Key
2 No Pendaftaran no_daftar varchar 20
3 Nama Calon Siswa nama_cs varchar 30
4 Nama Panggilan nama_pang varchar 15
5 Jenis Kelamin jk_cs varchar 10
6 Tempat Lahir tmp_lhr_cs varchar 15
7 Tanggal Lahir tgl_lhr_cs date
8 Agama agama_cs varchar 15
9 Kewarganegaraan warga varchar 15
10 Saudara Kandung kandung varchar 2
11 Saudara Angkat angkat varchar 2
12 Saudara Tiri tiri varchar 2
13 Bahasa Sehari-hari bahasa varchar 20
14 Berat Badan berat varchar 2
15 Tinggi Badam tinggi varchar 3
16 Golongan Darah darah varchar 2
17 Penyakit Diderita penyakit text
18 Alamat alamat_cs text
19 Telp telp_cs varchar 12
20 Nama Ayah ayah_cs varchar 30
21 Pendidikan Ayah pend_ayah varchar 3
22 Pekerjaan Ayah pek_ayah varchar 20
23 Nama Ibu ibu_cs varchar 30
24 Pendidikan Ibu pend_ibu varchar 3
25 Pekerjaan Ibu pek_ibu varchar 20
26 Pilih Kelas kelas_ca varchar 17
e. Spesifikasi Tabel Galery
Nama Database : tk_ka
Nama Tabel : galery
Akronim : galery.sql
Type File : File Transaksi
Panjang Record : 344 Bytes
52
Tabel IV.27
Spesifikasi Tabel Galery
No Elemen Data Nama Field Type Size Ket
1 Id galery id_galery int 4 Primary Key
2 Judul judul varchar 50
3 File foto file_foto varchar 255
4 Waktu Waktu datetime
5 Penggunggah oleh varchar 30
6 Id Admin id_admin int 2 Foreign Key
7 Id Guru id_guru int 3 Foreign Key
f. Spesifikasi Tabel Guru
Nama Database : tk_ka
Nama Tabel : guru
Akronim : guru.sql
Type File : File Master
Panjang Record : 335 Bytes
Tabel IV.28
Spesifikasi Tabel Guru
No Elemen Data Nama Field Type Size Ket
1 Id guru id_guru int 3 Primary Key
2 Nama guru nama_guru varchar 30
3 Nip Nigs nip_nigs varchar 15
4 Tempat Lahir tmp_lhr_guru varchar 15
5 Tanggal lahir tgl_lhr_guru date
6 Jenis Kelamin jk_guru varchar 10
7 Agama agama_guru varchar 15
8 Status Pernikahan s_pernikahan varchar 15
9 Pendidikan t_pendidikan varchar 3
10 Lulusan lulusan varchar 30
11 Status Pengajar s_pengajar varchar 10
12 Gaji gaji varchar 7
13 Alamat Guru alamat_guru text
14 No Telp Guru telp_guru varchar 12
15 Tahun Mulai tahun_mulai date
16 Foto foto varchar 50
53
17 Email email varchar 20
18 Password Guru pass_guru varchar 100
g. Spesifikasi Tabel Pengumuman Guru
Nama Database : tk_ka
Nama Tabel : pengumuman_guru
Akronim : pengumuman_guru.sql
Type File : File Transaksi
Panjang Record : 56 Bytes
Tabel IV.29
Spesifikasi Tabel Pengumuman Guru
No Elemen Data Nama Field Type Size Ket
1 Id Pengumuman id_pg int 4 Primary Key
2 Judul judul varchar 50
3 Isi Isi text
4 Tanggal Tgl date
5 Id Admin id_admin id_admin 2 Foreign Key
h. Spesifikasi Tabel Pengumuman Siswa
Nama Database : tk_ka
Nama Tabel : pengumuman_siswa
Akronim : pengumuman_siswa.sql
Type File : File Transaksi
Panjang Record : 56 Bytes
Tabel IV.30
Spesifikasi Tabel Pengumuman Siswa
No Elemen Data Nama Field Type Size Ket
1 Id Pengumuman id_ps int 4 Primary Key
2 Judul judul varchar 50
54
3 Isi Isi text
4 Tanggal Tgl date
5 Id Admin id_admin id_admin 2 Foreign Key
i. Spesifikasi Tabel Siswa
Nama Database : tk_ka
Nama Tabel : siswa
Akronim : siswa.sql
Type File : File Master
Panjang Record : 446 Bytes
Tabel IV.31
Spesifikasi Tabel Siswa
No Elemen Data Nama Field Type Size Ket
1 Id Siswa id_siswa Int 4 Primary Key
2 NIS Nis Varchar 20
3 Nama Siswa nama_siswa Varchar 30
4 Nama Panggilan nam_pang_sis Varchar 15
5 Jenis Kelamin jk_siswa Varchar 10
6 Tempat Lahir tmp_lhr_siswa Varchar 15
7 Tanggal Lahir tgl_lhr_siswa Date
8 Agama agama_siswa Varchar 15
9 Kewarganegaraan warga_sis Varchar 15
10 Saudara Kandung s_angkat Varchar 2
11 Saudara Angkat s_kandung Varchar 2
12 Saudara Tiri s_tiri Varchar 2
13 Bahasa Sehari-hari bahasa_sis Varchar 20
14 Berat Badan berat_sis Varchar 2
15 Tinggi Badam tinggi_sis Varchar 3
16 Golongan Darah gol_dar Varchar 2
17 Penyakit Diderita penyakit Text
18 Alamat Siswa alamat_siswa Text
19 Telp telp_wali Varchar 12
20 Nama Ayah Bapak Varchar 30
21 Pendidikan Ayah pend_ayah_sis Varchar 3
22 Pekerjaan Ayah pek_ayah_sis Varchar 20
23 Nama Ibu Ibu Varchar 30
24 Pendidikan Ibu pend_ibu_sis Varchar 3
25 Pekerjaan Ibu pek_ibu_sis Varchar 20
55
26 Password Siswa pass_siswa Varchar 100
27 Kelas Kelas Varchar 17
28 Foto Siswa foto_siswa Varchar 50
29 Id Calon Siswa id_cs Int 4 Foreign Key
j. Spesifikasi Tabel Tampilan
Nama Database : tk_ka
Nama Tabel : tampilan
Akronim : tampilan.sql
Type File : File Transaksi
Panjang Record : 537 Bytes
Tabel IV.32
Spesifikasi Tabel Tampilan
No Elemen Data Nama Field Type Size Ket
1 Id Tampilan id Int 2 Primary Key
2 Caroussel caroussel varchar 255
3 Sejarah sejarah text
4 Visi dan Misi visi text
5 Fasilitas fasilitas varchar 255
6 Nama Fasilitas n-fasilitas vaechar 25
7 Peraturan PSB peraturan text
8 Persyaratan PSB persyaratan text
4.2.2. Software Architecture
A. Sequence Diagram
Sequence Diagram menggambarkan interaksi antar obyek dan
mengindentifikasikan komunikasi diantara obyek-obyek.
56
1. Sequence Diagram Admin
Gambar IV.10
Sequence Diagram Usulan Admin
57
2. Sequence Diagram Guru
Gambar IV.11
Sequence Diagram Usulan Guru
58
3. Sequence Diagram Orang Tua
Gambar IV.12
Sequence Diagram Usulan Orang Tua
59
4. Sequence Diagram Pengunjung
Gambar IV.13
Sequence Diagram Usulan Pengunjung
B. Deployment Diagram
Deployment diagram menununjakan susunan fisik suatu sistem,
menunjukan perangkat lunak mana yang berjalan pada perangkat lunak
mana.
Gambar IV.14
Deployment Diagram yang diusulkan
60
4.2.3. User Interface
User Interface disini merupakan penggambaran tampilan web dari sistem
usulan yang telah dibuat. Adapun tampilan sebagai berikut :
Gambar IV.15
Halaman Beranda
Pada Gambar IV.15 adalah tampilan dari halaman beranda, pada halaman
ini terdapat menu Beranda, Tentang Kami, Berita, Galery, PSB Online, dan
Lokasi. Pada halaman kanan atas terdapat menu login yang diperuntukkan bagi
Guru dan Orang Tua. Pada halaman ini juga pengunjung dapat melihat berita atau
informasi terbaru seputar kegiatan yang terjadi di Taman Kanak-Kanak
Kepompong Alam Jakarta.
61
Gambar IV.16
Halaman Login Guru
Pada Gambar IV.16 adalah tampilan dari halaman login Guru. Guru dapat
masuk ke halaman beranda Guru setelah mengisi form login tersebut. Guru di
wajibkan untuk mengisi username yang berupa NIP dan password yang berupa
tanggal lahir guru, atau karakter apapun setelah guru melakukan perubahan pada
password.
Gambar IV.17
Halaman Login Orang Tua
62
Pada Gambar IV.17 adalah tampilan dari halaman login Orang Tua. Orang
Tua dapat masuk ke halaman beranda Orang Tua setelah mengisi form login
tersebut. Orang Tua di wajibkan untuk mengisi username yang berupa nama siswa
dan password yang berupa tanggal lahir dari siswa, atau karakter apapun setelah
Orang Tua melakukan perubahan pada password.
Gambar IV.18
Halaman Login Admin
Pada Gambar IV.16 adalah tampilan dari halaman login Admin. Admin
dapat masuk ke halaman beranda Admin setelah mengisi form login tersebut.
Admin di wajibkan untuk mengisi username yang berupa alamat email admin dan
password yang berupa sejumlah karakter yang telah ditentukan oleh admin.
63
4.3. Code Generation
A. Halaman Index
<?php
include "koneksi.php";
include "web/index.php";
?>
B. Halaman Login Guru
<?php
session_start();
if(isset($_SESSION['guru'])) {
header('location:index.php'); }
require_once("../koneksi.php");
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1">
<link rel="stylesheet" href="../css/bootstrap.min.css">
<link rel="stylesheet" href="../css/style.css" type="text/css" />
<link rel="stylesheet" href="../css/footer.css">
<script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<title>Login Guru</title>
</head>
<body background="../img/emas.jpg" style="background-size: cover ;
background-attachment:fixed" >
<?php
include "content/header.php";
?>
<center>
<div id="login-form">
<form method="post" action="proses_login_guru.php">
<table align="center" width="30%" border="0">
<tr>
<td><input type="text" name="nip" placeholder="NIP/NIGS"
required /></td>
</tr>
<tr>
<td><input type="password" name="password"
placeholder="Password" required /></td>
</tr>
64
<tr>
<td><button type="submit" name="admin-login"
style="background:#1DC200;">Sign In</button></td>
</tr>
</table>
</form>
</div>
</center>
<?php
include "content/footer.php";
?>
</body>
</html>
C. Halaman Login Orang Tua
<?php
session_start();
if(isset($_SESSION['orangtua'])) {
header('location:index.php'); }
require_once("../koneksi.php");
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1">
<link rel="stylesheet" href="../css/bootstrap.min.css">
<link rel="stylesheet" href="../css/style.css" type="text/css" />
<link rel="stylesheet" href="../css/footer.css">
<script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<title>Login Admin</title>
</head>
<body background="../img/sis.jpg" style="background-size: cover ;
background-attachment:fixed" >
<?php
include "content/header.php";
?>
<center>
<div id="login-form">
<form method="post" action="proses_login.php">
<table align="center" width="30%" border="0">
<tr>
<td><input type="text" name="nama" placeholder="nama"
required /></td>
</tr>
65
<tr>
<td><input type="password" name="password"
placeholder="Password" required /></td>
</tr>
<tr>
<td><button type="submit" name="admin-login"
style="background:#1DC200;">Sign In</button></td>
</tr>
</table>
</form>
</div>
</center>
<br><br><br><br><br><br><br><br><br><br><br>
<?php
include "content/footer.php";
?>
</body>
</html>
D. Halaman Login Admin
<?php
session_start();
if(isset($_SESSION['admin'])) {
header('location:index.php'); }
require_once("../koneksi.php");
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1">
<link rel="stylesheet" href="../css/bootstrap.min.css">
<link rel="stylesheet" href="../css/style.css" type="text/css" />
<link rel="stylesheet" href="../css/footer.css">
<script src="../js/jquery.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<title>Login Admin</title>
</head>
<body background="../img/wall2.jpg" style="background-size: cover ;
background-attachment:fixed" >
<?php
include "content/header.php";
?>
<center>
<div id="login-form">
<form method="post" action="proses_login.php">
66
<table align="center" width="30%" border="0">
<tr>
<td><input type="text" name="email" placeholder="Email"
required="Silakan Masukkan Email" /></td>
</tr>
<tr>
<td><input type="password" name="password"
placeholder="Password" required /></td>
</tr>
<tr>
<td><button type="submit" name="admin-login"
style="background:#1DC200;">Login</button></td>
</tr>
</table>
</form>
</div>
</center>
<br><br><br><br><br><br><br>
<?php
include "content/footer.php";
?>
</body>
</html>
4.4. Testing
Proses menganalisa suatu entitas software untuk mendeteksi perbedaan
antara kondisi yang ada dengan kondisi yang diinginkan dan mengefaluasi fitur-
fitur entitas software. Tabel IV.32 menjelaskan hasil dari testing untuk halaman
Login Admin..
A. Halaman Login Admin
Tabel IV.33
Testing Halaman Login Admin
Skenario
Pengujian
Test Case Hasil Yang
Dihararapkan
Hasil
Pengujian
Kesimpulan
Admin menekan
tombol login
All :
(Kosong)
System
Menolak
Susuai
Harapan
Valid
Admin mengisi
form username
Form
Username
System
Menolak
Susuai
Harapan
Valid
67
dan
mengosongkan
form password
lalu menekan
tombol login
:Isi
Form
Password :
Kosong
Admin
mengosongkan
form username
dan mengisi form
password lalu
menekan tombol
login
Form
Username
: Kosong
Form
Password :
Isi
System
Menolak
Susuai
Harapan
Valid
Admin mengisi
form username
dan password
dengan benar
Username
: Isi
(Benar)
Password :
Isi (Benar)
System
Menerima
Susuai
Harapan
Valid
B. Halaman Login Guru
Tabel IV.34
Testing Halaman Login Guru
Skenario
Pengujian
Test Case Hasil Yang
Dihararapkan
Hasil
Pengujian
Kesimpulan
Guru menekan
tombol login
All :
(Kosong)
System
Menolak
Susuai
Harapan
Valid
Guru mengisi
form username
dan
mengosongkan
form password
lalu menekan
tombol login
Form
Username
:Isi
Form
Password :
Kosong
System
Menolak
Susuai
Harapan
Valid
Guru
mengosongkan
form username
dan mengisi form
password lalu
menekan tombol
login
Form
Username
: Kosong
Form
Password :
Isi
System
Menolak
Susuai
Harapan
Valid
Guru mengisi
form username
dan password
Username
: Isi
(Benar)
System
Menerima
Susuai
Harapan
Valid
68
dengan benar Password :
Isi (Benar)
C. Halaman login Orang Tua
Tabel IV.35
Testing Halaman Login Orang Tua
Skenario
Pengujian
Test Case Hasil Yang
Dihararapkan
Hasil
Pengujian
Kesimpulan
Orang Tua
menekan tombol
login
All :
(Kosong)
System
Menolak
Susuai
Harapan
Valid
Orang Tua
mengisi form
username dan
mengosongkan
form password
lalu menekan
tombol login
Form
Username
:Isi
Form
Password :
Kosong
System
Menolak
Susuai
Harapan
Valid
Orang Tua
mengosongkan
form username
dan mengisi form
password lalu
menekan tombol
login
Form
Username
: Kosong
Form
Password :
Isi
System
Menolak
Susuai
Harapan
Valid
Orang Tua
mengisi form
username dan
password dengan
benar
Username
: Isi
(Benar)
Password :
Isi (Benar)
System
Menerima
Susuai
Harapan
Valid
4.5. Support
Menjelaskan tentang publikasi web dan spesifikasi hardware dan software
yang akan digunakan untuk menjelaskan sistem yang dibuat. Dalam pembuatan
aplikasi sistem perpustakaan online ini akan membantu admin untuk mengelola
data-data dan membuat laporan, untuk itu penulis menggunakan program PHP
69
untuk membuat aplikasi. Untuk mengoprasikan program tersebutdiperlukan
spesifikasi komputer yang cukup tinggi dan untuk pembuatan aplikasi kebutuhan
hardware yang diperlukan meliputi : processor, memory, hard disk, keyboard,
mouse sedangkan untuk kebutuhan software yang diperlukan meliputi sistem
operasi software program PHP dan software database MySql.
4.5.1. Publikasi Web
Publikasi website Taman Kanak-Kanak Kepompong Alam Jakarta melalui
jasa penyewaan hosting pada sebuah penyedia jasa hosting dari
www.idhostinger.com.
a. Nama Sub Domain
Registrasi Sub domain name untuk webside ini adalah
tkkepompongalam.pe.hu
b. Kapasitas Hosting
Untuk kapasitas yang mencukupi dalam publikasi website ini adalah
2000 Megabyte. Pendaftaran kapasitas hosting ini dari jasa
www.idhostinger.com
c. Analisa Biaya
Analisa biaya dari registrasi domain hingga penyewaan kapasitas hosting
dengan menggunakan jasa penedia hosting dari www.idhostinger.com
adalah sebagai berikut :
Registrasi sub domain : Rp.0-/3 bulan
Sub Domain : tkkepompongalam.pe.hu
70
Penyewaan hosting : Rp.0,-/3bulan
Diskspace : 2000 Mb
Bandwith : 100 GB
4.5.2. Spesifikasi Hardware dan Software
Suatu sistem pada program tidak dapat berdiri sendiri, melainkan
membutuhkan sarana pendukung untuk dapat berjalan dengan baik. Sarana
pendukung yang dibutuhkan antara lain adalah sebagai berikut : perangkat keras
dan perangkat lunak dan pengguna.
1. Spesifikasi Hardware
Perangkat keras yang dimaksud disini adalah seperangkat alat atau elemen
elektronik yang dapat membantu sistem yang diusulkan sehingga program yang
diusulkan oleh penulis dapat bekerja dengan baik.
a. Processor : Pentium Core 2 Duo, 2.4 GHz
b. RAM : 2 GB
c. Monitor : SVGA colour 14”
d. Harddisk : 512 GB
e. Keyboard : 108 keys
f. Mouse : Standard
2. Spesifikasi software
Keberadaan perangkat lunak selalu menyertai perangkat keras yang ada.
Perangkat lunak yang dibutuhkan sebagai berikut:
71
a. Operating system : Windows XP atau sesudahnya
b. Bahasa pemrograman : PHP
c. Database server : MySQL
d. Web server : XAMPP
4.6. Spesifikasi Dokumen Sistem Usulan
4.6.1. Spesifikasi Bentuk Dokumen Masukan
Dokumen masukan adalah segala bentuk masukan yang berupa dokumen
yang diolah dalam proses yang dapat menghasilkan keluaran atau output yang
diinginkan.
1. Nama Dokumen : Form Pendaftaran Online
Fungsi : Untuk melakukan pendaftaran secara online
Media : Aplikasi website
Jumlah : 1 Form
Sumber : Website
Tujuan : Calon Siswa
Frequency : Setiap ada pendaftaran siswa baru
Bentuk : Lampiran B.1
2. Nama Dokumen : Form Tulis Berita/Info
Fungsi : Untuk melakukan menginput berita/info
Media : Aplikasi website
Jumlah : 1 Form
Sumber : Admin
72
Tujuan : Pengunjung dan Orangtua
Frequency : Setiap ada berita yang ingin di publikasikan
Bentuk : Lampiran B.2
3. Nama Dokumen : Form input foto
Fungsi : Untuk memasukkan foto ke galery web
Media : Aplikasi website
Jumlah : 1 Form
Sumber : Admin dan Guru
Tujuan : Pengunjung dan Orangtua
Frequency : Setiap ada dokumentasi belajar mengajar
Bentuk : Lampiran B.3
4.6.2. Spesifikasi Bentuk Dokumen Keluaran
1. Nama Dokumen : Galery
Fungsi : Menampilkan foto kegiatan belajar mengajar
Media : Aplikasi website
Jumlah : 1 Form
Sumber : Admin dan Guru
Tujuan : Pengunjung dan Orangtua
Frequency : Setiap admin mengunggah foto dokumentasi
Bentuk : Lampiran B.4
2. Nama Dokumen : Bukti Pendaftaran
73
Fungsi : Mencetak bukti pendaftaran
Media : Aplikasi website
Jumlah : 1 Form
Sumber : Website
Tujuan : Calon siswa
Frequency : Setiap ada pendaftaran siswa baru
Bentuk : Lampiran B.5