BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF...

49
32 BAB IV PERANCANGAN SISTEM USULAN 4.1 Tahapan Perancangan Sistem 4.1.1 Analisis Kebutuhan Dalam mengidentifikasi analisis kebutuhan, penulis akan membuat kebutuhan yang diperoleh berdasarkan kebutuhan pengguna dan kebutuhan sistem yang terkait dalam proses pendaftaran penerimaan siswa baru pada SMK Panjatek Bekasi yang diusulkan. 1. Kebutuhan Pengguna Kebutuhan pengguna dalam perancangan ini terbagi menjadi kebutuhan calon pendaftar siswa/i baru dan kebutuhan admin, sebagai berikut: A1. Kebutuhan Pengguna Sebagai Calon Siswa: a). Calon siswa dapat melihat informasi profil sekolah. b). Calon siswa dapat melihat daftar jurusan. c). Calon siswa dapat melihat fasilitas. d). Calon siswa dapat melihat prosedur daftar. e). Calon siswa dapat melihat hubungi kami. f). Calon siswa dapat melakukan register pendaftaran. g). Calon siswa dapat login dengan akun yang sudah dibuat. h). Calon siswa dapat melakukan pendaftaran dengan melengkapi profil siswa terlebih dahulu. i). Calon siswa juga dapat mengunggah/meng-upload kelengkapan dokumen.

Transcript of BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF...

Page 1: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

32

BAB IV

PERANCANGAN SISTEM USULAN

4.1 Tahapan Perancangan Sistem

4.1.1 Analisis Kebutuhan

Dalam mengidentifikasi analisis kebutuhan, penulis akan membuat kebutuhan

yang diperoleh berdasarkan kebutuhan pengguna dan kebutuhan sistem yang terkait

dalam proses pendaftaran penerimaan siswa baru pada SMK Panjatek Bekasi yang

diusulkan.

1. Kebutuhan Pengguna

Kebutuhan pengguna dalam perancangan ini terbagi menjadi kebutuhan calon

pendaftar siswa/i baru dan kebutuhan admin, sebagai berikut:

A1. Kebutuhan Pengguna Sebagai Calon Siswa:

a). Calon siswa dapat melihat informasi profil sekolah.

b). Calon siswa dapat melihat daftar jurusan.

c). Calon siswa dapat melihat fasilitas.

d). Calon siswa dapat melihat prosedur daftar.

e). Calon siswa dapat melihat hubungi kami.

f). Calon siswa dapat melakukan register pendaftaran.

g). Calon siswa dapat login dengan akun yang sudah dibuat.

h). Calon siswa dapat melakukan pendaftaran dengan melengkapi

profil siswa terlebih dahulu.

i). Calon siswa juga dapat mengunggah/meng-upload kelengkapan

dokumen.

Page 2: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

33

j). Calon siswa dapat memilih jurusan yang ada di menu tentang kami.

k). Calon siswa dapat melihat rincian pembayaran.

l). Calon siswa dapat membayar biaya pendaftaran.

m). Calon siswa dapat melihat menu proses.

n). Calon siswa dapat mengupload bukti pembayaran.

o). Calon siswa dapat mengecek status pembayaran dan cetak bukti

pendaftaran.

p). Calon siswa/i dapat mengikuti ujian tes online.

q). Calon siswa dapat melihat pengumuman.

r). Calon siswa dapat melakukan setting.

s). Calon siswa dapat logout.

A2. Kebutuhan Pengguna Sebagai Admin:

a). Admin dapat login dengan akun yang sudah dibuat.

b). Admin dapat mengelola data siswa.

c). Admin dapat mengelola data dokumen siswa.

d). Admin dapat mengelola data pendaftaran.

e). Admin dapat mengelola data ujian online.

f). Admin dapat mengelola data jurusan.

g). Admin dapat mengelola data kelas.

h). Admin dapat mengelola data laporan.

i). Admin dapat logout.

2. Kebutuhan Sistem

1) Pengguna harus melakukan log in terlebih dahulu untuk dapat mengakses

sistem dengan memasukan username dan password agar privasi masing-

masing pengguna tetap terjaga keamanannya.

Page 3: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

34

2) Sistem dapat mengelola pendaftaran, pembayaran, dokumen, ujian online,

pengumuman dan laporan.

3) Pengguna harus melakukan log out setelah selesai menggunakan sistem.

4.1.2 Rancangan Use Case Diagram

A. Use Case Diagram Front End

Gambar IV.1. Use Case Diagram Bagian Front End

uc Use Case Front End Calon Siswa

Sistem

Calon Siswa

Melakukan

registrasi

Isi data

Melakukan

Login

Input Username dan

Password

Melihat Profil

Sekolah

Melihat Fasilitas

Sekolah

Melihat Prosedur

Daftar

Melihat Hubungi

Kami

Melihat Rincian

Pembayaran

Melakukan Isi Profil

Melakukan Upload

Berkas

Melakukan

Pemilihan Jurusan

Melakukan

Pembayaran

Melihat Menu

Proses

Melakukan Upload

Bukti Pembayaran

Mencetak Bukti

PendaftaranMelakukan Uj ian

Online

Melihat

Pengumuman Melakukan Setting

Melakukan Logout

«extend»

«extend»

«extend»

«extend»

«extend»

«include»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«include»

«extend»

«extend»

«extend»

«extend»

Page 4: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

35

Tabel IV.1.

Deskripsi Use Case Diagram Bagian Front End

Use Case Name Front End

Requirements A1

Goal Calon siswa dapat login dan melihat halaman

Front End.

Pre-Conditions Calon siswa input username dan password.

Post-Conditions Calon siswa dapat login.

Failed end Condition Salah input username dan password tidak bisa

masuk ke dashboard calon siswa.

Actors Calon siswa

Main Flow/ Basic Path

1. Log in

2. Calon siswa dapat melihat profil

sekolah

3. Calon siswa dapat melihat fasilitas

4. Calon siswa dapat melihat prosedur

daftar

5. Calon siswa dapat melihat hubungi

kami

6. Calon siswa dapat melakukan isi profil

7. Calon siswa dapat melakukan upload

berkas

8. Calon siswa dapat melakukan pemilihan

jurusan

9. Calon siswa dapat melihat rincian

pembayaran

10. Calon siswa dapat melakukan

pembayaran

11. Calon siswa dapat melihat menu proses

12. Calon siswa melakukan upload bukti

pembayaran

13. Calon siswa dapat mencetak bukti

pendaftaran

14. Calon siswa melakukan ujian online

15. Calon siswa dapat melihat pengumuman

16. Calon siswa dapat melakukan setting

17. Log out

Alternate Flow/Invariant A

A1. Sistem menampilkan menu halaman

dashboard

A2. Sistem menampilkan profil sekolah

A3. Sistem menampilkan fasilitas

A4. Sistem menampilkan prosedur daftar

A5. Sistem menampilkan hubungi kami

A6. Sistem menampilkan profil

Page 5: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

36

A7. Sistem menampilkan penyerahan berkas

A8. Sistem menampilkan daftar jurusan

A9. Sistem menampilkan rincian pembayaran

A10. Sistem menampilkan pendaftaran

A11. Sistem menampilkan proses

A12. Sistem menampilkan proses

A13. Sistem menampilkan proses

A14. Sistem menampilkan ujian online

A15. Sistem menampilkan pengumuman

A16. Sistem menampilkan setting

Invariant B

B1. Calon siswa memilih kriteria

B2. Sistem tidak menemukan data yang dicari

B3. Sistem menampilkan pesan “Data yang

dicari tidak ditemukan”

B. Use Case Diagram Back End

Gambar IV.2. Use Case Diagram Bagian Back End

uc Use Case Back End Admin

Sistem

Admin

Melakukan Login

Input Username dan

Password

Mengelola Data

Siswa

Mengelola Data

Dokumen Siswa

Mengelola Data

Pendaftaran

Mengelola Data

Uj ian Online

Mengelola Data

Jurusan

Mengelola Laporan

Melakukan Logout

Menambah Data

Siswa

Mengubah

Data Siswa

Menghapus

Data Siswa

Menambah

Dokumen Siswa

Menghapus

Dokumen Siswa

Mencetak

Dokumen Siswa

Menghapus Data

Pendaftaran

Mengubah Data

Pendaftaran

Mengelola Data

Kelas

Menambah

Data Uj ian

Mengubah

Data Uj ian

Menambah

Data Jurusan

Mengubah

Data Jurusan

Menambah Data

Kelas

Menghapus Data

Kelas

Laporan Data

Pendaftaran

Laporan Data

Siswa

Laporan Data

Uj ian OnlineLaporan Data

Jurusan

Laporan Data

Kelas

Menambah Data

Siswa

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend»

«extend» «extend»

«extend»

«extend»«extend»

«include»

Page 6: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

37

Tabel IV.2.

Deskripsi Use Case Diagram Bagian Front End

Use Case Name Back End

Requirements A2

Goal Admin dapat login dan melihat halaman Back

End.

Pre-Conditions Admin input username dan password.

Post-Conditions Admin dapat login.

Failed end Condition Salah input username dan password tidak bisa

masuk ke dashboard admin.

Actors Admin

Main Flow/ Basic Path

1. Admin dapat login dengan akun yang

sudah dibuat.

2. Admin dapat mengelola data pendaftar.

3. Admin dapat mengelola data siswa.

4. Admin dapat mengelola data jurusan.

5. Admin dapat mengelola data kelas.

6. Admin dapat mengelola data ujian

online.

7. Admin dapat mengelola data berkas.

8. Admin dapat mengelola laporan.

9. Admin dapat logout.

Alternate Flow/Invariant A

A1. Sistem menampilkan menu halaman

dashboard admin.

A2. Sistem menampilkan data pendaftar.

A3. Sistem menampilkan siswa.

A4. Sistem menampilkan jurusan.

A5. Sistem menampilkan kelas.

A6. Sistem menampilkan ujian online .

A7. Sistem menampilkan berkas.

A8. Sistem menampilkan laporan

Invariant B

B1. Admin memilih kriteria

B2. Sistem tidak menemukan data yang dicari

B3. Sistem menampilkan pesan “Data yang

dicari tidak ditemukan”.

Page 7: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

38

4.1.3 Rancangan Activity Diagram

A. Activity Diagram Bagian Front End

Activity Diagram Front-End

Calon Siswa Sistem

Mulai

Membuka Halaman Web

Selesai

Menampilkan Halaman Web

Beranda Menu Utama Prosedur Daftar

Tentang Kami

My Account

Pilih?

Register LoginProfile

Tampil Register

Tampil Login

Tampil Profile

Tampil Tentang Kami

Tampil Cara Pembelian

Tampil Beranda

JurusanFasilitasProfile

Sekolah

Tampil Jurusan

Tampil Fasilitas

Tampil Profile Sekolah

Gambar IV.3. Activity Diagram Bagian Front End

B. Activity Diagram Register

Activity Diagram Register

Calon Siswa Sistem

Mulai

Pilih Menu Register

Masukkan Nama, Username, email, password, dan re-type

password

Pilih Register

Registrasi Berhasil

Tampil Halaman Register

Selesai

Gambar IV.4. Activity Diagram Register

Page 8: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

39

C. Activity Diagram Login Calon Siswa

Activity Diagram Login

Calon Siswa Sistem

Mulai

Login

Masukkan Username dan Password

Selesai

Cocok?

Tidak

Menampilkan Dashboard

Ya

Gambar IV.5. Activity Diagram Login Calon Siswa

D. Activity Diagram Profile

Activity Diagram Profile

Calon Siswa Sistem

Mulai

Profile

Masukkan data pribadi, orang tua dan upload foto

Selesai

Menampilkan Halaman Profile

Simpan

Menampilkan Halaman Profile

Data Berhasil di Simpan

Gambar IV.6. Activity Diagram Profile

E. Activity Diagram Penyerahan Berkas

Activity Diagram Penyerahan berkas

Calon Siswa Sistem

Mulai

Pilih Menu penyerahan berkas

Upload File NISN,Akte Keluarga,Ijasah SMP,SKHUN dan

ktp orang tua.

Pilih Upload

Data Berhasil di Simpan

Tampil Halaman Penyerahan Berkas

Selesai

Simpan

Tampil Dashboard

Gambar IV.7. Activity Diagram Penyerahan Berkas

Page 9: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

40

F. Activity Diagram Pendaftaran

Activity Diagram Pendaftaran

Customers Sistem

Mulai

Pilih Jurusan

Selesai

Tampil Halaman Jurusan

Pilih Jurusan dan tanggal pendaftaran

Daftar JurusanTampil rincian

Pembayaran Jurusan

Pilih Bayar

Pilih Bank

Tampil Informasi Pembayaran

Tampil rincian transfer bank

Pilih Konfirmasi Pembayaran

Tampil Pendaftaran Berhasil

Tampil halaman informasi jurusan

Gambar IV.8. Activity Diagram Pendaftaran

G. Activity Diagram Proses

Activity Diagram Menu Proses

Calon Siswa Sistem

Mulai

Proses

Selesai

Pilih

UploadCetak

Menampilkan Bukti Pembayaran

Menampilkan Bukti Pendaftaran

Isi data bukti

Upload Data Berhasil di Upload

Gambar IV.9. Activity Diagram Proses

Page 10: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

41

H. Activity Diagram Ujian Online

Activity Diagram Ujian Online

Calon Siswa Sistem

Mulai

Pilih Ujian Online

Pilih Mulai

Pilih Finish

Tampil Hasil Jawaban

Tampil Halaman Ujian Online

Selesai

Tampil Dashboard

Tampil Halaman Soal Ujian

Pilih Submit Tampil Hasil Ujian

Pilih kembali

Gambar IV.10. Activity Ujian Online

I. Activity Diagram Pengumuman

Activity Diagram Pengumuman

Calon Siswa Sistem

Mulai

Dashboard Calon Siswa

Pilih pengumuman

Selesai

Menampilkan Dashboard

Menampilaknn pengumuman

Gambar IV.11. Activity Diagram Pengumuman

Page 11: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

42

J. Activity Diagram Back End

K. Activity Diagram Login Admin

Activity Diagram Login

Admin Sistem

Mulai

Login

Masukkan Username dan

Password

Cocok?

Tidak

Menampilkan Dashboard

Ya

Selesai

Gambar IV.12. Activity Diagram Login Admin

L. Activity Diagram Data Pendaftar

Activity Diagram Data Pendaftar

Admin Sistem

Mulai

Dashboard Admin

Pilih Menu Data Pendaftar

Selesai

Menampilkan Menu Data Pendaftar

Edit

Pilh?

Hapus

Mengubah Data

Data Berhasil di Hapus

Data Berhasil di Ubah

Gambar IV.13. Activity Diagram Data Pendaftar

Page 12: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

43

M. Activity Diagram Data Siswa

Activity Diagram Data Siswa

Admin Sistem

Mulai

Dashboard Admin

Pilih Menu Data Siswa

Selesai

Menampilkan Menu Data Pendaftar

Cetak Laporan

Pilh?

Tambah Siswa

Menampilkan halaman form

Menampilkan PDF

Isi Data

Simpan

Data berhasil disimpan

Print Cetak PDF

Menampilkan Print

Gambar IV.14. Activity Diagram Data Siswa

N. Activity Diagram Jurusan

Activity Diagram Data Jurusan

Admin Sistem

Mulai

Dashboard Admin

Pilih Menu Data Jurusan

Selesai

Menampilkan Menu Data Jurusan

Cetak Laporan

Pilh?

Tambah Jurusan

Menampilkan halaman jurusan

Menampilkan PDF

Isi Data

Simpan

Data berhasil disimpan

Print Cetak PDF

Menampilkan Print

Gambar IV.15. Activity Diagram Data Jurusan

Page 13: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

44

O. Activity Diagram Data Kelas

Activity Diagram Data Kelas

Admin Sistem

Mulai

Dashboard Admin

Pilih Menu Data Kelas

Selesai

Menampilkan Menu Data Kelas

Cetak Laporan

Pilh?

Tambah Kelas

Menampilkan halaman kelas

Menampilkan PDF

Isi Data

Simpan

Data berhasil disimpan

Print Cetak PDF

Menampilkan Print

Gambar IV.16. Activity Diagram Data Kelas

P. Activity Diagram Ujian Online

Activity Diagram Ujian Online

Admin Sistem

Mulai

Dashboard Admin

Pilih Menu Ujian Online

Selesai

Menampilkan Menu Ujian Online

Tambah Ujian

Menampilkan halaman data soal

Isi Soal

Simpan

Data berhasil disimpan

Gambar IV.17. Activity Diagram Ujian Online

Page 14: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

45

Q. Activity Diagram Berkas

Activity Diagram Berkas

Admin Sistem

Mulai

Dashboard Admin

Pilih Menu Berkas

Selesai

Menampilkan Menu Berkas

Mencari Berkas

Menampilkan halaman Berkas

Download Berkas

Berkas di Download

Gambar IV.18. Activity Diagram Berkas

4.1.4 Rancangan Dokumen Sistem Usulan

Rancangan dokumen merupakan penjelasan mengenai dokumen - dokumen

yang digunakan pada pendaftaran siswa baru SMK Panjatek Bekasi sebagai

kebutuhan data, sehingga menghasilkan informasi yang berguna dalam sistem

informasi pendaftaran siswa baru SMK Panjatek Bekasi. Adapun dokumen-dokumen

yang digunakan pada pendaftaran siswa baru SMK Panjatek Bekasi yang berkaitan

dengan pengelolaan informasi penerimaan siswa baru dibedakan menjadi dua jenis

yaitu dokumen masukan dan keluaran.

A. Bentuk Dokumen Masukan

1. Nama Dokumen : Form Data Profile

Fungsi : Sebagai tempat untuk melakukan pendaftaran

Sumber : Siswa

Tujuan : Admin

Media : Online

Jumlah : 1 halaman

Page 15: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

46

Frekuensi : Setiap ada pendaftaran

Bentuk : Lihat lampiran C.1

2. Nama Dokumen : Data Proses

Fungsi : Sebagai tempat untuk upload bukti pembayaran

Sumber : Siswa

Tujuan : Admin

Media : Online

Jumlah : 1 halaman

Frekuensi : Setiap ada pembayaran

Bentuk : Lihat lampiran C.2

3. Nama Dokumen : Data Berkas

Fungsi : Sebagai tempat untuk upload berkas

Sumber : Siswa

Tujuan : Admin

Media : Online

Jumlah : 2 halaman

Frekuensi : Setiap ada pembayaran

Bentuk : Lihat lampiran C.3

B. Bentuk Dokumen Keluaran

1. Nama Dokumen : Cetak Bukti Pendaftaran

Fungsi : Sebagai bukti telah melakukan pendaftaran

Sumber : Admin

Tujuan : Siswa

Media : Dokumen cetakan komputer

Jumlah : 2 halaman

Page 16: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

47

Frekuensi : Setiap ada transaksi pembayaran

Bentuk : Lihat lampiran D.1

2. Nama Dokumen : Laporan

Fungsi : Sebagai bukti laporan

Sumber : Admin

Tujuan : Pimpinan

Media : Dokumen cetakan komputer

Jumlah : 1 halaman

Frekuensi : Setiap bulan

Bentuk : Lihat lampiran D.2

4.1.5 Rancangan Prototype

A. Interface Front End

1. Halaman Interface Index

Gambar IV.19. Halaman Interface Index

Page 17: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

48

2. Halaman Interface Profile Sekolah

Gambar IV.20. Halaman Interface Profile Sekolah

3. Halaman Interface Fasilitas Sekolah

Gambar IV.21. Halaman Interface Fasilitas Sekolah

Page 18: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

49

4. Halaman Interface Jurusan Sekolah

Gambar IV.22. Halaman Interace Jurusan Sekolah

5. Halaman Interface Hubungi Kami

Gambar IV.23. Halaman Interface Hubungi Kami

Page 19: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

50

6. Halaman Interface Prosedur Daftar

Gambar IV.24. Halaman Interface Prosedur Daftar

7. Halaman Interface Register

Gambar IV.25. Halaman Interface Register

Page 20: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

51

8. Halaman Interface Login

Gambar IV.26. Halaman Interface Login

9. Halaman Interface Dashboard Calon Siswa

Gambar IV.27. Halaman Interface Dashboard Calon Siswa

10. Halaman Interface Ujian Online Calon Siswa

Gambar IV.28. Halaman Interface Ujian Online Calon Siswa

Page 21: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

52

11. Halaman Interface Mulai Ujian Online Calon Siswa

Gambar IV.29. Halaman Interface Mulai Ujian Online Calon Siswa

12. Halaman Interface Selesai Ujian Online Calon Siswa

Gambar IV.30. Halaman Interface Selesai Ujian Online Calon Siswa

Page 22: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

53

13. Halaman Interface Hasil Ujian Online Calon Siswa

Gambar IV.31. Halaman Interface Hasil Ujian Online Calon Siswa

14. Halaman Interface Pengumuman Calon Siswa

Gambar IV.32. Halaman Interface Pengumuman Calon Siswa

Page 23: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

54

15. Halaman Interface Pengaturan Calon Siswa

Gambar IV.33. Halaman Interface Pengaturan Calon Siswa

16. Halaman Interface Rincian Pendaftaran Calon Siswa

Gambar IV. 34. Halaman Interface Rincian Pendaftaran Calon Siswa

Page 24: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

55

17. Halaman Interface Konfirmasi Pendaftaran

Gambar IV.35. Halaman Interface Konfirmasi Pendaftaran Calon Siswa

18. Halaman Interface Berhasil Pendaftaran

Gambar IV.36. Halaman Interface Berhasil Pendaftaran Calon Siswa

Page 25: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

56

B. Interface Back End

1. Halaman Interface Index Admin

Gambar IV.37. Halaman Interface Index Admin

2. Halaman Interface Data Pendaftar Admin

Gambar IV.38. Halaman Interface Data Pendaftar Admin

Page 26: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

57

3. Halaman Interface Data Siswa Admin

Gambar IV.39. Halaman Interface Data Siswa Admin

4. Halaman Interface Data Jurusan Admin

Gambar IV.40. Halaman Interface Data Jurusan Admin

Page 27: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

58

5. Halaman Interface Tambah Data Jurusan Admin

Gambar IV.41. Halaman Interface Tambah Data Jurusan Admin

6. Halaman Interface Kelas Admin

Gambar IV.41. Halaman Interface Kelas Admin

Page 28: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

59

7. Halaman Interface Tambah Kelas Admin

Gambar IV.42. Halaman Interface Tambah Kelas Admin

8. Halaman Interface Ujian Online Admin

Gambar IV.43. Halaman Interface Ujian Online Admin

9. Halaman Interface Tambah Ujian Online Admin

Gambar IV.44. Halaman Interface Tambah Ujian Online Admin

Page 29: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

60

10. Halaman Interface Berkas Admin

Gambar IV.45. Halaman Interface Berkas Admin

11. Halaman Interface Berkas Detail Admin

Gambar IV.46. Halaman Interface Berkas Detail Admin

Page 30: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

61

4.2 Perancangan Perangkat Lunak

4.2.1 Entity Relationship Diagram (ERD)

Users

Id_user

emailpassword

Nama

Username

jenkel

Tgl_lahir

Tmpt_lahir

agama

alamat

No_hp

Thn_lulusNm_ayah

Asal_sklh

Nm_ibu

mengelola Siswa1 M

M Id_user

Nm_siswanis

Melakukan

pendaftaran

1

1

NIS

No_pendaftaran

Tgl_pendaftaran

status

Id_pembayaran

bukti

Id_berkas

Id_jurusan

ujianmengerjakan11

berkas

pembayaran

memiliki Soal

Memiliki

mengerjakan

1

1

1 M

memiliki

1M

Jurusan

Memilih

1

1

Memiiki kelasM

M

M

1

M

Id_jurusan

Nm_jurusan

Id_kelas

Id_kelas

Nm_kelas

menghasilkan

1

Id_soal

Pilih_b

soal Pilih_a

jawabanPilih_d Pilih_c

Id_ujian

Id_ujian

Hasil_ujian

Wkt_mulai

Wkt_selesai

Jml_benar

Jml_salah nilai

Id_soal

Tgl_ujian

No_pendaftaran

Id_berkas Nm_berkasUpload

SPAT

Id_pembayaran SPP

Seragam

LKS

Formulir

deskripsi

deskripsi

Gambar IV.48. Entity Relationship Diagram (ERD)

4.2.2 Logical Record Structure (LRS)

Id_user (PK)

Username

Password

Email

Nama

Jenkel

Tgl_lahir

Tmpt_lahir

Agama

Alamat

No_hp

Asal_sklh

Nm_ibu

Nm_ayah

Thn_lulus

Users

Nis (PK)

Id_user (FK)

Nm_siswa

Siswa

No_pendaftaran (PK)

Tgl_pendaftaran

Nis (FK)

Id_pembayaran (FK)

Id_berkas (FK)

Id_jurusan (FK)

Status

Bukti

Pendaftaran

Id_pembayaran (PK)

Spp

Spat

Seragam

Lks

Formulir

Pembayaran

Id_jurusan (PK)

Nm_jurusan

Id_kelas (FK)

Jurusan

Id_kelas (PK)

Nm_kelas

Id_ujian (FK)

Kelas

Id_ujian (PK)

Id_soal (FK)

No_pendaftaran (FK)

Wkt_mulai

Wkt_selesai

Tgl_ujian

Jml_benar

Jml_salah

Nilai

Hasil_ujian

Ujian

Id_soal (PK)

Soal

Pilih_a

Pilih_b

Pilih_c

Pilih_d

jawaban

Soal

Id_berkas (PK)

Nm_berkas

Upload

berkas

M

1 1

1

1

1

1

M

1

M

1

1

M

1

M

M

M

1

Gambar IV.49. Logical Record Structure (LRS)

Page 31: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

62

4.2.3 Spesifikasi File

1. Spesifikasi File User

Nama File : User

Akronim : User

Fungsi : untuk menyimpan data user

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang record : 291 Byte

Kunci Field : id_user

Software : Mysql

Tabel IV.3.

Spesifikasi File User

No Elemen data Nama Field Tipe Size Ket

1. Id user Id_user Varchar 8 Primary Key

2. Username Username Varchar 25

3. Password Password Varchar 25

4. Email Email Varchar 25

5. Nama Nama Varchar 25

6. Jenis kelamin Jenkel Varchar 11

7. Tempat Lahir tgl_lahir Varchar 11

8. Tanggal Lahir tmpt_lahir Date

9. Agama Agama Varchar 11

10. Asal Sekolah asal_sklh Varchar 25

11. Alamat Alamat Varchar 35

12. Nama ibu nm_ibu Varchar 25

13. Nama ayah nma_ayah Varchar 25

14. Tahun Lulus thn_lulus Varchar 15

13. No Telepon no_telp Int 25

Page 32: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

63

2. Spesifikasi File Siswa

Nama File : Siswa

Akronim : Siswa

Fungsi : untuk menyimpan data pendaftaran

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang record : 58 Byte

Kunci Field : id_siswa

Software : Mysql

Tabel IV.4.

Spesifikasi File Siswa

No Elemen data Nama Field Tipe Size Ket

1. Nis Nis Varchar 8 Primary Key

2. Id_user Id_user Varchar 25 Foreign Key

3. Nm_siswa Nm_siswa Varchar 25

3. Spesifikasi File Ujian

Nama File : Ujian

Akronim : Ujian

Fungsi : untuk menyimpan data ujian

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang record : 120 Byte

Page 33: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

64

Kunci Field : id_ujian

Software : Mysql

Tabel IV.5.

Spesifikasi File Ujian

No Elemen data Nama Field Tipe Size Ket

1. Id Ujian id_ujian Varchar 8 Primary Key

2. Id Soal Id_soal Varchar 25 Foreign Key

3. No Pendaftaran No_pendaftaran Int 15 Foreign Key

4. Waktu Mulai Wkt_mulai Int 11

5. Waktu Selesai Wkt_selesai Int 11

6. Tanggal Ujian Tgl_ujian Date

7. Jumlah Benar Jml_benar Int 11

8. Jumlah salah Jml_salah Int 11

9. Nilai Nilai Int 11

10. Hasil Ujian Hasil_ujian Int 11

4. Spesifikasi File Kelas

Nama File : Kelas

Akronim : Kelas

Fungsi : untuk menyimpan data kelas

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang record : 41 Byte

Kunci Field : id_kelas

Software : Mysql

Tabel IV.6.

Spesifikasi File Kelas

No Elemen data Nama Field Tipe Size Ket

1. Id kelas id_kelas Varchar 8 Primary Key

Page 34: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

65

2. Nama kelas Nm_kelas Varchar 25

3. Id ujian Id_ujian Varchar 8 Foreign Key

5. Spesifikasi File Pendaftaran

Nama File : Pendaftaran

Akronim : Pendaftaran

Fungsi : untuk menyimpan data pendaftaran

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang record : 89 Byte

Kunci Field : id_pendaftaran

Software : Mysql

Tabel IV.7.

Spesifikasi File Pendaftaran

No Elemen data Nama Field Tipe Size Ket

1. No Pendaftaran No_pendaftaran Int 15 Primary Key

2. Tanggal

Pendaftaran

Tgl_pendaftaran Int 11

3. Nis Nis Varchar 8 Foreign Key

4. Id Pembayaran Id_pembayaran Varchar 11 Foreign Key

5. Id Berkas Id_berkas Varchar 11 Foreign Key

6. Id Jurusan Id_jurusan Varchar 11 Foreign Key

7. Status Status Varchar 11

8. Bukti Bukti Varchar 11

6. Spesifikasi File Jurusan

Nama File : Jurusan

Akronim : Jurusan

Fungsi : untuk menyimpan data jurusan

Page 35: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

66

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang record : 41 Byte

Kunci Field : id_jurusan

Software : Mysql

Tabel IV.8.

Spesifikasi File Jurusan

No Elemen data Nama Field Tipe Size Ket

1. Id jurusan id_jurusan Varchar 11 Primary Key

2. Nama jurusan Nm_jurusan Varchar 25

3. Id kelas Id_kelas Varchar 8 Foreign Key

7. Spesifikasi File Soal

Nama File : Soal

Akronim : Soal

Fungsi : untuk menyimpan data soal

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang record : 675 Byte

Kunci Field : id_soal

Software : Mysql

Page 36: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

67

Tabel IV.9.

Spesifikasi File Soal

No Elemen data Nama Field Tipe Size Ket

1. Id soal Id_soal Varchar 25 Primary Key

2. Soal soal Varchar 255

3. Pilih A Pilih_a Varchar 35

4. Pilih B Pilih_b Varchar 35

5. Pilih C Pilih_c Varchar 35

6. Pilih D Pilih_d Varchar 35

7. Jawaban Jawaban Varchar 255

8. Spesifikasi File Pembayaran

Nama File : Pembayaran

Akronim : Pembayaran

Fungsi : untuk menyimpan data pembayaran

Tipe File : File Transaksi

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang record : 186 Byte

Kunci Field : id_pembayaran

Software : Mysql

Tabel IV.10.

Spesifikasi File Pembayaran

No Elemen data Nama Field Tipe Size Ket

1. Id Pembayaran Id_pembayaran Varchar 11 Primary Key

2. SPP Spp Int 35

3. SPAT Spat Int 35

4. Seragam Seragam Int 35

5. Lks Lks Int 35

6. Formulir Formulir Int 35

Page 37: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

68

9. Spesifikasi File Berkas

Nama File : Berkas

Akronim : Berkas

Fungsi : untuk menyimpan data berkas

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang record : 41 Byte

Kunci Field : id_berkas

Software : Mysql

Tabel IV.11.

Spesifikasi File Berkas

No Elemen data Nama Field Tipe Size Ket

1. Id Berkas id_berkas Varchar 11 Primary Key

2. Nama berkas Nm_berkas Varchar 25

3. Upload Upload Varchar 8

4.2.4 Class Diagram

Gambar IV.50. Class Diagram

class Penerimaan Siswa Baru

Users

- agama

- alamat

- asal_sklh

- email

- jenkel

- nama

- nm_ayah

- nm_ibu

- no_hp

- password

- tgl_lahir

- thn_lulus

- tmpt_lahir

- username

«PK»

- id_user

+ getbayarPendaftaran()

+ getCetakBukti()

+ geteditData()

+ getlihatStatus()

+ getlogin()

+ getmanageData()

+ getpendaftaran()

+ getpil ihJurusan()

+ getregistrasi()

+ getUploadBukti()

+ getuploadData()

+ setbayarPendaftaran()

+ setcetakBukti()

+ seteditData()

+ setlihatStatus()

+ setLogin()

+ setManageData()

+ setPendaftaran()

+ setPilihJurusan()

+ setRegistrasi()

+ setUploadBukti()

+ setUploadData()

Siswa

- id_user

- nm_siswa

«PK»

- nis

+ getCetakUjian()

+ getdapatJurusan()

+ getdapatKelas()

+ geteditData()

+ getLihatPengumuman()

+ getLihatUjian()

+ getlogin()

+ getmanageData()

+ getTesUjian()

+ getujianOnline()

+ setCetakUjian()

+ setdapatJurusan()

+ setdapatKelas()

+ setEditData()

+ setLihatPengumuman()

+ setLihatUjian()

+ setLogin()

+ setManageData(): int

+ setTesUjian(): int

+ setUjianOnline(): int

Pendaftaran

- bukti

- id_berkas

- id_jurusan

- id_pembayaran

- nis

- status

- tgl_pendaftaran

«PK»

- no_pendaftaran

Pembayaran

- LKS

- Materi

- Seragam

- SPAT

- SPP

«PK»

- id_pembayaran

Uj ian

- hasil_ujian

- id_soal

- jml_benar

- jml_salah

- nilai

- no_pendaftaran

- tgl_ujian

- wkt_mulai

- wkt_selesai

«PK»

- id_ujian

Berkas

- nm_berkas

- upload

«PK»

- id_berkas

Jurusan

- id_kelas

- nm_jurusan

«PK»

- id_jurusan

Kelas

- id_ujian

- nm_kelas

«PK»

- id_kelas

Soal

- jawaban

- pil ih_a

- pil ih_b

- pil ih_c

- pil ih_d

- soal

«PK»

- id_soal1.*

memiliki

1

1

memiliki

1.*

1.*

memiliki 1.*

1

memiliki

1.*

1

mengerjakan

1

1

Mengelola

1.*

1

melakukan

1

1

menghasilkan

1.*

1

memilih

1

Page 38: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

69

4.2.5 Sequence Diagram

A. Sequence Diagram Front End

Gambar IV.51. Sequence Diagram Register

Gambar IV.52. Sequence Diagram Login Calon Siswa

sd Register

Calon siswa

form register koneksi databaseBeranda

3. mengisi form pendaftaran()

4. Simpandata()

2.FormRegister ()

1. Tampil()

sd login calon siswa

Calon Siswa

formloginberanda validasi koneksi database Dashboard

11. username dan password calon siswa()

4 : login()

2 : formlogin()

9 : execute()

14()«destroy»

7 : open()

12 : close()

5.()«create»

10 : getResult()

3 : masukan username dan password()

1 : tampil()

8 : queryCekLogin()

13 : ()«destroy»

6.()«create»

Page 39: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

70

Gambar IV.53. Sequence Diagram Profile Calon Siswa

Gambar IV.54. Sequence Diagram Penyerahan Berkas

sd Profile Calon Siswa

Calon siswa

beranda form profile koneksi database

2 : formprofile()

1 : tampil()

5 : menampilkan tampilan kembali()

3 : mengisi form profile()

4 : simpan data()

sd penyerahan berkas

Calon siswa

beranda form pernyerahan

berkas

koneksi database

2 : formpenyerahanberkas()

1 : tampil()

5 : menampilkan tampilan kembali()

3 : mengupload berkas()

4 : simpan data()

Page 40: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

71

Gambar IV.55. Sequence Diagram Pendaftaran

Gambar IV.56. Sequence Diagram Proses

sd pendaftaran

Calon siswa

beranda form jurusan koneksi database

4.daftarjurusan()

5.tampilrincianbiayajurusan()

2.formjurusan()

12.kembali kehalaman beranda()

1 : tampil()

10.pil ihkonfirmasi pembayaran()

8.pil ih bank()

6.pil ihbayar()

3 : pil ihjurusan dan tglpendaftaran()

4.menampilkanjurusan()

11.tampilpendaftaranberhasil()

9.tampilrinciantransferbank()

7,tampilinformasipembayaran()

sd proses

Calon siswa

form proses koneksi databaseBeranda

3. pil ih cetak()

6.isi data bukti()

4.pil ih upload()

7. upload()

2.FormProses ()

1. Tampil()

8. data berhasil disimpan()

5.menampilkan halaman()

Page 41: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

72

Gambar IV.57. Sequence Diagram Ujian Online

Gambar IV.58. Sequence Diagram Pengumuman

sd uj ianonline

Calon siswa

beranda form pengumuman koneksi database

10.pilihkembali()

8.pil ihsubmit()

6.pil ihfinish()

9.simpanhasil ujian()

2.formujianonline()

11.kembali kehalaman beranda()

1 : tampil()

10.tampilhasilujian

()

3.tampilujianonline()

7.tampilhasiljawaban()

5.menampilkansoal()

4.pil ihmulai()

sd pengumuman

Calon siswa

form pengumuman koneksi databaseBeranda

3.menampilkan form pengumuman()

2.FormPengumuman

()

1. Tampil()

Page 42: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

73

B. Sequence Diagram Back End

Gambar IV.59. Sequence Diagram Login Admin

Gambar IV.60. Sequence Diagram Data Pendaftar

sd login admin

admin

formloginberanda validasi koneksi database admin

11. username dan password siswa()

4 : login()

2 : formlogin()

9 : execute()

14()«destroy»

7 : open()

12 : close()

5.()«create»

10 : getResult()

3 : masukan username dan password()

1 : tampil()

8 : queryCekLogin()

13 : ()«destroy»

6.()«create»

sd Data Pendaftar

Admin

beranda Data Pendaftar koneksi database

7. mengubah data()

1 : tampil()

4 : hapus data()

8. menampilkan simpan()

6. menampilkan halaman edit()

2 : form pendaftar

()

5 : edit data()

3 : menampilkan data pendaftar()

Page 43: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

74

Gambar IV.61. Sequence Diagram Data Siswa

Gambar IV.62. Sequence Diagram Data Jurusan

sd Data Siswa

Admin

beranda Data Siswa koneksi database

7. mengubah data()

1 : tampil()

4 : hapus data()

8. menampilkan simpan()

6. menampilkan halaman edit()

2 : form data siswa()

5 : tambah data()

3 : menampilkan data siswa()

sd Data Jurusan

Admin

beranda Data Jurusan koneksi database

7. mengubah data()

1 : tampil()

4 : hapus data()

8. menampilkan simpan()

6. menampilkan halaman edit()

2 : form data jurusan

()

5 : tambah data()

3 : menampilkan data jurusan

()

Page 44: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

75

Gambar IV.63. Sequence Diagram Data Kelas

Gambar IV.64. Sequence Diagram Ujian Online

sd Data Kelas

Admin

beranda Data Kelas koneksi database

7. mengubah data()

1 : tampil()

4 : hapus data()

8. menampilkan simpan()

6. menampilkan halaman edit()

2 : form data Kelas()

5 : tambah data()

3 : menampilkan data Kelas()

sd Data Uj ian Online

Admin

beranda Ujian Online koneksi database

7. mengubah data()

1 : tampil()

4 : hapus data()

8. menampilkan simpan()

6. menampilkan halaman edit()

2 : form data Ujian Online()

5 : tambah data()

3 : menampilkan Ujian Online()

Page 45: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

76

Gambar IV.65. Sequence Diagram Berkas

4.2.6 Spesifikasi Hardware dan Software

1. Spesifikasi Hardware

a. Server

1) CPU

(a) Processor Core i3

(b) RAM DDR2 4 GB

(c) Hard Disk 700 GB

2) Mouse

3) Keyboard

4) Monitor dengan resolusi layar minimum 1024x768

5) Koneksi internet dengan kecepatan 2 Mbps.

sd Data Uj ian Berkas

Admin

beranda Berkas koneksi database

7. mendownload berkas()

1 : tampil()

4 : mencari data

()

6. menampilkan halaman ()

2 : form data Berkas()

3 : menampilkan Berkas()

Page 46: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

77

b. Client

1) CPU

(a) Processor Core i3

(b) RAM DDR2 1GB

(c) Hard Disk 20 GB

2) Mouse

3) Keyboard

4) Monitor dengan resolusi layar minimum 1024x768

5) Koneksi internet dengan kecepatan 56 kbps.

2. Spesifikasi Software

A. Server

a. Sistem operasi yang umum digunakan : Microsoft Windows

b. Aplikasi bundle web server : Xampp 3.2.2.

(1) Aplikasi Apache Server v2

(2) Aplikasi PHP Server v5

(3) Aplikasi MySQL Server v5

(4) Aplikasi phpMyAdmin v3

c. Aplikasi Web Browser: Mozilla Firefox atau Google Chrome.

B. Client

a. Sistem operasi yang umum digunakan: Microsoft Windows

b. Aplikasi Web browser : Mozilla Firefox dan Google Chrome.

4.3 Jadwal Implementasi

Jadwal implementasi yang penulis lakukan dalam penyelesaikan rancangan data ini

tersusun dalam jadwal sebagai berikut:

Page 47: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

78

1. Persiapan Awal

Kegiatan yang yang bertujuan mengumpulkan data-data yang dibutuhkan

untuk proses pembuatan sistem program yang akan dibuat.

2. Analisa

Menganlisis data yang dikumpulkan dan membuat spesifikasi data kebutuhan

pengguna serta menyeleksi prgram lain yang sudah ada.

3. Desain Sistem

Kegiatan membuat kerangka sistem berdasarkan data yang dibutuhkan agara

proses sistem yang berjalan tidak berantakan.

4. Desain Perangkat Lunak

Kegiatan yang dilakukan pada tahap ini adalah mendesain sistem prgram

yang

ada berdasarkan desain sistem yang telah dibuat.

5. Pembuatan dan tes Program

Tahap ini adalah proses pembuatan program berdasarkan data yang

telah dikumpulkan sebelumnya. Seperti program pemasukan data siswa

baru, program login staf dan program output laporan. Setelah program dibuat,

maka dilakukan tes program guna mengetahui bagian mana yang salah dan

butuh perbaikan serta penambahan.

6. Tes sistem

Tahap ini bertujuan untuk melakukan uji coba terhadap sistem secara

keseluruhan dan sampai dimana proses tersebut dapat berlangsung

dengan baik dan benar, baik dari segi input, proses maupun output.

Page 48: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

79

7. Pelatihan

Tahap ini bertujuan untuk memberikan petunjuk dan pengarahan kepada

calon user yang akan menggunakan program sehingga calon user dapat

mengerti jalan program secara keseluruhan.

8. Pembuatan Buku Petunjuk

Bertujuan untuk memberikan informasi lebih dan mendalam mengenai

program seperti petunjuk pemakaian, input data, proses laporan serta

pemeliharaan sistem yang harus dilakukan.

9. Evaluasi dan optimalisasi

Tahap ini bertujuan untuk memperbaiki bagian-bagian yang kurang atau tidak

perlu sehingga program yang dijalankan dapat bekerja secara optimal.

Tabel IV.12.

Jadwal Implementasi

No KEGIATAN

WAKTU

BULAN I BULAN II BULAN III

1 2 3 4 1 2 3 4 1 2 3 4

1 Persiapan data awal

2 Analisa

3 Desain Sistem

4 Desain Perangkat Lunak

5 Pembuatan & Tes Program

6 Tes Sistem

7 Pelatihan

8 Pembuatan Buku Petunjuk

9 Evaluasi & Operasional

Page 49: BAB IV PERANCANGAN SISTEM USULAN · A4. Sistem menampilkan prosedur daftar A5. ... Print Cetak PDF Menampilkan Print Gambar IV.15 . Activity Diagram Data Jurusan . 44 ... dengan pengelolaan

80