32
BAB IV
PERANCANGAN SISTEM USULAN
4.1. Tahap Perancangan Sistem
Tahap perancangan adalah bagian dari sebuah metode dalam membuat suatu
sistem yang berguna untuk memberi gambaran yang jelas mengenai sistem yang
akan dibuat. Dalam tahap perancangan sistem ini diuraikan mengenai analisa
kebutuhan, diagram use case, dan diagram aktivitas yang terkait dengan proses
berjalan yang diusulkan, serta menjelakan bagaimana rancangan dokumen sistem
usulan yang dibuat penulis serta rancangan prototype dari sistem yang dibuat.
4.1.1. Analisis Kebutuhan
1. Kebutuhan Pengguna
Dalam website pendaftaran siswa baru terdapat dua pengguna yang saling
berinteraksi dalam lingkungan sistem yaitu calon pendaftar yang nantinya menjadi
calon siswa setelah melakukam pendaftaran dan admin. Kedua pengguna ini
memiliki karakteristik interaksi dengan sistem yang berbeda-beda dan memiliki
kebutuhan informasi yang berbeda, seperti berikut:
AI. Skenario Calon Siswa
a) Mengakses web
b) Mengisi form pendaftaran pada halaman website
c) Mendapat username dan password untuk log in
d) Melihat hasil assessment dan hasil pendaftaran
e) Mencetak bukti pendaftaran
33
f) Mengedit dan memperbarui data diri
g) Log Out
A2. Skenario Admin
a) Mengakses halaman admin dengan log in terlebih dahulu
b) Melihat data pendaftaran
c) Mengelola data pendafataran
d) Menginput hasil assessment dan pendaftaran
e) Mengelola dan mencetak data sebagai laporan.
2. Kebutuhan Sistem
a. Calon siswa mengakses web kemudian mengisi form pendaftaran untuk
mendapatkan akun. Setelah mendapat akun pengguna dapat log in dengan
email dan password yang dimiliki untuk melihat status pendaftaran, mengedit
atau memperbaharui data diri.
b. Sistem memproses dan menyimpan data pendaftaran.
c. Sistem menampilkan informasi pendaftaran, langkah pendaftaran, informasi
hasil assessment dan hasil pendaftaran.
d. Admin harus melakukan log in untuk dapat mengelola data pendaftaran.
e. Admin melakukan log out setelah selesai mengakses halaman admin.
34
4.1.2. Rancangan Diagram Use Case
1. Use Case Diagram
Gambar IV. 1
Use Case Pendaftaran
2. Spesifikasi Use Case Diagram
Berikut adalah spesifikasi use case dari sistem pendaftaran siswa berbasis
web.
Calon Siswa:
A1. Calon Siswa membuka halaman web
A2. Isi form pendaftaran
A3. Log in bagi calon siswa yang memiliki akun
A4. Calon siswa melihat data diri (info peserta, ubah password, dan cetak
bukti pendaftaran)
35
A5. Calon melihat hasil assessment dan info penerimaan
A6. Calon siswa melakukan log out.
Admin:
B1. Admin melakukan log in
B2. Admin kelola data master (data peserta dan data orang tua)
B3. Admin input hasil as sessment
B4. Admin input hasil pendaftaran
B5. Admin kelola informasi
B6. Admin kelola laporan
B7. Admin Log Out
Tabel IV. 1
Deskripsi Use Case Pendaftaran Siswa
Use Case Name
Pendaftaran Siswa
Requirements
A1-A8, B1-B7
Goal
Pendaftaran Sukses
Pre-Condition
Calon pendaftar mengisi form
pendaftaran
Post-Condition
Admin menginput hasil assessment dan
pendaftaran
Failed end Condition
Calon pendaftar tidak dapat mendaftar,
calon siswa tidak dapat log in pada
akunnya
Actors Calon Siswa dan Admin
Main Flow/ Basic Path 1. Calon pendaftaran masuk halam web
36
2. Calon pendaftaran mengisi form
pendaftaran dan submit pendaftaran
3. Sistem menampilkan form
pendaftaran
4. Sistem menyimpan data pendaftaran
5. Calon Siswa melakukan login dan
menctak bukti pendaftaran
6. Admin menginput hasil pendaftaran
7. Sistem menampilkan hasil pendaftaran
Alternatif Flow/Invariant A
Calon siswa yang tidak diterima pada
kelas reguler akan diarahkan ke kelas
karya sesuai kemampuannya.
Invariant B
Admin menginput hasil pendaftaran,
sistem menampilkan opsi kelas karya
bagi calon siswa yang tidak dapat masuk
kelas regular
37
4.1.3. Rancangan Diagram Aktivitas
1. Activity Diagram Pengunjung
Activity Diagram Pengunjung
Pengunjung Sistem
Phas
e
Akses webMenampilkan
halaman utama
Lihat informasi pendaftaran
Pilih Menu Pendaftaran
Menampilkan form pendaftaran
Isi Form pendaftaran
menyimpan data pendaftaran
Tampil Form Login Menampilkan Login
Gambar IV.2.
Activity Diagram Pengunjung
38
2. Activity Diagram Login Calon Siswa
Activity Diagram Login Calon Siswa
Calon Siswa Sistem
Ph
ase
Masukan username dan pasword
Pilih Log in
Menampilkan halaman log in
Tampilkan akun
Tidak
Ya
Gambar IV.3
Activity Diagram Login Calon Siswa
39
3. Activity Diagram Calon Siswa
Activity Diagram Calon Siswa
Calon Siswa Sistem
Phas
e
Pilih Menu
LIhat Info
Pilihan
Lihat Jadwal
Tampilkan Halaman
Lihat Hasil
Login
Gambar IV.4
Activity Diagram Calon Siswa
40
4. Activity Diagram Login Admin
Activity Diagram Login Admin
Admin Sistem
Ph
ase
Buka dashboard admin
Tampilkan halaman log in
Log in
Menampilkan halaman admin
Tidak
Ya
Gambar IV. 5
Activitty Diagram Login Admin
41
5. Activity Diagram Input Assesment
Activity Diagram Input Assesment
Admin Sistem
Ph
ase
Pilih Data Pendaftaran
Tampilkan Daftar Pendaftaran
Pilih Input Assessment
Menampilkan Form Input Assessment
Input Assessment
Simpan Assessment
Gambar IV. 6
Activity Diagram Input Assessment
42
6. Activity Diagram Laporan
Activity Diagram Halaman Info
Admin Sistem
Ph
ase
Pilih Laporan
Cetak Laporan
Laporan Penerimaan
Pilihan
Laporan Pendaftaran
Mencetak Laporan
Gambar IV.7
Activity Diagram Laporan
43
4.1.4 Rancangan Dokumen Sistem Usulan
1. Rancangan Dokumen Usulan Masukan
a. Rancangan Dokumen Form Pendaftaran
Nama Dokumen : Form Pendaftaran
Fungsi : Sebagai input pendaftaran
Sumber : Halaman website pendaftaran
Tujuan : Calon Siswa
Media : Layar
Jumlah : 1 halaman
Frekuensi : Setiap terjadi pendaftaran
Bentuk : Lihat lampiran C.1 dan C.2
b. Dokumen Input Hasil Pendaftaran
Nama Dokumen :Input Hasil Pendaftaran
Fungsi : Sebagai input data hasil pendaftaran
Sumber : Halaman data pendaftaran dashboard admin
Tujuan : Kepala Sekolah
Media : Layar
Jumlah : 1 halaman
Frekuensi : Setiap berakhirnya waktu pendaftaran
Bentuk : Lihat lampiran C.3
44
2. Rancangan Dokumen Usulan Keluaran
a. Rancangan Dokumen Bukti Pendaftaran
Nama Dokumen : Bukti Pendaftaran
Fungsi : Sebagai bukti pendaftaran
Sumber : Halaman website pendaftaran
Tujuan : Calon Siswa
Media : Kertas
Jumlah : 1 Lembar
Frekuensi : Setiap terjadi pendaftaran
Bentuk : Lihat lampiran D.1
b. Rancangan Dokumen Laporan Pendaftaran
Nama Dokumen : Laporan Pendaftaran
Fungsi : Laporan berkala dan arsip pendaftaran
Sumber : Admin
Tujuan : Kepala Sekolah
Media : Kertas
Jumlah : Tergantung pada banyaknya rekap
Frekuensi : Setiap tahun ajaran baru
Bentuk : Lihat lampiran D.2
4.1.5. Rancangan Prototype
Berikut adalah tampilan dari rancangan prototype halaman website yang telah
dibuat:
1. Web Calon Pendaftar
Halaman yang dibuat untuk calon pendaftar untuk mengisi form pendaftaran,
mendapat informasi pendaaftaran sebelum pendaftar mendapat akun.
45
a. Halaman Utama
Halaman utama adalah halaman yang pertama tampil ketika web diakses oleh
pengunjung. Pada halaman ini menampilkan informasi, profil yayasan serta menu
utama.
Gambar IV.8
Halaman Utama
46
b. Halaman Langkah Pendaftaran
Halaman ini berisi mengenai langkah-langkah pendaftaran pada web.
Gambar IV.9
Halaman Langkah Pendaftaran
c. Halaman Login
Halaman login berisi form login untuk masuk pada akun calon siswa.
Gambar IV.10
Form Login
47
d. Halaman Pendaftaran
Halaman pendaftaran berisi form pendaftaran calon siswa yang harus diisi
oleh peserta pendaftaran.
Gambar IV.11
Halaman Form Pendaftaran
48
2. Halaman Calon Siswa
Halaman calon siswa adalah halaman pendaftar yang telah mengisi form
pendaftaran, dan telah memiliki akun. Berikut rancangan halaman calon siswa:
a. Halaman Peserta
Halaman Peserta berisi mengenai informasi peserta dan halaman untuk
mengubah password default yang diberikan.
Gambar IV.12
Halaman Peserta
49
b. Halaman Informasi
Halaman ini berisi informasi yang terkait dengan pendaftaran seperti jadwal
assessment, pengumpulan berkas, dan lain-lain.
Gambar IV.13
Halaman Informasi
50
3. Halaman Admin
Halaman ini merupakan halaman admin, pada halaman ini admin melihat dan
megelola data pendaftaran yang masuk dari peserta pendaftaran.
a. Halaman Login Admin
Untuk masuk pada halaman utama admin, user harus log in terlebih dahulu
dengan memasukan username dan password.
Gambar IV.14
Halaman Login Admin
b. Halaman Utama Admin
Gambar IV.15
Halaman Utama Admin
51
c. Halaman Data Peserta Pendaftaran
Halaman ini berisi daftar peserta pendaftaran siswa baru yang telah melakukan
pendaftaran melalui web.
Gambar IV.16
Data Peserta Pendaftaran
d. Halaman Data Orang Tua
Halaman ini menyimpan data Orang Tua pendaftar.
Gambar IV.17
Data Orang Tua
52
4.2. Perancangan Perangkat Lunak
Rancangan peraangkat lunak ini fokus kepada enam hal, yaitu: Entity
Relationship Diagram (ERD), Logical Structure Record (LRS), Spesifikasi File,
Class Diagram, Squence Diagram, serta spesifikasi Hardware dan Software.
4.2.1. Entity Relationship Diagram (ERD)
Peserta Pendaftaran
Orang TuaKondisi
Penerimaan
Melakukan1 1
Memiliki
1
1
Memiliki
1
1
Memiliki
1
1
jumlah_saudara
waktu_tempuh
jarak_tempuh
berat_badan
tinggi_badan
memegang
mendengar
melihat
berbicara
bergerak
id_kondisi
kode_peserta
berjalan
penghasilan_wali
id_orangtua
kode_peserta
pendidikan_wali
pekerjaan_wali
nama_wali
nama_ayah
pekerjaan_ayah
penghasilan_ibu
pendidikan_ibu
penghasilan_ayah
pekerjaan_ibu
pendidikan_ayah
nama_ibu
tanggal_pe
nerimaan
kode_penerimaan
no_pendaftara
n
no_pendaftaran
kode_peserta
jenjang_pendidikan
tanggal_pendaftaran
keterangan
statuspassword
no_kps
nama_lengkap
jenis_kelamin
nisnpenerima_kps
no_skhun
nik
tempal_lahir
tanggal_lahir
agama
alamat_tinggal
no_telpon
jenis_tinggal
rt
rw
kelurahan
kecamatan
Kode_peserta
kota
provinsi
alat_transportasi
lembar_pemeriksaan
lembar_seleksi
Gambar IV.18
Entity Relationship Diagram (ERD)
53
4.2.2. Logical Structure Diagram (LRS)
Tabel_Peserta
Tabel_kondisi
Tabel_orangtua
Tabel_pendaftaran
Tabel_penerimaan
Kode_pesertaPK
nama_lengkap
jenis_kelamin
nisn
nik
tempat_lahir
tanggal_lahir
agama
alamat_tinggal
rt
rw
kelurahan
kecamatan
kota
provinsi
alat_transportasi
jenis_tinggal
no_telpon
no_skhun
penerima_kps
no_kps
password
id_kondisiPK
kode_pesertaFK
berjalan
bergerak
berbicara
melihat
memegang
mendengar
id_orangtuaPK
kode_pesertaFK
nama_ayah
no_pendaftaranPK
kode_pesertaFK
jenjang_pendidikan
id_penerimaanPK
no_pendaftaranFK
pekerjaan_ayah
pendidikan_ayah
penghasilan_ayah
nama_ibu
pekerjaan_ibu
pendidikan_ibu
penghasilan_ibu
nama_wali
pekerjaan_wali
pendidikan_wali
penghasilan_wali
tanggal_pendaftaran
keterangan
status tanggal_penerimaan
1:1
1:1
1:1
1:1
lembar_pemeriksaan
lembar_hasilseleksi
tinggi_badan
berat_badan
jarak_tempuh
waktu_tempuh
jumlah_saudara
Gambar IV.19
Logical Structure Record (LRS)
54
4.2.3. Spesifikasi File
Berikut adalah spesifikasi file pendaftaran yang disimpan pada basis data
dengan nama sipdb_master.
1. Spesifikasi File Kondisi
Nama File : Tabel Kondisi
Akronim : Tabel_kondisi
Fungsi : menyimpan data kondisi
Tipe File : File Detail
Organisasi File : Indexed sequential
Akses File : Random
Media : Harddisk
Panjang Record : 82
Kunci Field : Id_kondisi
Software : mysql
Tabel IV.2
Spesifikasi File Kondisi
No Elemen Data Nama Field Tipe Size Ket
1 Id kondisi Id_kondisi Integer 11 Primary Key
2 Kode peserta Kode_peserta Varchar 5
3 Berjalan Berjalan Integer 11
4 Bergerak Bergerak Integer 11
5 Berbicara Berbicara Integer 11
6 Melihat Melihat Integer 11
7 Memegang Memegang Integer 11
55
8 Mendengar Mendengar Integer 11
2. Spesifikasi File Orang Tua
Nama File : Tabel Orang Tua
Akronim : Tabel_Orangtua
Fungsi : menyimpan data orang tua
Tipe File : File Master
Organisasi File : Indexed Sequential
Akses File : Random
Media : Harddisk
Panjang Record : 791
Kunci Field : Id_orangtua
Software : mysql
Tabel IV.3
Spesifikasi File Orang Tua
No Elemen Data Nama Field Tipe Size Ket
1 Id orangtua Id_orangtua Integer 11 Primary Key
2 Kode peserta Kode_peserta Varchar 5
3 Nama ayah Nama_ayah Varchar 100
4 Pekerjaan ayah Pekerjaan_ayah Varchar 50
5 P endidikan ayah Pendidikan_ayah Varchar 25
6 Penghasilan ayah Penghasilan_ayah Varchar 50
7 Nama ibu Nama_ibu Varchar 100
8 Pekerjaan ibu Pekerjaan_ibu Varchar 100
9 Pendidikan ibu Pendidikan_ibu Varchar 50
10 Penghasilan ibu Penghasilan_ibu Varchar 25
11 Nama wali Nama_wali Varchar 100
12 Pekerjaan wali Pekerjaan_wali Varchar 100
56
13 Pendidikan wali Pendidikan_wali Varchar 50
14 Penghasilan wali Penghasilan_wali Varchar 25
3. Spesifikasi File Pendaftaran
Nama File : Tabel Pendaftaran
Akronim : Tabel_pendaftaran
Fungsi : menyimpan data pendaftaran
Tipe File : File Transaksi
Organisasi File : Indexed sequential
Akses File : Random
Media : Harddisk
Panjang Record : 215
Kunci Field : No_pendaftaran
Software : mysql
Tabel IV.4
Spesifikasi File Pendaftaran
No Elemen Data Nama Field Tipe Size Ket
1 No pendaftaran No_pendaftaran Varchar 10 Primary Key
2 Kode peserta Kode_peserta Varchar 5
3 Jenjang pendidikan Jenjang_pendidikan Varchar 50
4 Tanggal pendaftaran Tanggal_pendaftaran Date
5 Keterangan Keterangan Text
6 Verifikasi Verifikasi Varchar 100
7 Status Status Varchar 50
57
4. Spesifikasi File Penerimaan
Nama File : Tabel Penerimaan
Akronim : Tabel_penerimaan
Fungsi : menyimpan data penerimaan
Tipe File : File Transaksi
Organisasi File : Indexed sequential
Akses File : Random
Media : Harddisk
Panjang Record : 26
Kunci Field : Id_penerimaan
Software : mysql
Tabel IV.5
Spesifikasi File Penerimaan
No Elemen Data Nama Field Tipe Size Ket
1 Id penerimaan Id_penerimaan Integer 11 Primary Key
2 No pendaftaran No_pendaftaran Varchar 10
3 Tanggal penerimaan Tanggal_penerimaan Date
4 Hasil Pemeriksaan Hasil_pemeriksaan Text
5 Hasil Seleksi Hasil_seleksi Text
58
5. Spesifikasi File Peserta
Nama File : Tabel Peserta
Akronim : Tabel_peserta
Fungsi : menyimpan data peserta
Tipe File : File Master
Organisasi File : Indexed Sequential
Akses File : Random
Media : Harddisk
Panjang Record : 649
Kunci Field : Kode_peserta
Software : mysql
Tabel IV.6
Spesifikasi File Peserta
No Elemen Data Nama Field Tipe Size Ket
1 Kode peserta Kode_peserta varchar 5 Primary
Key
2 Nama lengkap Nama_lengkap Varchar 50
3 Jenis kelamin Jenis_kelamin Varchar 20
4 NISN NISN Varchar 10
5 NIK NIK Varchar 16
6 Tempat lahir Tempat_lahir Varchar 100
7 Agama Agama Varchar 20
8 Alamat tinggal Alamat_tinggal Text
9 Rt Rt Char 2
59
10 Rw Rw Char 2
11 Kelurahan Kelurahan Varchar 50
12 Kecamatan Kecamatan Varchar 50
13 Kota Kota Varchar 50
14 Provinsi Provinsi Varchar 50
15 Alat
transportasi
Alat_transportasi Varchar 50
16 Jenis tinggal Jenis_tinggal Varchar 20
17 No telp No_telp Varchar 14
18 Email Email Varchar 50
19 No SKHUN No_SKHUN Varchar 10
20 Penerima kps Penerima_kps Varchar 10
21 No kps No_kps Varchar 20
22 Password Password Varchar 50
23 Tinggi badan Tinggi_badan Integer 11
24 Berat badan Berat_badan Integer 11
25 Jarak tempuh Jarak_tempuh Integer 11
26 Waktu tempuh Waktu_tempuh Integer 11
27 Jumlah
saudara
Jumlah_saudara Integer 11
60
4.2.4. Class Model/ Class Diagram
Gambar IV. 20
Class Diagram
61
4.2.5. Sequence Diagram
Dibawah ini merupakan rancangan sequence diagram pada sistem
pendaftaran siswa baru.
1. Sequence Diagram Pengunjung
Gambar IV.21
Sequence Diagram Pengunjung
62
2. Sequence Diagram Calon Siswa
Gambar IV.22
Sequence Diagram Lihat Peserta
63
4.2.6. Spesifikasi Hardware dan Software
1. Spesifikasi Hardware
a. Server
1) CPU
(a) Processor minimal quad core 64 bit dengan clock rate minimal 2.5 GHz.
(b) Ram 8GB DDR 3
(c) Harddisk minimal 250 SSD
2) Mouse
3) Keyboard
4) Monitor resolusi 1360x768
5) Koneksi Internet Minimal 100Mbps
b. Client
1) CPU
(a) Processor minimal quad core 64 bit dengan clock rate minimal 2.5 GHz.
(b) Ram 8GB DDR 3
(c) Harddisk minimal 250 SSD
2) Mouse
3) Keyboard
4) Monitor resolusi 1360x768
5) Koneksi Internet Minimal 100Mbps
2. Spesifikasi Software
a. Server
1) Sistem operasi untuk server yang biasa digunakan: Microsoft Windows
Server atau Linux (Ubuntu server, CentOS) terbaru.
64
2) Aplikasi bundle web server seperti : XAMPP, WAMP, MAMP yang terdiri
dari beberapa komponen, antara lain:
(a) Apache Web Server v2
(b) MariaDB V5
(c) PHP7
(d) phpMy Adminv4
3) Aplikasi browser seperti: Mozilla Firefox, Google Chrome, Microsoft Edge.
b. Client
1) Sistem Operasi untuk server yang umum digunakan: Microsoft Windows atau
Linux (Ubuntu, Fedora, Linux Mint) terbaru.
2) Aplikasi Browser seperti: Mozilla Firefox, Google Chrome, Microsoft Edge.
65
4.3. Jadwal Implementasi
Tabel IV.9
Jadwal Implementasi
No KEGIATAN
WAKTU
BULAN I BULAN II BULAN III
1 2 3 4 1 2 3 4 1 2 3 4
1 Riset
2 Analisa kebutuhan
3 Desain Sistem
4 Desain Perangkat Lunak
5
Pembuatan Sistem
Aplikasi berbasis Web
6 Tes Sistem
7
Pembuatan Dokumentasi
Program
8 Evaluasi & Operasional