31
BAB IV
RANCANGAN SISTEM DAN PROGRAM USULAN
4.1. Analisa Kebutuhan Software A. Tahapan Analisis
Sistem ujian saringan masuk siswa baru, dirancang agar memudahkan SMKN 1 Surade dalam seleksi calon siswa baru.
Spesifikasi kebutuhan (system requirment) dari sistem ujian saringan masuk siswa baru yaitu:
Halaman Siswa yaitu:
A1. Siswa dapat melakukan pendaftaran A2. Siswa dapat melakukan login.
A3. Siswa dapat pilih menu test ujian saringan masuk A4. Siswa dapat melihat hasil test
Halaman Admin yaitu: B1. Admin melakukan login.
B2. Admin dapat mengelola data pengguna B3. Admin dapat mengelola informasi
B4. Admin dapat mengelola data mata pelajaran B5. Admin dapat mengelola data soal
B6. Admin dapat mengelola data pendaftaran B7. Admin dapat lihat hasil test
B. Use Case Diagram
Penggambaran Use Case dari sistem yang akan dirancang sebagai berikut: 1. Use Case Diagram Halaman Siswa
uc Halaman Sisw a
Sisw a
Pendaftaran
Login
Data test uj ian saringan
Logout Hasil test
«include» «extend»
«include»
Gambar IV. 1 Use Case Diagram Halaman Siswa
Deskripsi Use Case Diagram Halaman Siswa:
Tabel IV. 1 Deskripsi Use Case Diagram Pendaftaran
Use Case Name Pendaftaran
Requirement A1
Goal Siswa dapat melakukan Pendaftaran
Pre-condition Isi data lengkap
Post-condition Data Siswa tersimpan
Failed end condition Siswa gagal simpan data
Primary Actor Siswa
Main Flow/Basic Path 1. System menampilkan halaman Pendaftaran
2. Siswa memasukkan data. 3. Siswa simpan data
Invariant -
Tabel IV. 2 Deskripsi Use Case Diagram Test Ujian Saringan
Use Case Name Test Ujian Saringan
Requirement A2,A3
Goal Siswa dapat simpan data
Post-condition System berhasil simpan data
Failed end condition System gagal simpan data
Primary Actor Siswa
Main Flow/Basic Path 1. Siswa melakukan login
2. Siswa pilih soal ujian
Invariant
Tabel IV. 3 Deskripsi Use Case Diagram Hasil Test
Use Case Name Hasil Test
Requirement A2,A4
Goal Siswa dapat menampilkan hasil test
Pre-condition Siswa melakukan login
Post-condition System berhasil menampilkan hasil test
Failed end condition System gagal menampilkan hasil test
Primary Actor Siswa
Main Flow/Basic Path 1. Siswa melakukan login
2. Siswa lihat hasil test
Invariant
2. Use Case Diagram Halaman Admin
uc Halaman Admin
Admin
Login
data pengguna
data informasi
data mata pelaj aran Logout data soal data pendaftaran hasil test laporan «include» «include» «include» «include» «include» «include» «include»
Gambar IV. 2 Use Case Diagram Halaman Admin
Deskripsi Use Case Diagram Halaman Admin:
Tabel IV.4 Deskripsi Use Case Diagram Login Admin
Use Case Name Login
Requirement B1
Goal Admin dapat masuk ke system
Post-condition Admin dapat masuk ke system
Failed end condition Admin tidak memilih login
Primary Actor Admin
Main Flow/Basic Path 1. Admin memilih login pada system.
2. Admin memasukkan Useraname dan
password
3. System akan menampilkan halaman utama
Invariant
Tabel IV. 5 Deskripsi Use Case Diagram Menu Data Pengguna
Use Case Name Mengelola Data Pengguna
Requirement B1,B2
Goal Admin dapat menambah, meng-edit dan
menghapus data pengguna
Pre-condition Admin telah login
Post-condition Data pengguna tersimpan, ter-update atau
terhapus
Failed end condition Gagal menyimpan, meng-update atau
menghapus
Primary Actor Admin
Main Flow/Basic Path 1. Admin melihat data pengguna
2. Admin memilih tambah pengguna
3. System menampilkan form data pengguna
Invariant
Tabel IV. 6 Deskripsi Use Case Diagram Data Informasi
Use Case Name Data Informasi
Requirement B1,B3
Goal Admin dapat mengelola data informasi
Pre-condition Admin memilih login admin
Post-condition System menampilkan data informasi
Failed end condition Admin gagal data informasi
Primary Actor Admin
Main Flow/Basic Path 1. Admin memilih menu data informasi
2. Admin mengelola data informasi 3. System menyimpan data informasi
Invariant
Tabel IV. 7 Deskripsi Use Case Diagram Data Mata Pelajaran
Use Case Name Data Mata Pelajaran
Requirment B1,B4
Pre-condition Admin melakukan login
Post-condition System menampilkan data mata pelajaran
Failed end condition Admin gagal mengelola data mata pelajaran
Primary Actor Admin
Main Flow/Basic Path 1. Admin memilih data mata pelajaran
2. Admin mengelola data mata pelajaran 3. System menampilkan data mata pelajaran
Invariant
Tabel IV. 8 Deskripsi Use Case Diagram Data Soal
Use Case Name Data Soal
Requirment B1,B5
Goal Admin dapat mengelola data soal
Pre-condition Admin melakukan login
Post-condition System menampilkan data soal
Failed end condition Admin gagal mengelola data soal
Primary Actor Admin
Main Flow/Basic Path 1. Admin memilih data soal
2. Admin mengelola data soal 3. System menampilkan data soal
Invariant
Tabel IV. 9 Deskripsi Use Case Diagram Data Pendaftaran
Use Case Name Data Pendaftaran
Requirment B1,B6
Goal Admin dapat mengelola data pendaftaran
Pre-condition Admin melakukan login
Post-condition System menampilkan data pendaftaran
Failed end condition Admin gagal mengelola data pendaftaran
Primary Actor Admin
Main Flow/Basic Path 1. Admin memilih data pendaftaran
2. Admin mengelola data pendaftaran 3. System menampilkan data pendaftaran
Invariant
Tabel IV. 10 Deskripsi Use Case Diagram Lihat Hasil Test
Use Case Name Lihat Hasil Test
Requirment B1,B7
Goal Admin dapat menampilkan lihat hasil test
Pre-condition Admin melakukan login
Post-condition System menampilkan lihat hasil test
Primary Actor Admin
Main Flow/Basic Path 1. Admin memilih lihat hasil test
2. Admin mengelola lihat hasil test 3. System menampilkan hasil test
Invariant
Tabel IV. 11 Deskripsi Use Case Diagram Menu Laporan
Use Case Name Mengelola Laporan
Requirment B1,B8
Goal Laporan ditampilkan
Pre-condition Data seluruh keuangan tersimpan
Post-condition Admin dapat masuk ke system
Failed end condition Admin tidak memilih menu laporan keuangan
Primary Actor Admin
Main Flow/Basic Path 1. Admin memilih menu laporan
2. Admin memilih laporan berdasarkan bulan 3. System menampilkan laporan
C. Activity Diagram
1. Activity Diagram Siswa Melakukan Pendaftaran
act Sisw a Daftar
System Sisw a
Start
Pilih Menu Pendaftaran Tampil Form Pendaftaran
isi data pendaftaran
Simpan Data Kumplit?
Finish [Ya] [Tidak]
Gambar IV.3 Activity Diagram Siswa Melakukan Pendaftaran
2. Activity Diagram Siswa Melakukan Ujian Saringan Masuk
act Halaman User
System Sisw a
Start
Melakukan Login
Input Username dan
Passw ord Cek Data
Sesuai?
Tampil Halaman Sisw a Pilih Menu Uj ian Saringan
Masuk
Isi Uj ian Saringan Masuk Simpan Data
Finish [Ya] [Tidak]
3. Activity Diagram Siswa Lihat Hasil Ujian
act Halaman User
System Sisw a
Start
Melakukan Login
Input Username dan
Passw ord Cek Data
Sesuai?
Tampil Halaman Sisw a Pilih Menu Lihat Hasil
Uj ian
Tampil Hasil Uj ian
Finish [Ya] [Tidak]
Gambar IV.5 Activity Diagram Siswa Lihat Hasil Ujian
4. Activity Diagram Login Admin
act Business Process Model
System Admin
Start
Input Username dan Passw ord
Cek Data
Sesuai?
Tampil Halaman Admin
Finish [Tidak]
[Ya]
5. Activity Diagram Mengelola Data Pengguna
act Mengelola Data
System Admin
Start
Pilih Menu Data Pengguna Tampil Data Pengguna
Pilih Tombol Tambah
Isi Data Pengguna Simpan Data
Finish
Gambar IV.7 Activity Diagram Mengelola Data Pengguna
6. Activity Diagram Mengelola Data Informasi
act Mengelola Data Informasi
System Admin
Start
Pilih Menu Informasi Tampil Data Informasi
kelola data
Informasi Simpan Data
Finish
Gambar IV.8 Activity Diagram Mengelola Data Informasi
7. Activity Diagram Mengelola Data Mata Pelajaran
act user
System Admin
Start
Pilih Menu Pelaj aran Tampil Data Pelaj aran
kelola data
Pelaj aran Simpan Data
Finish
8. Activity Diagram Mengelola Data Soal
act user
System Admin
Start
Pilih Menu Data Soal Tampil Data Soal
kelola data
soal Simpan Data
Finish
Gambar IV.10 Activity Diagram Mengelola Data Soal
9. Activity Diagram Laporan
act Laporan
System Admin
Start
Pilih Menu Laporan Tampil Form Laporan
Pilih Tanggal Bulan Tahun Tampil Laporan
Finish
Gambar IV.11 Activity Diagram Data Laporan
4.2 Desain
4.2.1 Database
Desain database dalam skripsi ini menggunakan Entity Relationship Diagram (ERD). Bentuk ERD yang digunakan dalam sistem sebagai berikut:
A. Entity Relationship Diagram (ERD). Tb_pendaftaran Tb_listtest Tb_hasil Tb_soal isi isi isi No_pendaftaran Tgl_pendaftaran Nama_calonsiswa No_hasil benar salah Id_soal Soal_test Status_test deskripsi No_list iduser No_ajuan Id_soal No_list Tgl_lahir alamat jk agama No_telp Status_test Jurusan Tb_matatest isi Kode_matatest Nama_matatest Kode_matatest No_list Jawaban_a Kunci_jawaban Jawaban_e Jawaban_d Jawaban_c Jawaban_b isi Id_soal No_hasil No_hasil No_pendaftaran photo
Gambar IV.12 Entity Relationship Diagram (ERD)
B. Logical Record Structure
Tb_hasil No_hasil benar salah No_pendaftaran ** Id_soal ** Tb_pendaftaran No_pendaftaran Tgl_pendaftaran Nama_calonsiswa Tgl_lahir alamat jk agama No_telp Status_test Jurusan photo No_list ** Tb_soal Id_soal Soal_test Jawaban_a Jawaban_b Jawaban_c Jawaban_d Jawaban_e Kunci_jawaban No_list ** Tb_matatest Kode_matatest Nama_matatest Tb_listtest No_list deskripsi Status_test Kode_matatest **
3. Spesifikasi File
a. Spesifikasi File Tabel Admin
Nama Database : db_smk
Nama File : Tabel Admin
Akronim : tb_Admin
Tipe File : Master
Akses File : Random
Panjang record : 66 Karakter
Kunci Field : nip
Tabel IV. 12 Spesifikasi File Tabel Admin
No. Elemen Data Nama Field Tipe Panjang Keterangan
1. NIP NIP Int 11 Primary Key
2. Nama Nama Varchar 15
3. Password Password Varchar 40
b. Spesifikasi File Tabel Mata Pelajaran Tes
Nama Database : db_smk
Nama File : Tabel Mata Pelajaran Tes
Akronim : Tb_matatest
Tipe File : Master
Akses File : Random
Panjang record : 21 Karakter
Primary Key : Kode_matatest
Tabel IV. 13 Spesifikasi File Tabel Mata Pelajaran Tes No. Elemen Data Nama_Field Tipe Panjang Keterangan
1. Kode Matatest Kode_matatest Int 11 Primary Key
2. Nama_matatest Nama_matatest Varchar 10
c. Spesifikasi File Tabel Daftar Tes
Nama Database : db_smk
Nama File : Tabel Daftar Tes
Akronim : Tb_listtest
Tipe File : Master
Akses File : Random
Panjang record : 62 Karakter
Primary Key : No_list
Tabel IV. 14 Spesifikasi File Tabel Daftar Test
No. Elemen Data Nama_Field Tipe Panjang Keterangan
1. No list No_list Int 11 Primary Key
2. Deskripsi Deskripsi Varchar 30
4. Kode Matatest Kode_matatest Int 11 Foreign Key
d. Spesifikasi File Tabel Soal
Nama Database : db_smk
Nama File : Tabel Soal
Akronim : Tb_soal
Tipe File : Master
Akses File : Random
Panjang record : 82 Karakter
Primary Key : Id_Soal
Tabel IV. 15 Spesifikasi File Tabel Soal
No. Elemen Data Nama_Field Tipe Panjang Keterangan
1. Id soal Id_soal Int 11 Primary Key
2. Soal test Soal_test Text -
3. Jawaban_a Jawaban_a Varchar 10
4. Jawaban_b Jawaban_b Varchar 10
5. Jawaban_c Jawaban_c Varchar 10
6. Jawaban_d Jawaban_d Varchar 10
7. Jawaban_e Jawaban_e Varchar 10
8. Kunci jawaban Kunci_jawaban Varchar 10
9. No list No_list Int 11 Foreign Key
e. Spesifikasi File Tabel Hasil Tes
Nama Database : db_smk
Nama File : Tabel Hasil Tes
Akronim : Tb_Hasil
Tipe File : Master
Akses File : Random
Panjang record : 64 Karakter
Primary Key : No_hasil
Tabel IV. 16 Spesifikasi File Tabel Hasil Tes No. Elemen
Data
Nama_Field Tipe Panjang Keterangan
1. No_hasil No_hasil Int 11 Primary Key
2. Benar Benar Int 11
3. Salah Salah Int 11
4. No Daftar No_pendaftaran Varchar 20 Foreign Key
5. Id soal Id_soal Int 11 Foreign Key
f. Spesifikasi File Tabel Pendaftaran
Nama Database : db_smk
Akronim : tb_pendaftaran
Tipe File : Transaksi
Akses File : Random
Panjang record : 67 Karakter
Primary Key : no_pendaftaran
Tabel IV. 13 Spesifikasi File Tabel Pendaftaran
No. Elemen Data Nama_Field Tipe Panjang Keterangan
1. No Daftar No_pendaftaran Varchar 20 Primary Key
2. Tanggal
daftar
Tgl_pendaftaran Date -
3. Nama Siswa Nama_calonsiswa Varchar 15
4. Tanggal lahir Tgl_lahir Date -
5. Alamat Siswa Alamat Varchar 30
6. Jenis Kel Jk Enum’L’,’P’ -
7. Agama Agama Varchar 10
8. No telp No_telp Varchar 15
9. Status test Status_test Varchar 10
10. Jurusan Jurusan Varchar 15
11. Photo Photo Text -
12. No_list No_list Int 11 Foreign Key
4.2.2 Software Architecture A. Component Diagram cmp Component Model Serv er database Uj ian Saringan Serv er Aplikasi Uj ian Saringan PSB Admin User «use»
Gambar IV.14 Component Diagram Sistem Ujian Saringan Pendaftaran Siswa Baru
B. Deployment Diagram deployment Deployment Model
«executionEnvironment» Serv er
«device» Admin Aplikasi Uj ian Saringan Masuk
«device» Serv er Aplikasi :: Uj ian Saringan PSB User «use» Tcp Ip «use»
Gambar IV.15 Deployment Diagram Sistem Ujian Saringan Pendaftaran Siswa Baru
4.2.3. Siswa Interface
A. Form Halaman Utama Siswa
B. Form Halaman Pendaftaran
Gambar IV.17 Form Halaman Pendaftaran C. Form Halaman Login Siswa
Gambar IV.18 Form Halaman Login Siswa D. Form Halaman Daftar Tes Ujian
E. Form Halaman Soal Tes Ujian Saringan
Gambar IV.20 Form Halaman Soal Tes Ujian Saringan F. Form Halaman Hasil Ujian
Gambar IV.21 Form Halaman Hasil Ujian G. Form Halaman Utama Admin
Gambar IV.22 Form Halaman Utama Admin H. Form Halaman Data Mata Pelajaran Ujian
I. Form Halaman Data Soal Tes
Gambar IV.24 Form Halaman Data Soal Tes J. Form Halaman Data Hasil Ujian
Gambar IV.25 Form Halaman Data Hasil Ujian K. Form Halaman Laporan
4.3 Code Generation
Daftar
<!DOCTYPE html>
<html lang="zxx" class="no-js"> <body>
<div class="container site-main-container bg-light"> <!-- Start top-post Area -->
<section class="top-post-area pt-10"> <div class="container no-padding">
<div class="row"> <div class="col-lg-12">
<img class="img-fluid" width="100%" src="<?php echo base_url('assets/img/banner.jpg') ?>" alt="">
</div>
<div class="news-tracker-wrap">
<h6><span>Pengumuman:</span> <a href="#">Astronomy Binoculars A Great Alternative</a></h6> </div> </div> </div> </div> </section>
<!-- End top-post Area --> <!-- Start latest-post Area -->
<section class="latest-post-area pb-120"> <div class="container no-padding">
<div class="row">
<div class="col-lg-8 post-list"> <!-- Start latest-post Area --> <div class="latest-post-wrap">
<h4 class="cat-title"><?php echo $content;?></h4>
<div class="single-latest-post row align-items-center">
<div class="col-lg-12 ">
<form
name="form" action="<?php echo base_url().'halaman_utama/SimpanPendaftaran'?>" enctype="multipart/form-data" method="post"> <div class="col-lg-12"> NO Pendaftaran <input type="text" name='no' class="form-control" value="<?php echo $kodeunik; ?>" readonly>
</div> <div class="col-lg-12"> Nama Lengkap <input name="nama" placeholder="Nama Lengkap" class="common-input mb-10 form-control" required="" type="text">
<div class="col-lg-12">
Tanggal Lahir
<input name="lahir" placeholder="Nama Lengkap" class="common-input mb-10 form-control" required="" type="date"> </div> <div class="col-lg-12"> Alamat lengkap
<textarea class="common-textarea common-input mb-10 form-control" name="alamat" placeholder="Alamat Lengkap" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter Messege'" required=""></textarea>
</div> <div class="col-lg-12">
Jenis Kelamin
<select name="jk" class="form-control common-input mb-10"> <option value="">Pilih Jenis Kelamin</option>
<option value="Laki-Laki">Laki-Laki</option> <option value="Perempuan">Perempuan</option> </select> </div> <div class="col-lg-12"> Agama/Kepercayaan
<select name="agama" class="form-control common-input mb-10"> <option value="">Pilih Agama</option>
<option value="Islam">Islam</option> <option value="Protestan">Protestan</option> <option value="Katolik">Katolik</option> <option value="Hindu">Hindu</option> <option value="Khonghuchu">Khonghuchu</option> </select> </div> <div class="col-lg-12"> No Telepon <input name="telp" placeholder="No Telepon" class="common-input mb-10 form-control" type="number">
class="col-lg-12"> Photo
<input name="gambar" placeholder="No Telepon" class="common-input mb-10 form-control" type="file">
class="col-lg-12">
<div class="alert-msg" style="text-align: left;"></div>
<button class="primary-btn primary" style="float: right;">SIMPAN PENDAFTARAN</button>
</div> <!-- End latest-post Area --> </div> <div class="col-lg-4"> <div class="sidebars-area"> <div class="single-sidebar-widget editors-pick-widget"> <h6 class="title">Informasi</h6> <div class="editors-pick-post"> <div class="post-lists"> $count = 0;
foreach ($informasi->result() as $row) : $count++;
?>
<div class="single-post d-flex flex-row"> <div class="thumb">
<img src="<?php echo $row->photo;?>img/e2.jpg" alt=""> </div>
<div class="detail">
<a href="image-post.html"><h6><?php echo $row->judul;?></h6></a> <ul class="meta">
<li><a href="#"><span class="lnr lnr-calendar-full"></span><?php echo $row->tgl; ?></a></li>
<li><a href="#"><span class="lnr lnr-bubble"></span>06</a></li> </ul> </div> </div> <?php endforeach;?> </div></div> </div> </div> </div> </div> </div> </section>
<!-- End latest-post Area --> </div>
4.4 Testing
Pengujian yang dilakukan dalam program ini adalah menggunakan
Blackbox testing.
A. Pengujian Terhadap Form Login Admin
Tabel IV.18 Hasil Pengujian Black Box Testing Halaman Login Admin
No. Skenario
pengujian
Test Case Hasil yang
diharapkan
Hasil pengujian
Kesimpulan
password tidak
diisi kemudian klik tombol login
: (kosong) Password : (kosong) menolak akses dan menampilkan “ Siswaname atau Password Anda Salah.” harapan 2 Mengetikan Username, dan password tidak diisi kemudian klik tombol login
Username: (ask) Password : (kosong) Sistem akan menolak akses dan menampilkan “Siswaname atau Password Anda Salah.” Sesuai harapan Valid 3 Mengetikan kondisi salah pada Username, dan password diisi salah kemudian klik tombol Login Username: (ask) (salah) Password : (12345) (salah) Sistem akan menolak akses dan menampilkan “Siswaname atau Password Anda Salah.” Sesuai harapan Valid 4 Mengetikan Siswaname, dan password dengan
data yang benar kemudian klik tombol Login Siswaname : (admin) (benar) Password : (admin) (benar) Sistem menerima akses login kemudian langsung menampilkan halaman utama Sesuai harapan Valid
B. Pengujian Terhadap Form Login Siswa
Tabel IV.19. Hasil Pengujian Black Box Testing Halaman Login Siswa
No. Skenario
pengujian
Test Case Hasil yang
diharapkan Hasil pengujian Kesimpulan 1 Username, dan password tidak diisi kemudian klik tombol login Username: (kosong) Password : (kosong) Sistem akan menolak akses dan menampilkan “Siswaname atau Password Anda Salah” Sesuai harapan Valid 2 Mengetikan Username, dan password tidak diisi kemudian klik tombol login Username : (ask) Password : (kosong) Sistem akan menolak akses dan menampilkan “Siswaname atau Password Anda Salah” Sesuai harapan Valid
3 Mengetikan kondisi salah pada Username dan password diisi salah kemudian klik tombol Login Username : (ask) (salah) Password : (12345) (salah) Sistem akan menolak akses dan menampilkan “Siswaname atau Password Anda Salah” Sesuai harapan Valid 4 Mengetikan Username, dan password dengan data yang benar kemudian klik tombol Login Username: (admin) (benar) Password : (admin) (benar) Sistem menerima akses login kemudian langsung menampilkan halaman utama Sesuai harapan Valid 4.3. Support
4.3.3. Spesifikasi Hardware dan Software
Tabel IV. 20 Spesifikasi Hardware Software
Kebutuhan Keterangan
Sistem Operasi Windows
Procesor Pentium IV RAM 512 MB Hardisk 20 GB CD-ROM 52x Monitor SVGA 12” Keyboard 108 key
Printer Laser Jet
Mouse Standard
Browser Mozila Firefox,Google Chrome,Safari
Software Macromedia Dreamweaver 8,Adobe
Dreamweaver CS3, XAMPP V 1.7.3
1.5. Spesifikasi Dokumen Sistem Usulan
1) Nama Dokumen : Form Pendaftaran
Fungsi : Sebagai form pendaftaran
Tujuan : Admin
Media : Tampilan
Format : Lampiran C.1.
2) Nama Dokumen : Formulir Bukti Pendaftaran
Fungsi : Sebagai bukti pendaftaran
Sumber : Siswa
Tujuan : Admin
Media : Cetak
