20

BAB IV

PERANCANGAN SISTEM SULAN

4.1. Tahapan Perancanaan Sistem

Dalam pembuatan tahapan ini diperlukan tahapan perancangan sistem

4.1.1. Analisa kebutuhan

Mengidentifikasi kebutuhan fungsional program disertai dengan penggambaran

use case diagram dan skenario diagram use case yang terkait dengan proses yang

diusulkan.

A. Kebutuhan Pengguna

Dalam perancangan sistem pendaftaran siswa baru terdapat dua pengguna yang

saling berinteraksi dalam lingkungan sistem, yaitu: Calon siswa baru dan Tata usaha.

Kedua pengguna tersebut memiliki karakteristik interaksi dengan sistem yang

berbeda-beda dan memiliki kebutuhan informasi yang berbeda-beda seperti berikut :

A1. Skenario Kebutuhan Calon Siswa Baru

a. Mengunjungi halaman web

b. Melihat informasi pendaftaran

c. Mengisi formulir pendaftaran

d. Melihat data pendaftara

e. Melakukan transaksi pembayaan pendaftaran

f. Mencetak bukti pendaftaran

21

A2. Skenario kebutuhan Tata Usaha

a. Petugas Tata usaha membuka halaman web

b. Petugas Tata Usaha melakukan login

c. Petugas Tata Usaha mengelola data siswa

d. Petugas Tata Usaha mengelola pengaturan tata usaha

e. Petugas Tata Usaha melakukan penerimaan calon siswa baru

B. Kebutuhan Sistem

1. Pengguna harus melakukan login untuk mengakses web dengan memasukan

password dan username agar privasi masin-masing pengguna tetap terjaga

keamananya.

2. Pengguna harus melakukan logout saat selesai mengakses web.

3. Sistem akan melakukan penyimpanan data siswa.

4.1.2. Rancnagan Diagram Use Case Penerimaan Calon Siswa Baru

1. Rancangan Diagram Use Case Calon Siswa Baru

Gambar IV.1

Use Case Diagram Calon Siswa Baru

22

Tabel IV.1

Deskripsi Use Case Calon Siswa Baru

Use Case Calon siswa baru

Requirements Calon siswa baru dapat melakukan

penndaftara

Goal Calon siswa baru dapat melakukan

pendaftaran secara online di halaman

web

Pre-Conditions Calon siswa baru telah masuk ke dalam

web

Post-Condotions Calon siswa baru dapat mendaftar

sebagai siswa baru

Actor Calon siswa baru

Main flow / Basic path 1. Calon siswa melihat halaman utama

web.

2. Calon siswa melakukan pendaftaran

secara online.

3. Calon siswa melakukan login

4. Calon siswa melihat data pendaftar

5. Calon siswa melakukan pembayaran

formulir via transfer.

6. Calon siswa dapat mencetak bukti

pendaftaran.

23

2. Rancangan Diagram Use Case Tata Usaha

Gambar IV.2

Use Case Diagram Tata Usaha

Tabel IV.2

Deskripsi Use Case Tata Usaha

Use Case Tata usaha

Requirements Tata usaha dapat mengelola data calon

siswa dan tata usaha

Goal Tata usaha mengelola data calon siswa

dan tata usaha

Pre-Conditions Tata usaha masuk ke dalam web

Post-Condotions Tata usaha mengelola data calon siswa

dan tata usaha

24

Actor Tata usaha

Main flow / Basic path 1. Tata usaha masuk kedalam web.

2. Tata usaha dapat dapat menelola

halaman informasi siswa.

3. Tata usaha mengelola data calon

siswa.

4. Tata usaha mengelola pengaturan

tata usaha.

5. Tata usaha melakukan penerimaan

calon siswa baru.

25

4.1.5. Rancangan Diagram Aktivitas

1. Activity Diagram Pendaftaran Calon Siswa Baru

Gambar IV.3

Activity Diagram Pendaftaran Calon Siswa Baru

26

2. Activity Diagram Pembayaran Formulir

Gambar IV.4

Activity Diagram Pembayaran Formulir

27

3. Activity Diagram Login Tata Usaha Mengelola Data Calon Siswa Baru

Gambar IV.5

Activity Diagram Tata Usaha Mengelola Data Calon Siswa Baru

28

4. Activity Diagram Penerimaan Calon Siswa Baru

Gambar IV.6

Activity Diagram Penerimaan Calon Siswa Baru

29

6. Activity Diagram Mengelola Pengaturan Tata Usaha

Gambar IV.7

Activity Diagram Pengaturan Tata Usaha

30

4.1.5. Rancangan Dokumen Sistem Usulan

Menjelaskan secara rinci setiap rancangan dokumen pada program yang

dihasilkan dan uraian parameter-parameter dokumen tersebut

A. Nama Dokumen : Formulir Pendaftaran

Fungsi : Untuk mengetahui data siswa

Sumber : Calon siswa

Tujuan : Tata usaha

Media : Kertas

Jumlah : Satu halaman

Frekuensi : Setiap siswa baru yang mendaftaran

Bentuk : C-1

B. Nama Dokumen : Data Pendaftar

Fungsi : Untuk mengetahui data pendaftara

Sumber : Tata usaha

Tujuan : Calon siswa

Media : Kertas

Jumlah : Satu Lembar

Frekuensi : Setiap siswa baru yang mendaftaran

Bentuk : D1

31

C. Nama Dokumen : Data Pembayaran

Fungsi : Untuk bukti pembayaran pendaftaran

Sumber : Tata usaha

Tujuan : Calon siswa

Media : Kertas

Jumlah : Satu Lembar

Frekuensi : Setiap siswa baru yang mendaftaran

Bentuk :D2

4.1.5. Rancangan Prototype

1. Interface Halaman Home Utama Web

Gambar IV.8

Halaman Home Utama Web

32

2. Interface Halaman Sejarah Utama Web

Gambar IV.9

Halaman Sejarah Utama Web

3. Interface Halaman Informasi Utama Web

Gambar IV.10

Halaman Informasi Utama Web

33

4. Interface Halaman Form Pendaftaran Calon Siswa Baru

Gambar IV.11

Halaman Form Pedaftaran Calon Siswa Baru

5. Interface Halaman Login Sebagai Calon Siswa Baru

Gambar IV.12

Halaman Login Sebagai Calon Siswa Baru

34

7. Interface Menu Informasi Pada halaman Calon Siswa Baru

Gambar IV.13

Menu Informasi Pada Halaman Calon Siswa Baru

35

8. Interface Menu Verifikasi Data Pribadi Pada halaman Calon Siswa Baru

Gambar IV.14

Menu Verifikasi Data Pribadi Pada halaman Calon Siswa Baru

36

9. Interface Menu Data Pribadi Siswa

Gambar IV.15

Menu Data Pribadi Pada halaman Calon Siswa Baru

37

10. Interface Menu Data Pendaftar

Gambar IV.16

Menu Data Pendaftar

11. Interface Menu Data Pembayaran Pendaftaran

Gambar IV.17

Menu Data Pembayaran Pendaftaran

38

12. Interface Halaman Login Sebagai Tata Usaha

Gambar IV.18

Halaman Login Sebagai Tata Usaha

13. Interface Halaman Utama Tata Usaha

Gambar IV.19

Halaman Utama Tata Usaha

39

14. Interface Menu Informasi Siswa

Gambar IV.20

Menu Informasi Siswa

15. Interface Menu Data Pendaftar

Gambar IV.21

Menu Data Pendaftar

40

16. Interface Menu Data Calon Siswa Baru

Gambar IV.22

Menu Data Calon Siswa Baru

17. Interface Menu Pengaturan Tata Usaha

Gambar IV.23

Menu Pengaturan Tata Usaha

41

4.2. Perancangan Pengangkat Lunak

Perancangan lnak ini difokuskan pada enam atribut, yaitu ERD, LRS,

Spesifikasi File, Class Diagram Squence Diagram, dan Spesifikasi Hardwer serta

Sooftware.

4.2.1. ERD (Entity Relationship Diagram)

Perancangan basis data menghasilkan pemetaan table-tabel yang

digambarkan dengan Entity Relationship Diagram (ERD).

Gambar IV.24

ERD (Entity Relationship Diagram) Penerimaan Calon Siswa Baru

42

4.2.2. LRS (Logical Structure Record)

Gambar IV.25

LRS (Logical Structure Record) Penerimaan Calon Siswa Baru

43

4.2.3. Spesifikasi File

Menjelaskan tentang file atau table yang terbentuk dari transformasi ERD

(dan atau file-file penunjang untuk web ).

1. Spesifikasi file calon siswa

Nama file : Calon siswa baru

Akronik : Calon siswa baru

Fungsi : Untuk menyimpan data siswa

Tipe file : Master

Organisasi file : Indexed sequential

Akses file : Rendom

Media : Marddisk

Panjang record : 450

Kunci field : kode_siswa

Software : Mysql

Tabel IV.3

Spesifikasi File Calon Siswa Baru

No Elemen data Nama field Tipe Size Ket

1 Kode siswa kode_siswa Int 5 Primary

key

2 Username Username Int 10

3 Password Password Int 20

4 Nama Lengkap nama_lengkap Varchar 50

5 Tempat Lahir Tempatlahir Varchar 15

6 Tanggal lahir Tanggallahir Date

44

7 Jenis kelamin jenis_kelamin Int 10

8 Agama Agama Text

9 Alamat tinggal alamat_tinggal Text

10 No telpon no_telpon Varchar 15

11 Sekolah asal sekolah_asal Varchar 20

12 Nama orang tua nama_orangtua Varchar 50

13 Tempat lahir tempat_lahir Varchar 15

14 Tanggal lahir tanggal_lahir Date

15 Pekerjaan Pekerjaan Varchar 20

16 Pendidikan terakhir pendidikan_terakhir Varchar 20

17 Foto Foto Varchar 200

45

2. Spesifikasi file pendaftaran

Nama file : Pendaftaran

Akronik : Pendaftaran

Fungsi : Untuk menyimpan data pendaftaran

Tipe file : Transaksi

Organisasi file : Indexed sequential

Akses file : Rendom

Media : Marddisk

Panjang record : 15

Kunci field : kode_pendaftaran

Software : Mysql

Tabel IV.4

Spesifikasi File Pendaftaran

No Elemen data Nama field Tipe Size Ket

1 kode pendaftaran kode_pendaftaran Int 5 Primary

key

2 Kode siswa kode_siswa Int 5

3 Tanggal

pendaftaran

tanggal_pendaftaran Date

4 Kode tata usaha kode_tata_usaha int 5

46

3. Spesifikasi file pembayaran

Nama file : Pembayaran

Akronik : Pembayaran

Fungsi : Untuk menyimpan data pembayaran

Tipe file : Transaksi

Organisasi file : Indexed sequential

Akses file : Rendom

Media : Marddisk

Panjang record : 30

Kunci field : kode_pembayaran

Software : Mysql

Tabel IV.5

Spesifikasi File Pembayaran

No Elemen data Nama field Tipe Size Ket

1 Kode pembayaran kode_pembayaran Int 5 Primary

key

2 Kode pendaftaran kode_pendaftaran Int 5

3 Jumlah

pembayaran

jumlah_pembayaran Int 20

4 Tanggal

Pembayaran

tanggal_pembayaran Date

47

4. Spesifikasi file tata usaha

Nama file : Tata usaha

Akronik : Tata usaha

Fungsi : Untuk menyimpan data tata usaha

Tipe file : Master

Organisasi file : Indexed sequential

Akses file : Rendom

Media : Marddisk

Panjang record : 75

Kunci field : kode_tata_usaha

Software : Mysql

Tabel IV.6

Spesifikasi File Tata Usaha

No Elemen data Nama field Tipe Size Ket

1 Kode tata usaha kode_tata_usaha Int 5 Primary

key

2 Nama Nama Varchar 50

3 Username Username Int 10

4 Password Password Int 10

48

5. Spesifikasi file penerimaan

Nama file : Penerimaan

Akronik : Penerimaan

Fungsi : Untuk menyimpan data penerimaan

Tipe file : Transaksi

Organisasi file : Indexed sequential

Akses file : Rendom

Media : Marddisk

Panjang record : 15

Kunci field : kode_siswa

Software : Mysql

Tabel IV.7

Spesifikasi File Penerimaan

No Elemen data Nama field Tipe Size Ket

1 Kode penerimaan kode_siswa Int 5 Primary

key

2 kode pendaftaran Kode_pendaftaran Int 5

3 Tanggal

penerimaan

tanggal_penerimaan Date

4 kode tata usaha kode_tata_usaha Int 5

49

4.2.4. Class Model / Class Diagram

Menggambarkan hubungan antara entitiy slass yan dibuat

Gambar IV.26

Class Model / Class Diagram Penerimaan Calon Siswa Baru

50

4.2.5. Sequence Diagram

1. Sequnce Diagram Calon Siawa Baru

Gambar IV.27

Sequnce Diagram Calon Siswa

51

2. Sequence Diagram Tata Usaha

Gambar IV.28

Sequnce Diagram Tata Usaha

52

4.2.6. Spesifikasi Hardware dan Software

1) Spesifikasi Hardware

a. Server

1) CPU

a) Processor minimum quard core 64 bit dengan clock minimum 2.5 GHz

b) Ram 8 GB DDR 3

c) HardDisk 250 SSD

2) Mouse

3) Keyboard

4) Monitor dengan resolusi layar minimum 1360x768

5) Koneksi internet dengan kecepatan 100Mkbps

b. Client

1) CPU

a) Processor minimum quad 64 bit dengan clock rate minimum 1.6 GHz

b) Ram 4 GB DDR 3

c) HardDisk minimum 500 GB

2) Mouse

3) Keyboard

4) Monitor dengan resolusi layar minimum 1360x768

5) Koneksi internet dengan kecepatan 10Mbps

53

2) Spesifikasi Software

a. Server

1) Sistem operasi yang umum digunakan seperti: Microsoft Windows Server

atau Linux (Ubuntu Server, CentOS, OpenSuse, Server) terbaru.

2) Aplikasi bundle web server seperti: XAMPP, WAMP, MAMP yang terdiri

dari beberapa komponen, diantaranya:

a) Aplikasi Web Server v2

b) Aplikasi PHP Server v5

c) Aplikasi MySQL Server v5

d) Aplikasi phpMyAdmin v4

3) Aplikasi browser seperti Mozila Firefox, Microsoft Edge, Google Chrom.

b. Clint

1) Sistem operasi yang umum digunakan seperti: Microsoft Windows atau Linux

(Ubuntu, Fedora, Linux) terbaru

2) Aplikasi web browser seperti Mozilla Firefox, Opera, Safari, Microsoft Edge,

Goo gle Chrome.

54

4.1. Jadwal Implementasi

Tabel IV.8

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 kebutuhan

3 Desain Sistem

4

Desain Perangkat

Lunak

5

Pembuatan Sistem

Aplikasi berbasis Web

6 Tes Sistem

7 Pembuatan Laporan TA

8 Evaluasi & Operasional