BAB III
ANALISIS DAN PERANCANGAN SISTEM
3.1 Analisis Sistem
3.1.1 Analisis Sistem Yang Berjalan
Sebelumnya dilakukan perancangan sistem baru, terlebih dahulu dilakukannya
analisis terhadap sistem yang telah ada dengan sistem yang akan diusulkan.
Sistem yang telah ada saat ini untuk segi tampilan dan komponen fitur layanan
perlu adanya pembaharuan.
3.1.2 Analisis Kelemahan Sistem Yang Berjalan
Adapun kelemahan pada sistem yang sedang berjalan saat ini antara lain seperti
berikut:
1. Belum adanya sistem yang membantu sekolah dalam penerimaan siswa baru
dan sulitnya dalam pencarian data siswa.
2. Sistem belum terkomputerisasi secara luas sehingga perlu mencatat semua
untuk keperluan informasi.
3. Kemacetan Server: Lonjakan akses pada saat pendaftaran bisa menyebabkan
server overload atau down, menghambat proses pendaftaran.
4. Keterbatasan Akses Internet: Tidak semua calon pendaftar memiliki akses
internet yang stabil, menghambat mereka untuk mendaftar online.
26
3.1.3 Analisis Alur Sistem Yang Berjalan
Dengan adanya sistem informasi Seleksi Masuk Siswa pada SMKN 1 Talang
Padang ini dapat menjadi salah satu fasilitas yang penting dilakukan untuk
membantu admin secara cepat dan akurat dengan cara admin mengakses halaman
website dari sistem ini, lalu admin login dan memberikan informasi pendaftaran,
melakukan pengelolaan data siswa, konfirmasi data siswa, dan pembagian kelas
beserta jurusannya untuk masing masing siswa.
3.1.4 Analisis Input dan Output
Analisa Input dan Output Sistem ini Adalah sebagai berikut:
1. Input
Merupakan masukan yang berdasarkan proses pengisian formulir pendaftaran
peserta, seperti data siswa, data asal sekolah, data nilai STL/SKHU, data orang tua
dan lain-lain.
2. Output
Merupakan keluaran dari sistem yang didistribusikan kepada calon siswa atau
orang tua siswa seperti cetak formulir pendaftaran.
3.1.5 Analisis Prangkat Keras
Rekomendasi perangkat keras yang digunakan penulis untuk membangun sistem
Informasi Seleksi Masuk Siswa Berbasis Web Pada SMK N 1 Talang Padang.
1. Processor intel i5
2. Ram 8 gb
27
3. Hardisk 1tb
4. Lcd 19"
5. Vga 2gb
6. Usb 2.0
7. Usb 3.0
8. Mouse and keyboard
3.1.6 Analisis Prangkat Lunak
Perangkat lunak (software) yang digunakan penulis untuk membangun Sistem
Informasi Seleksi Masuk Siswa Berbasis Web Pada SMK N 1 Talang Padang
adalah sebagai berikut:
1. Windows 10 pro
2. Visual Studio Code
3. Laragon
4. Browser chrome
3.2 Perancangan Sistem
3.2.1 Use Case Diagram
Use case diagram dapat digunakan selama proses analisa untuk menangkap
requirements atau permintaan terhadap sistem seleksi masuk siswa online.
1. Use Case
Use case diagram dapat digunakan selama proses analisa untuk menangkap
permintaan terhadap sistem
28
Gambar 3.1 Use Case
3.2.2 Deskripsi Aktor
Tabel 3.1 Deskripsi Aktor
No Aktor Deskrisi
1 Admin Admin dapat melakukan login, mengelola menu dashboard, list
pendaftar, pengumuman, jadwal ujian, kategori soal, soal ujian,
konfigurasi user, dan konfigurasi web
2 Calon siswa Calon siswa dapat membuat nisn, melakukan login, melihat
menu dashboard, menu pendaftaran, ubah password,
mengerjakan soal ujian, lihat pengumuman, dan cetak data
3.2.3 Deskripsi Usecase
29
Tabel 3.2 Deskripsi Usecase
No Use Case Deskripsi
1 Dashboard Melihat halaman utama
2 Login Merupakan langkah awal admin untuk mengakses web
3 Ganti Password Merupakan proses admin untuk mengakses mengganti
password
4 Peserta PPDB Merupakan proses admin untuk melihat, mengedit dan
menghapus data siswa yang mendaftar
5 pengumuman Merupakan proses admin untuk melihat, mengedit dan
membagikan pengumuman
6 Jadwal ujian Merupakan proses admin untuk melihat dan mengedit
jadwal dilaksanakan nya ujian
7 Kategori soal Admin dapat menambah, mengedit dan menghapus
kategori soal
8 Soal ujian Admin dapat menambah, mengedit dan menghapus
soal ujian
9 Konfigurasi user Admin dapat menambah, mengedit dan menghapus
user admin
10 Konfigurasi web Admin untuk melihat dan mengedit data tentang
sekolah SMK N 1 Talang Padang, juga mengupload
logo dan icon
3.2.4 Activity Diagram
Aktivitas menggambarkan proses yang berjalan, sementara use case sistem
informasi seleksi masuk siswa menggambarkan bagaimana aktor menggunakan
sistem untuk melakukan aktivitas.
1. Activity Diagram buat akun dan Login (Calon siswa)
30
Calon siswa mengakses web lalu mengisi formulir pendaftaran untuk membuat
akun, setelah sudah membuat akun calon siswa login dengan memasukan nisn dan
password yang telah disiapkan oleh sistem.
Gambar 3.2 Activity Diagram buat akun dan login calon siswa
2. Activity Diagram Pendaftaran (Calon siswa)
Pada activity diagram Pendaftaran Calon siswa memilih menu Data diri dan
sistem menampilkan form untuk mengisi biodata calon siswa, lalu calon siswa
mengupload file foto dan ijazah.
31
Gambar 3.3 Activity Diagram pendaftaran calon siswa
3. Activity Diagram Tes ujian (Calon siswa)
Calon siswa memilih menu mulai ujian lalu sistem menampilkan Soal ujian yang
siap di kerjakan oleh calon siswa.
Gambar 3.4 Activity Diagram Tes ujian calon siswa
4. Activity Diagram Ubah password (Calon siswa)
32
Calon siswa memilih menu ubah password kemudian sistem menampilkan data
ubah password, lalu calon siswa memasukan password yang lama dan yang baru
kemudian sistem menyimpan password baru ke database.
Gambar 3.5 Activity Diagram ubah password calon siswa
5. Activity Diagram Login (Admin)
Admin mengakses web lalu memasukan username dan password kemudian sistem
mengecek info login, jika login benar maka pergi ke halaman dashboard jika login
salah maka login ulang.
33
Gambar 3.6 Activity Diagram login Admin
6. Activity Diagram List data siswa (Admin)
Admin memilih menu PPDB lalu sistem menampilkan menu List peserta, di form
ini admin dapat mengelola data siswa berupa edit, tambah dan hapus data siswa.
Gambar 3.7 Activity Diagram List data siswa Admin
7. Activity Diagram Pengumuman(Admin)
34
Admin memilih menu pengumuman lalu sistem menampilkan data pengumuman,
di form ini admin dapat menambah, mengdetit dan menghapus data pengumuman.
Gambar 3.8 Activity Diagram pengumuman Admin
8. Activity Diagram Ujian (Admin)
Admin memilih menu Ujian lalu sistem menampilkan form jadwal ujian, kategori
soal dan soal ujian pada form tersebut admin dapat menambah, mengedit dan
menghapus data tes ujian.
35
Gambar 3.9 Activity Diagram Ujian Admin
9. Activity Diagram konfigurasi user dan konfigurasi web (Admin)
Admin mengakses menu Konfigurasi user lalu sistem menampilkan halaman
konfigurasi user, pada halaman ini admin dapat menambah, mengedit dan
menghapus data user admin, selanjutnya admin mengakses menu Konfigurasi web
lalu sistem menampilkan halaman konfigurasi web, pada halaman ini admin dapat
mengedit web data tentang sekolah SMK N 1 Talang padang.
36
Gambar 3.10 Activity Diagram konfigurasi user dan konfigurasi web admin
3.2.5 Sequence Diagram
Sequence diagram menggambarkan interaksi antara objek di dalam dan di sekitar
sistem, termasuk pengguna dan antarmuka pengguna. Sequence diagram biasa
digunakan untuk menggambarkan skenario atau rangkaian langkah-langkah yang
dilakukan sebagai respon dari sebuah event untuk menghasilkan output tertentu.
1. Sequence Diagram Buat akun (Calon siswa)
Pada sequence diagram tersebut menjelaskan proses alur calon siswa dalam
membuat akun, dimana calon siswa mengakses web lalu mengisi data pendaftaran
untuk membuat akun.
37
Gambar 3.11 sequence diagram buat akun calon siswa
2. Sequence Diagram Login (Calon siswa)
Pada sequence diagram tersebut menjelaskan proses alur calon siswa untuk
melakukan login dengan cara memasukan nisn dan password yang telah disiapkan
oleh sistem.
Gambar 3.12 Sequence Diagram Login calon siswa
3. Sequence Diagram Ubah password (Calon siswa)
38
Pada sequence diagram tersebut menjelaskan proses calon siswa untuk mengubah
password lama ke password yang baru.
Gambar 3.13 sequence diagram ubah password calon siswa
4. Sequence Diagram Pendaftaran (calon siswa)
Pada sequence diagam tersebut menjelaskan proses calon siswa dalam
mendaftarkan diri dengan cara mengisi biodata serta mengupload foto dan ijazah.
Gambar 3.14 sequence diagram pendaftaran calon siswa
5. Sequence Diagram Tes ujian (calon siswa)
39
Pada sequence diagam tersebut menjelaskan proses calon siswa dan sistem,
dimana pada form ini calon siswa mengerjakan soal ujian.
Gambar 3.15 Sequence Diagram tes ujian calon siswa
6. Sequence Diagram Pengumuman (calon siswa)
Pada sequence diagram tersebut menjelaskan proses calon siswa dan sistem,
dimana calon siswa melihat data pengumuman pembagian kelas
Gambar 3.16 Sequence Diagram pengumuman calon siswa
7. Sequence Diagram Cetak data (calon siswa)
40
Pada sequence diagram tersebut menjelaskan proses calon siswa dan sistem,
dimana pada form ini calon siswa melihat hasil cetak data.
Gambar 3.17 Sequence Diagram cetak data calon siswa
8. Sequence Diagram Login (Admin)
Pada sequence diagram tersebut menjelaskan proses admin dan sistem, dimana
admin melakukan login dengan cara memasukan username dan password.
Gambar 3.18 Sequence Diagram login admin
41
9. Sequence Diagram List data siswa (Admin)
Pada sequence diagram tersebut menjelaskan proses admin dan sistem, dimana
pada form ini admin dapat mengedit, menghapus dan mencari data siswa.
Gambar 3.19 Sequence Diagram list data siswa admin
10. Sequence Diagram Pengumuman (Admin)
Pada sequence diagram tersebut menjelaskan proses admin dan sistem, dimana
pada form ini admin dapat mengedit dan menghapus data pengumuman.
Gambar 3.20 Sequence Diagram pengumuman admin
42
11. Sequence Diagram Jadwal ujian (Admin)
Pada sequence diagram tersebut menjelaskan proses admin dan sistem, dimana
pada form ini admin dapat menambah, mengedit dan menghapus data jadwal
ujian.
Gambar 3.21 Sequence Diagram jadwal ujian admin
12. Sequence Diagram Kategori soal (Admin)
Pada sequence diagram tersebut menjelaskan proses admin dan sistem, dimana
pada form ini admin dapat menambah, mengedit dan menghapus data kategori
soal.
43
Gambar 3.22 Sequence Diagram kategori soal admin
13. Sequence Diagram Soal ujian (Admin)
Pada sequence diagram tersebut menjelaskan proses admin dan sistem, dimana
pada form ini admin dapat menambah, mengedit dan menghapus data soal ujian.
Gambar 3.23 Sequence Diagram soal ujian admin
14. Sequence Diagram Konfigurasi user (Admin)
Pada sequence diagram tersebut menjelaskan proses admin dan sistem, dimana
pada form ini admin dapat menambah, mengedit dan menghapus data user admin.
44
Gambar 3.24 Sequence Diagram konfigurasi user admin
15. Sequence Diagram Konfigurasi web (Admin)
Pada sequence diagram tersebut menjelaskan proses admin dan sistem, dimana
pada form ini admin dapat mengedit dan menghapus data tentang sekolah serta
admin dapat mengupload logo website dan icon sekolah.
Gambar 3.25 Sequence Diagram konfigurasi web admin
3.2.6 Class Diagram
Class Diagram adalah sebuah jenis diagram dalam Unified Modeling Language
(UML) yang digunakan untuk menggambarkan struktur statis dari sebuah sistem.
Diagram ini memperlihatkan kelas-kelas yang akan dibangun dalam sistem
beserta atribut dan metode mereka, serta hubungan antara kelas-kelas tersebut.
45
Class Diagram merupakan alat penting dalam perancangan sistem berbasis objek
karena memberikan gambaran visual tentang struktur dan hubungan internal dari
sistem yang sedang dikembangkan.
Gambar 3.26 Class Diagram
3.2.7 Rancangan Tabel
Tabel 3.3 Rancangan Tabel PPDB
Primary key : id_ppdb
N Nama Tipe Data Size
46
1 PPDB_Id Integer assigned
2 nisn varchar 15
3 password varchar 100
4 Nama_lengkap varchar 100
N Nama Tipe data Size
o
5 Nama_panggilan varchar 25
6 Tgl_lahir date Not null
7 Tmp_lahir varchar 100
8 Jenkel varchar 15
9 Asal_sekolah varchar 100
10 Nama_ayah varchar 100
11 Nama_ibu varchar 100
12 Alamat varchar 100
13 No_telp varchar 15
14 Jurusan varchar 25
15 Foto_siswa varchar 100
16 Foto_ijazah varchar 100
17 Bukti_pembayaran varchar 100
18 Status_pembayaran varchar 11
19 Tgl_daftar date Not null
20 Agama varchar 25
21 Jenis_tinggal varchar 25
22 Transportasi varchar 10
23 kewarganegaraan varchar 15
47
24 Anak_keberapa varchar 5
25 Jumlah_kandung varchar 5
26 Jumlah_tiri varchar 5
27 Jumlah_angkat varchar 5
28 Yatim_piatu varchar 15
N Nama Tipe data Size
o
29 bahasa varchar 15
30 Jarak_tempuh varchar 15
31 Golonngan_darah varchar 5
32 Penyakikt_diderita varchar 50
33 Kelainan_jasmani varchar 50
34 Tinggi_berat varchar 25
35 Gelombang integer assigned
36 Status varchar 15
37 Status_ujian_proses integer assigned
38 Status_ujian_selesai integer assigned
39 Benar varchar 15
40 Salah varchar 15
41 Nilai varchar 15
Tabel 3.4 Rancangan Tabel Kategori_soal
Primary key : id_kategori
N Nama Tipe Data Size
o
1 Id_kategori Integer assigned
48
2 Nama_kategori Varchar 25
Tabel 3.5 Rancangan Tabel Jadwal_ujian
Primary key : id_jadwal
No Nama Tipe Data Size
1 Id_jadwal Integer assigned
2 Gelombang_id Integer 50
3 Tanggal_ujian Date Not null
4 Jam_ujian Time Not null
5 Durasi_ujian Integer Not null
6 Time_ujian integer Not null
Tabel 3.6 Rancangan Tabel User
Primary key : id_user
N Nama Tipe Data Size
o
1 User_id Integer assigned
2 Username varchar 50
3 Nama varchar 50
4 Email Varchar 50
5 Password varchar 100
6 Foto varchar 150
7 Active integer Null
Tabel 3.7 Rancangan Tabel Jawaban_ujian
Primary key : id_jawaban
49
N Nama Tipe Data Size
o
1 Id_jawaban Integer assigned
2 Id_ppdb integer assigned
3 Id_soal_ujian Integer assigned
4 Jawaban varchar 15
5 Skor Varchar 15
Tabel 3.8 Rancangan Tabel File_pengumuman
Primary key : id_file
N Nama Tipe Data Size
o
1 Id_file Integer assigned
2 Gelombanng_id varchar 15
3 File_pdf Varchar 100
Tabel 3.9 Rancangan Tabel soal_ujian
Primary key : id_soal
N Nama Tipe Data Size
o
1 Id_soal_ujian Integer assigned
2 Id_kategori Integer assigned
3 Pertanyaan Text -
4 A Text -
5 B Text -
6 C Text -
7 D Text -
50
8 E Text -
9 Kunci_jawaban Varchar 2
Tabel 3.10 Rancangan Tabel Konfigurasi _id
Primary key : id_konfigurasi
N Nama Tipe Data Size
o
1 Konfigurasi_id Integer 50
2 Nama_web Varchar 50
3 Deskripsi Text -
4 Visi Text -
5 Misi Text -
6 Instagram Varchar 50
7 Facebook Varchar 50
8 Whatsapp Varchar 50
9 Email Varchar 50
10 Alamat Varchar 100
11 Nama_rek Varchar 25
12 No_rek varchar 25
51
13 Logo Varchar 100
14 Icon Varchar 100
3.2.8 Rancangan Tampilan Sistem
1. Rancangan Tampilan Menu Buat akun (calon siswa)
Setelah calon siswa mengakses web, calon siswa membuat akun terlebih dahulu
sebelum melakukan login.
Gambar 3.27 Rancangan Tampilan Menu Buat akun calon siswa
2. Rancangan Tampilan Menu Login (Calon siswa)
Setelah membuat akun calon siswa memasuki halaman login kemudian
memasukan nisn dan password untuk memasuki halaman dashboard.
52
Gambar 3.28 Rancangan Tampilan Menu Login calon siswa
3. Rancangan Tampilan Menu Dashboard (Calon siswa)
Pada halaman dashboard calon siswa dapat melihat dan mengisi form pendaftaran
serta mengupload file foto diri dan ijazah.
Gambar 3.29 Rancangan Tampilan Menu dashboard dan pendaftaran calon siswa
4. Rancangan Tampilan menu Tes ujian (Calon siswa)
53
Setelah calon siswa mengisi semua biodata pada form pendaftaran kemudian
calon siswa meng klik menu mulai ujian untuk memulai tes ujian.
Gambar 3.30 Rancangan Tampiilan Menu tes ujian calon siswa
5. Rancangan Tampilan Informasi hasil tes ujian (calon siswa)
Setelah mengisi semua soal ujian dan mengirim kan ke admin selanjut nya sistem
akan memproses hasil tes ujian dan akan menampilan notifikasi sesuai hasil
seleksi.
Gambar 3.31 Rancangan Tampiilan informasi hasil seleksi
6. Rancangan Tampilan Menu Cek kelulusan (Calon siswa)
54
Setelah melihat notifikasi hasil tes calon siswa mengklik tulisan Disini kemudian
akan menampilan halaman masukan nisnsetelah itu calon siswa memasukan nisn
untuk mengecek kelulusan.
Gambar 3.32 Rancangan Tampilan Menu Cek kelulusan
7. Rancangan Tampilan Cetak data (Calon siswa)
Pada halaman ini calon siswa dapat melihat dan mencetak data siswa lulus seleksi.
Gambar 3.33 Rancangan Tampiilan Menu Cetak data calon siswa
8. Rancangan Tampilan Menu Login (Admin)
55
Pada halaman ini admin memasukan username dan password untuk dapat masuk
ke halaman dashboard.
Gambar 3.34 Rancangan Tampiilan Menu login Admin
9. Rancangan Tampilan Menu Dashboard (Admin)
Pada halaman ini admin dapat melihat beberapa pilihan menu diantara nya yaitu
menu PPDB, Ujian, Konfiurasi user dan Konfigurasi web.
Gambar 3.35 Rancangan Tampilan Menu Dasboard Admin
10. Rancangan Tampilan Menu List pendaftar (Admin)
56
Pada halaman ini admin dapat mengedit dan menghapus data pendaftar.
Gambar 3.36 Rancangan Tampilan Menu List pendaftar Admin
11. Rancangan Tampilan Menu Pengumuman (Admin)
Pada halaman ini admin dapat menambah dan mengedit data pengumuman.
Gambar 3.37 Rancangan Tampilan Menu pengumuman Admin
12. Rancangan Tampilan Menu Jadwal (Admin)
57
Pada halaman ini admin dapat menambah dan mengedit data Jadwal ujian.
Gambar 3.38 Rancangan Tampilan Menu jadwal ujian Admin
13. Rancangan Tampilan Menu Kategori soal (Admin)
Pada halaman ini admin dapat menambah, mengedit dan menghapus data kategori
soal.
Gambar 3.39 Rancangan Tampilan Menu Kategori soal (Admin)
58
14. Rancangan Tampilan Menu Soal ujian (Admin)
Pada halaman ini admin dapat menambah, mengedit dan menghapus data soal
ujian.
Gambar 3.40 Rancangan Tampilan Menu Soal ujian (Admin)
15. Rancangan Tampilan Menu Konfigurasi user (Admin)
Pada halaman ini admin dapat menambah, mengedit dan menghapus data user
admin.
Gambar 3.41 Rancangan Tampilan Menu konfigrasi user (Admin)
59
16. Rancangan Tampilan Menu Konfigurasi web (Admin)
Pada halaman ini admin dapat menambah, mengedit dan menghapus data web
tenang sekolah SMK N 1 Talang Padang.
Gambar 3.42 Rancangan Tampilan Menu konfigrasi web (Admin)