26

BAB IV

PERANCANGAN SISTEM

Tujuan utama dari perancangan sistem adalah untuk memenuhi kebutuhan

pemakai sistem dan juga untuk memberi gambaran tentang model sistem baru

yang akan diterapkan baik dari sisi teknologi, desain input, proses output sistem

tersebut kepada pemakai program. Pernacangan sistem secara umum

mengidentifikasikan komponen-komponen sistem informasi yang akan di rancang

secara rinci. Pada tahap perancangan secara umum, komponen-komponen sistem

informasi dirancang dengan tujuan untuk dikomunikasikan kepada pengguna

bukan untuk pemrogram.

4.1. PERANCANGAN TAMPILAN MENU

1. Perancangan Tampilan Menu Utama Berisi :

a. Program

b. Home

c. Info

d. Setting

Gambar 4.1. Perancangan Tampilan Menu Utama

27

2. Perancangan Tampilan Menu Program Berisi :

a. Login

b. Log out

c. About

d. Exit

Gambar 4.2. Perancangan Tampilan Menu Program

3. Perancangan Tampilan Menu Home Berisi :

a. Siswa

b. Orang tua

c. Kelas

d. Jurusan Semester

Gambar 4.3. Perancangan Tampilan Home

28

4. Perancangan Tampilan Menu Info Berisi :

a. Inbox Sms

b. Outbox Sms

c. Absensi

Gambar 4.4. Perancangan Tampilan Menu Info

5. Perancangan Tampilan Menu Setting Berisi :

a. Server Gammu

Gambar 4.5. Perancangan Tampilan Menu Setting

29

4.2. DAD PENGOLAHAN DATA

1. Diagram Konteks Sistem

Sistem Aplikasi

Absensi

Siswa

Admin

KepSek

Ortu

Data Absen

Data

Siswa

Laporan absensi harian

Informasi

Data Absen

Data Absen

Form Pendaftaran Absensi

Laporan absensi bulanan

Gambar 4.6. Diagram Konteks Sistem

30

2. Bagan Berjenjang Sistem

SISTEM

ABSENSI SISWA

InfoHome Setting

Siswa

Orang Tua

Kelas

Inbox Sms

Outbox Sms

Absensi

Server Gammu

0

1.0 2.0 3.0

1.1

1.2

1.3

2.1

2.2

2.3

3.1

1.4

Jurusan Semester

Gambar 4.7. Bagan Berjenjang Sistem

31

3. DAD Level 0 Pengolahan Data

0

Home

Info

Setting

Siswa

Orang Tua

Kelas

Inbox sms

Outbox Sms

Absensi

Kep. sekolah

siswa

orang tua

kelas

Inbox sms

Outbox sms

absensi

Data siswa

Data orang tua

Data kelas

Data Inbox sms

Data Outbox sms

Data absensi

Data siswa

Data orang tua

Data kelas

Data Inbox sms

Data Outbox sms

Data absensi

Data siswa

Data Orang tua

Data kelas

Inbox sms

Outbox sms

absensi

admin

1.0

2.0

3.0

Lap absensi harian

Lap absensi bulanan

Jurusan

semester

Data Jurusan

semester Jurusan

semsester

Data Jurusan

semester

Data Jurusan

semester

Server Gammu

Lap absensi harian

Lap absensi bulanan

Gambar 4.8. DAD Level 0 Pengolahan Data

32

4. DAD Level 1 Proses Pengolahan Data

Input data

Orang tua

Input data

kelas

Input data

siswa

1.2

1.1

1.3

1.0

Input data

Inbox sms

Input data

Outbox sms

Input data

absensi

2.3

2.2

2.1

2.0

PROSES

PENGINPUTAN DATA

PROSES

PENGINPUTAN DATA

siswa

Oran tua

kelas

Inbox sms

Outbos sms

absensi

Data siswa

Data Orang tua

Data kelas

Data Inbox sms

Data Outbox sms

Data absensi

siswa

Orang tua

kelas

Inbox sms

data siswa yang diinputkan

data Orang tua yang diinputkan

data kelas yang diinputkan

data Inbox sms yang diinputkan

data Outbos sms tetap yang diinputkan

data jadwal absensi yang diinputkan

Outbox sms

absensi

Input data

Jurusan semester

1.3

Jurusan

semester

Data Jurusan semester Jurusan

semester

Data jurusan semester

yang diinputkan

Gambar 4.9. DAD Level 1 Proses Pengolahan Data

33

5. DAD Level 1 Proses Laporan

Setting

3.1

3.0

PROSES

PENGINPUTAN DATA

admin

Lap absensi harian

Lap absensi bulanan Kepala

sekolah

Lap absensi harian

Lap absensi bulanan

Gambar 4.10. DAD Level 1 Proses Transaksi Data

34

4.3. NORMALISASI

1. Normal Pertama (1NF)

Id_siswa Pek_ortu

Nis_siswa Tlp_ortu

Nama_siswa Id_semester

Jk_siswa Status

Id_kelas Id_absensi

Nm_kelas Tgl_absensi

Ket_kelas Jam_masuk

Wali_kelas Selisih_jam

Id_jurusan Jam_pulang

Nm_jurusan Absen_akhir

Id_ortu Absen

Nm_ortu

Alamat_ortu

Umur_ortu

Gambar 4.11. Bentuk normal pertama sistem

35

2. Normal Kedua (2NF)

Siswa

Orang Tua

id_siswa

id_ortu

nis_siswa

nm_ortu

nama_siswa

alamat_ortu

jk_siswa

umur_ortu

pek_ortu

Kelas

tlp_ortu

id_kelas nm_kelas

Semester

ket_kelas

id_semester

wali_kelas

status

Jurusan

Absensi

id_jurusan

id_absensi

nm_jurusan

tgl_absensi

jam_masuk

selisih_jam

jam_pulang

absen_akhir

absen

Gambar 4.12. Bentuk normal kedua sistem

36

3. Normal Ketiga (3NF) dalam Relasi Antar Tabel

Siswa

id_siswa*

Id_kelas**

Id_jurusan**

nis_siswanama_siswajk_siswa

Kelas

id_kelas*nm_kelas**ket_kelaswali_kelas

Jurusan

Id_jurusan*

Nm_jurusan

Orang Tua

Id_ortu*

Id_siswa*

Nm_ortu

Alamat_ortu

Umur_ortu

Pek_ortu

Tlp_ortu

Semester

Id_semester*

status

Absensi

Id_absensi*

Id_siswa**

Id_semsester**

tgl_absensi

jam_masuk

selisih_jam

jam_pulang

absen_akhir

absen

Gambar 4.13. Bentuk normal ketiga sistem

37

4.4. KAMUS DATA TABEL

1. Tabel Siswa

Jenis Tabel : Tabel Master

Kunci Tabel : id_siswa

Fungsi : Menampung data master siswa

No Nama Field Tipe Lebar Keterangan

1 id_siswa Varchar 15 Untuk menyimpan id siswa

2 id_kelas Varchar 15 Untuk menyimpan id kelas

3 id_jurusan Varchar 15 Untuk menyimpan id jurusan

4 nis_siswa Varchar 15 Untuk menyimpan nis siswa

5 nama_siswa Varchar 50 Untuk menyimpan nama siswa

6 jk_siswa Enum - Untuk menyimpan jenis kelamin siswa

Tabel 4.1. Struktur data tabel siswa

2. Tabel Kelas

Jenis Tabel : Tabel Master

Kunci Tabel : id_kelas

Fungsi : Menampung data kelas

No Nama Field Tipe Lebar Keterangan

1 Id_kelas varchar 15 Untuk menyimpan id kelas

2 nm_kelas varchar 15 Untuk menyimpan nama kelas

3 Ket_kelas varchar 20 Untuk menyimpan keterangan kelas

4 wali_kelas varchar 50 Untuk menyimpan wali kelas

Tabel 4.2. Struktur data tabel kelas

38

3. Tabel Jurusan

Jenis Tabel : Tabel Master

Kunci Tabel : id_jurusan

Fungsi : Menampung data master jurusan

No Nama Field Tipe Lebar Keterangan

1 id_jurusan varchar 15 Untuk menyimpan id jurusan

2 nm_jurusan varchar 15 Untuk menyimpan nama jurusan

Tabel 4.3 Struktur data tabel master jurusan

4. Tabel Orang tua

Jenis Tabel : Tabel Master

Kunci Tabel : id_ortu

Fungsi : Menampung data master orang tua

No Nama Field Tipe Lebar Keterangan

1 id_ortu varchar 4 Untuk menyimpan id orang tua

2 id_siswa varchar 50 Untuk menyimpan id siswa

3 nm_ortu varchar 11

Untuk menyimpan nama orang

tua

4 alamat_ortu varchar 5

Untuk menyimpan alamat orang

tua

5 Umur_ortu Int 2

Untuk menyimpan umur orang

tua

6 pek_ortu varchar 20

Untuk menyimpan pekerjaan

orang tua

7 tlp_ortu varchar 15

Untuk menyimpan telpon orang

tua

Tabel 4.4 Struktur data tabel master orang tua

5. Tabel Semester

Jenis Tabel : Tabel Master

Kunci Tabel : id_semester

Fungsi : Menampung data semester

No Nama Field Tipe Lebar Keterangan

1 Id_semester Varchar 15 Untuk menyimpan id semester

2 status Varchar 15 Untuk menyimpan status

Tabel 4.5 Struktur data tabel master semester

39

6. Tabel Absensi

Jenis Tabel : Tabel master Absensi

Kunci Tabel : id_absensi

Fungsi : Menampung data absensi

No Nama Field Tipe Lebar Keterangan

1 id_absensi varchar 15 Untuk menyimpan id absensi

2 id_siswa varchar 15 Untuk menyimpan id siswa

3 id_semester varchar 15 Untuk menyimpan id semester

4 tgl_absen Date - Untuk menyimpan tanggal absen

5 jam_masuk Time - Untuk menyimpan jam masuk

6 selisih_jam Time - Untuk menyimpan selisih jam

7 jam_pulang Time - Untuk menyimpan jam pulang

8 absen_akhir varchar 15 Untuk menyimpan absen akhir

9 absen varchar 15 Untuk menyimpan absen

Tabel 4.6 Struktur data tabel master absensi

40

4.5. FLOWCHART

1. Flowchart Sistem

Data siswa

simpan

siswa

Data orang tua

simpan

Orang tua barang

simpan

jurusan

simpan

kelas

simpan

semester

simpan

absensi

cetaksiswa semesterjurusankelasOrang tua

Lap absensi

harian

Lap absensi

bulanan

Data absensiData semesterData jurusanData kelas

Gambar 4.14. Flowchart Sistem

41

2. Flowchart Program

start

login

Tampilan

menu,Home,info,

setting

Pilih menu

Home

Pilih menu

Setting

Pilih menu

Info

start

A

Tampilan sub

menu:

siswa,ortu,kelas

,jursem

Pilih sub menu

siswa

Pilih sub menu

ortu

Pilih sub menu

jursem

Pilih sub menu

kelas

Inputkan :

id_siswa,id_kela

s,id_jurusan,nis_

siswa,nama_sis

wa,jk_siswa

Inputkan :

id_jurusan,nm_ju

rusan,id_semest

er,status

Inputkan :

id_ortu,id_siswa,

nm_ortu,alamat_

ortu,umur_ortu,p

ek_ortu,tlp_ortu

Inputkan :

id_kelas,nm_kel

as,ket_kelas,wali

_kelas

Simpan data

Simpan data

Simpan data

Simpan data

Inputkan data

siswa lagi

Inputkan data

jursem lagi

Inputkan data

kelas lagi

Inputkan data

ortu lagi

Menu

utama

T

T

T

T

T

T

Y

Y

Y

Y

Y

Y

Y

Y

Tampilan

sub menu :

Server

Gammu

Pilihan sub menu

server Gammu

Gambar 4.15. Flowchart Program

42

Tampilan sub

menu:

siswa,ortu,kelas

,jursem

Pilih sub menu

Inbox

Pilih sub menu

Outbox

Pilih sub menu

Absensi

Inputkan : inbox

Inputkan :

outbox

Inputkan :

id_kelas,nm_kel

as,ket_kelas,wali

_kelas

Simpan data

Simpan data

Simpan data

Inputkan data

inbox lagi

Inputkan data

kelas lagi

Inputkan data

outbox lagi

T

T

Y

Y

Y

A

Menu

Utama

T

Y

Y

Y

T

T

T

43

4.6. PERANCANGAN TAMPILAN INPUT

1) Tampilan Menu Home Data Siswa

a) Tabel yang dibuka yaitu tabel Siswa yang beratribut id_siswa,

id_kelas, id_jurusan, nis_siswa,nama_siswa,jk_siswa.

b) Inputkan id_siswa, id_kelas, id_jurusan, nis_siswa,

nama_siswa,jk_siswa.

c) Cara menginputkan yaitu klik tombol Input maka tombol Simpan,

tombol Edit dan tombol Batal akan aktif. Isikan datanya sesuai

dengan atributnya. Jika sudah terisi kemudian di simpan dengan

mengklik tombol Simpan maka secara otomatis data itu akan

tersimpan pada tabel Siswa. Untuk mengganti data klik tombol Edit

lalu simpan dengan mengklik tombol Simpan, untuk menghapus

klik tombol Hapus.

Gambar 4.16 Perancangan Tampilan Home Data Siswa

44

2) Tampilan Menu Home Data Orang Tua

a) Tabel yang dibuka yaitu tabel Sekolah yang beratribut id_ortu,

id_siswa,nm_ortu,alamat_ortu,umur_ortu,pek_ortu,tel_ortu.

b) Inputkan id_ortu, id_siswa, nm_ortu, alamat_ortu, umur_ortu,

pek_ortu, tel_ortu.

c) Cara menginputkan yaitu klik tombol Input maka tombol Simpan,

tombol Edit dan tombol Batal akan aktif. Isikan datanya sesuai

dengan atributnya. Jika sudah terisi kemudian di simpan dengan

mengklik tombol Simpan maka secara otomatis data itu akan

tersimpan pada tabel Siswa. Untuk mengganti data klik tombol Edit

lalu simpan dengan mengklik tombol Simpan, untuk menghapus

klik tombol Hapus.

Gambar 4.17 Perancangan Tampilan Home Data Orang Tua

45

3) Tampilan Menu Home Data Kelas

a) Tabel yang dibuka yaitu tabel Kelas yang beratribut

id_kelas,nm_kelas,ket_kelas,wali_kelas.

b) Inputkan id_kelas, nm_kelas, ket_kelas, wali_kelas.

c) Cara menginputkan yaitu klik tombol Input maka tombol Simpan,

tombol Edit dan tombol Batal akan aktif. Isikan datanya sesuai

dengan atributnya. Jika sudah terisi kemudian di simpan dengan

mengklik tombol Simpan maka secara otomatis data itu akan

tersimpan pada tabel Siswa. Untuk mengganti data klik tombol Edit

lalu simpan dengan mengklik tombol Simpan, untuk menghapus

klik tombol Hapus.

Gambar 4.18 Perancangan Tampilan Home Data Kelas

46

4) Tampilan Menu Home Jurusan Semester.

a) Tabel yang dibuka yaitu tabel Jurusan Semester yang beratribut

id_jurusan,nm_jurusan,id_semester,status.

b) Inputkan id_jurusan, nm_jurusan, id_semester, status.

c) Cara menginputkan yaitu klik tombol Input maka tombol Simpan,

tombol Edit dan tombol Batal akan aktif. Isikan datanya sesuai

dengan atributnya. Jika sudah terisi kemudian di simpan dengan

mengklik tombol Simpan maka secara otomatis data itu akan

tersimpan pada tabel Siswa. Untuk mengganti data klik tombol Edit

lalu simpan dengan mengklik tombol Simpan, untuk menghapus

klik tombol Hapus.

Gambar 4.19 Perancangan Tampilan Home Jurusan Semester.

47

5) Tampilan Menu Info Absensi.

a) Tabel yang dibuka yaitu tabel Absensi Pengaturan tetap yang

beratributid_absensi,id_siswa,id_semester,tgl_absen,jam_masuk,seli

sih_jam, jam_pulang,absen_akhir,absen.

b) Inputkan id_absensi, id_siswa, id_semester, tgl_absen, jam_masuk,

selisih_jam, jam_pulang, absen_akhir, absen.

c) Cara menginputkan yaitu klik tombol Input maka tombol Simpan,

tombol Edit dan tombol Batal akan aktif. Isikan datanya sesuai

dengan atributnya. Jika sudah terisi kemudian di simpan dengan

mengklik tombol Simpan maka secara otomatis data itu akan

tersimpan pada tabel Siswa. Untuk mengganti data klik tombol Edit

lalu simpan dengan mengklik tombol Simpan, untuk menghapus

klik tombol Hapus. Untuk mencetak Absensi klik tombol Cetak.

Gambar 4.20 Perancangan Tampilan Info Absensi

48

3.7. PERANCANGAN TAMPILAN OUTPUT

1) Perancangan Tampilan Laporan Absensi

d) Laporan data transaksi ini diambil dari tabel data Absensi yang

beratribut id_absensi, id_siswa, id_semester, tgl_absen, jam_masuk,

selisih_jam, jam_pulang, absen_akhir, absen.

Gambar 4.21. Perancangan Tampilan Laporan Absensi