bab iv rancangan sistem dan program usulan 4 ......taman kanak-kanak kepompong alam jakarta. berikut...

41
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.

Upload: others

Post on 19-Nov-2020

9 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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.

Page 2: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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.

Page 3: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari 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

Page 4: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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.

Page 5: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 6: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 7: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 8: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 9: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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.

Page 10: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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.

Page 11: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

43

1. Activity Diagram Admin

Gambar IV.5

Activity Diagram Usulan Admin

Page 12: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

44

2. Activity Diagram Guru

Gambar IV.6

Activity Diagram Usulan Guru

Page 13: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

45

3. Activity Diagram Orang Tua

Gambar IV.7

Activity Diagram Usulan Orang Tua

Page 14: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

46

4. Activity Diagram Pendaftaran

Gambar IV.8

Activity Diagram Pendaftaran

Page 15: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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.

Page 16: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

48

1. Entity Relationship Diagram (ERD)

Gambar IV.9

Entity Relationship Diag

Page 17: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 18: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 19: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 20: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 21: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 22: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 23: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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.

Page 24: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

56

1. Sequence Diagram Admin

Gambar IV.10

Sequence Diagram Usulan Admin

Page 25: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

57

2. Sequence Diagram Guru

Gambar IV.11

Sequence Diagram Usulan Guru

Page 26: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

58

3. Sequence Diagram Orang Tua

Gambar IV.12

Sequence Diagram Usulan Orang Tua

Page 27: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 28: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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.

Page 29: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari 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

Page 30: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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.

Page 31: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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>

Page 32: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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>

Page 33: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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">

Page 34: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 35: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 36: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 37: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 38: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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:

Page 39: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 40: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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

Page 41: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4 ......Taman Kanak-Kanak Kepompong Alam Jakarta. Berikut ini spesifikasi dari sistem informasi dari Taman Kanak-Kanak Kepompong Alam Jakarta

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