BAB IV PERANCANGAN SISTEM. sebelum melakukan coding kedalam suatu bahasa pemograman. Dalam

(1)

50

Perancangan sistem merupakan tahap lanjutan dari analisis sistem, dimana pada perancangan sistem digambarkan rancangan sistem yang akan dibangun sebelum melakukan coding kedalam suatu bahasa pemograman. Dalam perancangan suatu sistem tidak lepas dari hasil analisa, karena analisa sistem baru dapat dibuat suatu rancangan sistem.

Pada tahap ini dijelaskan tentang pembuatan sketsa atau pengaturan dari beberapa elemen yang terpisah kedalam satu kesatuan yang utuh dan berfungsi atau bermanfaat. Perancanagan sistem dibagi menjadi dua yaitu desain konseptual atau desain secara umum dan desain terinci atau desain secara fisik. Desain umum yang akan diaplikasikan adalah bertujuan untuk memberikan gambaran secara umum kepada pengguna tentang sistem yang akan dibangun. Desain umum mengidentifikasikan komponen-komponen sistem informasi yang akan didesain secara rinci.

Pada tahap perancangan perangkat lunak Sistem Informasi Pengolahan Data Siswa dan Nilai berbasis Web pada SMP Hangtuah Kota Tanjungpinang sesuai dengan analisis yang dilakukan pada bab sebelumnya, terdapat beberapa pokok pembahasan yang meliputi:

1. Tujuan perancangan perangkat lunak.

2. Ruang lingkup sistem perangkat lunak.

(2)

3. Analisis kebutuhan perangkat lunak yang meliputi : a. Analisis database.

b. Analisis Fungsional.

4. Perancangan perangkat lunak yang meliputi : a. Perancangan struktur file.

b. Diagram hubungan antar entitas.

c. Perancangan antar muka.

d. Perancangan struktur menu.

A. Tujuan Perancangan Perangkat Lunak.

Tujuan dari perangkat lunak ini adalah penanganan atas permasalahan-permasalahan yang ada dan mendapatkan gambaran dari sistem perangkat lunak yang akan dibangun sesuai dengan ruang lingkup masalah yang telah ditentukan.

(3)

B. Rancangan Alur Pengolahan Data dan Nilai

Flowmap Usulan Pengolahan Data Siswa

Kepala Sekolah Admin

Siswa

Form Data Siswa Form Data Siswa

Pengisian Data Siswa

Form Data Siswa Yang Diisi

Input Data Siswa

Pass Default Pass Default

Update Data Siswa

Laporan Siswa

Update Data Siswa db

Pembuatan laporan

Laporan siswa Laporan siswa

arsip

Gambar 4.1 Flowmap Usulan Pengolahan Data Siswa

(4)

Flow map usulan pengolahan data guru

Admin Kepala Sekolah

Guru

Form pengisian data guru

Pengisian form

Form pengisian yang telah diisi

Kelengkapan

Form pengisian yang telah diisi lengkap

Laporan data guru

T

Y

arsip

Pengimputan data guru

db Pass default

Pass default

Update data guru Update data guru

Pembuatan laporan

Laporan data guru Laporan data guru

Gambar 4.2 Flowmap Usulan Pengolahan Data Guru

(5)

Flow map usulan pengolahan data nilai

Guru Admin Kepala sekolah Wali kelas Siswa

Tugas,harian,uts, uas

Buku laporan nilai siswa

Buku laporan nilai siswa yang telah

ACC

Pembuata evaluasbel ajar yg pernah dtmpuhi

arsip Penilaian

Tugas,harian,uts, uas

Penilaian

db

Pembuatan laporan nilai siswa

Pembuatan laporan permatapelajaran Pembuatan laporan

Laporan nilai persiswa

Laporan nilai permata pelajaran

Laporan nilai semua siswa

ACC buku laporan nilai

siswa

ACC

Buku laporan nilai siswa yang telah ACC

Y T

Gambar 4.3 Flowmap usulan pengolahan data nilai

Kelemahan sistem yang berjalan adalah sistem pengolahan masih bersifat manual, penyimpanan data belum rapi dan teratur, sehingga pengolahan data belum efektif dan efisien. Sistem yang diusulkan hampir mirip dengan sistem yang berjalan, perbedaan yang mendasar adalah untuk penyimpanan data. Dimana data pada sistem yang berjalan disimpan didalam sebuah arsip, sedangkan pada sistem yang diusulkan data siswa, data disimpan ke dalam sebuah database yang mana setiap table akan di sertai dengan primary key sehingga duplikasi data dapat dihindarkan. Dan dalam proses pencarian data akan lebih mudah.

(6)

C. Diagram Konteks

Diagram konteks yaitu diagram yang menggambarkan hubungan antara entitas eksternal dengan sistem. Dimana data yang di inputkan oleh bagian komponen eksternal akan diperoses didalam sistem dan akan menghasilkan laporan yang di inginkan oleh komponen eksternal tersebut.

Untuk lebih jelasnya dapat dilihat pada gambar berikut ini:

Sistem informasi pengolahan data siswa dan

nilai berbasis web Siswa

Admin

Guru

Kepala Sekolah Data Siswa Data Nilai Data Kelas

Data Matpel Data Guru

Data Account Data Pesan Upload File

Laporan Siswa Per Wlk

Data MatPel

Laporan Data Nilai Laporan Data Siswa Laporan Nilai

Laporan Data MatPel Data Login

Data Pesan

Laporan Nilai Laporan Siswa

Laporan Guru

Data Nilai Data Guru Data Pesan/berita

Data Upload file Laporan Nilai

Laporan data Guru Laporan Data MatPel

Download file

Gambar 4.4 Diagram Konteks

Pada gambar diagra konteks diatas terdapat empat entitas yang terdiri dari Admin, Siswa, Guru, dan Kepala Sekolah. Entitas Admin menginput data siswa, data nilai, data kelas, data matpel, data guru, data

(7)

account, data pesan, upload file kepada sistem untuk kemudian diolah

kedalam sistem. Entitas Siswa menginput data pesan dan data login kepada Sistem untuk kemudian diolah kedalam sistem. Kemudian sistem memberikan laporan nilai, laporan siswa, dan laporan kepada admin. Jika terjadi salah dalam penginputan data maka sistem dapat melakukan hapus data dan data akan kembali seperti semula. Entitas Guru mengimputkan data matpel, data nilai, data guru, data pesan/berita, dan data upload file ke sistem untuk dapat diproses kedalam sistem. Entitas Kepala Sekolah menerima laporan data nilai, data mata pelajaran, data guru dan data siswa dari sistem.

1. Diagaram Arus Data (Data Flow Diagram (DFD))

Diagram arus data merupakan diagram yang menggambarkan arus data dalam sistem yang akan dibangun, secara pararel dan terstruktur dengan mengikut sertakan komponen-komponen entitas-entitas yang terkait baik entitas luar maupun entitas dalam, media penyimpanan (storage), proses- proses sistem maupun simbol-simbol panah yang menunjukan hubungan arus data dari proses entitas yang terkait.

2. Data Flow Diagram (DFD) Level 0

Diagram arus data mempunya level atau tingkatan, level 0 merupakan diagram arus yang mendasar dari sebuah proses, sedangkan level 1 dan seterusnya adalah merupakan

(8)

pengembangan dari proses-proses yang ada pada level 0 yang bertujuan untuk lebih mudah untuk dimengerti dan dipahami.

Untuk lebih jelasnya dapat dilihat pada gambar dibawah ini:

0.1 Proses nilai

0.2 Proses Kelas

0.3 Proses input

0.4 Proses laporan

0.5 Proses Pesan

Data Kelas

Login Guru

Login siswa

Data siswa Data nilai

Data mata pelajaran Guru

Admin

Kepala sekolah

Data nilai Data nilai Data login

Data nilai

Data mata pelajaran

Laporan nilai Laporan guru Laporan siswa

Siswa Data nilai

Data nilai

Data Kelas

Data Kelas Data Kelas

Data Siswa Data Guru Data Nilai Data Kelas

Data mata pelajaran Data siswa Data guru Data nilai Data kelas

Data Login Data account

Data account

Data acconut

Data siswa

Data guru Data guru

Data mata pelajaran

Data nilai Data siswa

Data guru

Pesan Data pesan

Data pesan

Data Pesan

Data Pesan Data pesan

Data pesan Data pesan

Gambar 4.5 Data Flow Diagram Level 0

(9)

Dari gambar diatas dapat dilihat proses secara umum pada sistem yang akan dirancang. Proses-proses yang terdapat pada sistem adalah proses login , proses input data guru, proses input data siswa, proses input data nilai,proses pembagian kelas dan proses pembuatan laporan yang mana dari proses tersebut menghasilkan keluaran seperti form data guru, form data guru, form data nilai, form data pembagian kelas, data hapus nilai,pembagian kelas dan proses cetak laporan, dimana masing-masing proses data tersebut memerlukan data masukan dan akan menghasilkan data keluaran.

Admin Guru Siswa

1.0 Proses Input

1.1 Proses Update

1.3 Proses Lihat 1.2

Proses Hapus

Nilai Data Nilai

Data Nilai

Data Nilai Data Nilai

Data Nilai

Data Nilai Data Nilai

Data Nilai

Gambar 4.6 DFD Level 1 Proses 1

(10)

Siswa Admin

2.1 Proses

Lihat

2.2 Proses Pembagian

Kelas

2.3 Proses Input

Kelas

2.4 Proses Update

Kelas

2.5 Proses Hapus

Data Siswa Kelas

Data Kelas

Data Siswa Data Kelas

Data Siswa Data Siswa

Data Kelas

SISWA GURU ADMIN

3.0 Proses Input Data

Siswa

3.1 Proses Input Data

Guru

3.2 Proses Input data

Mata Pelajaran

3.3 Proses Input data

Nilai

3.4 Proses Input

Data Kelas

Siswa Guru MatPel Nilai Kelas

Data Siswa

Data Guru Data Siswa

Data Guru

Data Mata Pelajaran

Data Nilai

Data Kelas

Data Siswa

Data Guru Data Mata

Pelajaran Data Nilai

Data Kelas

Gambar 4.8 DFD Level 1 proses 3

(11)

Admin Siswa Guru

5.0 Proses Lihat

5.3 Proses Update 5.1

Proses Hapus

5.2 Proses Input

Pesan

Data Pesan Data Pesan

Data Pesan

D. Kamus Data

Kamus data merupakan kamus yang digunakan untuk menjelaskan seluruh proses data yang terdapat dalam data flow diagram. Berikut adalah penjelasan tentang nama, diskripsi, struktur data, penggunaan dan format data dari setiap aliran data yang terdapat pada Data Flow Diagram diatas.

Tabel 4.1 Tabel kamus Data

Nama Data Guru

Deskripsi Informasi data yang dimiliki oleh Guru

Struktur data Data guru= NIP, nama_guru, tempat_lahir, tgl_lahir, jenis_kelamin, agama, jabatan,

(12)

gaji_poko, gambar

Digunakan Untuk penyimpanan data guru yang dihapus

Format data Text

Nama Data Data Siswa

Deskripsi Informasi data yang dimiliki oleh data siswa Struktur data Data siswa = NIS, nama_siswa,

jenis_kelamin,tgl_lahir,tempat_lahir , agama, alamat,gambar,kelas, tahun_masuk

Digunakan Untuk penambahan dan perubahan informasi data siswa

Format data Text

Nama Data kelas

Deskripsi Informasi data yang diberikan oleh kelas

Struktur data Data kelas = kode_kelas, kelas, wali_kelas, tingkat

Digunakan Untuk penambahan dan perubahan informasi data kelas di basis data

Format data Text

(13)

Nama Data login guru Deskripsi Informasi data login guru

Struktur data Data login guru = Username, password,

Digunakan Untuk data login guru

Format data Text

Nama Data login siswa

Deskripsi Informasi data login siswa

Struktur data Data login siswa = Username, password,

Digunakan Untuk data login siswa

Format data Text

Nama Data login admin

Deskripsi Informasi untuk data login admin

Struktur data Data login admin = Username,password, Digunakan Untuk mengetahui data loging admin

Format data Text

(14)

Nama Data mata pelajaran Deskripsi Informasi data data mata pelajaran

Struktur data Data mata pelajaran = kd_mp, mat_pel, pengajar, tingkat

Digunakan Untuk penambahan dan perubahan informasi mata pelajaran di basis data

Format data Text

Nama Data nilai

Deskripsi Informasi data data nilai

Struktur data Data nilai = ID_nilai, nis, kelas, mat_pel, tugas,harian, UTS, UAS, Total, predikat, ket, tahun_ajaran, semester,

Digunakan Untuk penambahan dan perubahan informasi nilai di basis data

Format data Text

Nama Data pesan

Deskripsi Informasi data pesan

Struktur data Data pesan = ID_pesan, username, pesan, waktu,sebagai

(15)

Digunakan Untuk penambahan dan perubahan informasi pesan di basis data

Format data Text

Nama Data uploade_file

Deskripsi Informasi data uploade file

Struktur data Data uploade_file = ID_uploade, penguploade, katagori, filename, tmpname

Digunakan Untuk penambahan dan perubahan informasi uploade_file di basis data

Format data Text

1. Relasi Antar Data (ERD) dan Relasi Antara Tabel

Pada diagram ini akan digambarkan hubungan antar entitas yang terlibat dalam sistem informasi pengolahan data siswa dan data nilai pada SMP Hangtuah Tanjungpinang yang akan dibangun.

(16)

Siswa memiliki Nilai diinput Admin

memberi

Guru 1

1

N 1

1 N

N

Gambar 4.10 Diagram Hubungan Antar Entitas (ERD)

E. Struktur File

Basis data yang digunakan yaitu Mysql. Dibuat sebuah database dengan nama “smp_hangtuah” dimana terdapat data-data siswa dan nilai dalam beberapa tabel yang mengandung Field-Field tertentu yang di susun sesuai kebutuhan.

1. Rancangan Struktur File

Rancangan struktur file merupakan salah satu bagian yang penting dalam perancangan sistem berbasis komputer, selanjutnya yang dimaksud file dalam data base adalah file data atau tabel data.

Data base ini berfungsi sebagai penyedia informasi bagi si pemakai sistem.

(17)

File-file yang digunakan dalam perancangan aplikasi akademik ini dapat dilihat dibawah ini:

a. Tabel arsip

Nama Tabel : tb data_guru

Fungsi : Menyimpan data penghapusan pada data guru

Primary Key : nip

Tabel 4.2 Struktur File data guru

NO Nama Field Type Size Keterangan

1 Nip Varchar 25 No induk pegawai

2 Nama Varchar 25 Nama guru

3 tempat_lahir Varchar 25 Tempat lahir 4 tanggal_lahir Date - Tanggal lahir 5 jenis_kelamin Varchar 10 Jenis kelamin

6 Agama Varchar 25 Agama

7 Jabatan Varchar 25 Jabatan 8 gaji_pokok Integer 8 Gaji pokok

9 Gambar Blob - Fhoto guru

b. Tabel data siswa

Nama Tabel : tb data_siswa

Fungsi : menyimpan dan mengahapus siswa Primary Key : nis

(18)

Tabel 4.3 Struktur File data siswa

c. Tabel kelas

Nama Tabel : tb kelas

Fungsi :menyimpan data dan penghapusan data kelas

Primary Key : kd_kls

1 Nis Varchar 5 No induk siswa

2 Nama Varchar 30 Nama siswa

3 jenis_kelamin Varchar 10 Jenis kelamin

4 tgl_lahir Date - Tanggal lahir

5 tmpt_lahir Varchar 25 Tempat lahir

6 Agama Varchar 25 Agama

7 Alamat Varchar 35 Alamat siswa

8 Gambar Blob - Fhoto siswa

9 Kelas Varchar 4 Kelas

10 tahun_masuk Varchar 9 Tahun masuk

(19)

Tabel 4.4 Struktur File kelas

d. Tabel login

Nama Tabel : tb login

Fungsi : menyimpan dan menghapus data login Primary Key : username

Tabel 4.5 Struktur File login

1 Username Varchar 25 Username untuk login

2 password Varchar 25 Password untuk login

e. Tabel login guru

Nama Tabel : tb guru

Fungsi : menyimpan dan mengahapus data login guru Primary Key : username

1 kd_kls Varchar 4 Kode kelas

3 wali_kelas Varchar 25 Wali kelas

4 Tingkat Varchar 1 Tingkat siswa

(20)

Tabel 4.6 Struktur File guru

1 Username Varchar 25 Username guru

2 password Varchar 25 Password guru

f. Tabel login siswa

Nama Tabel : login_siswa

Fungsi : menyimpan dan menghapus data login siswa Primary Key : username

Tabel 4.7 Struktur File login

1 Username Varchar 25 Username siswa

2 password Varchar 25 Password siswa

g. Tabel mata_pelajaran

Nama Tabel : tb mata_pelajaran

Fungsi : menyimpan dan menghapus data mata pelajaran

Primary Key : kdmp

(21)

Tabel 4.8 Struktur File mata_pelajaran

h. Tabel nilai

Nama Tabel : tb nilai

Fungsi : menyimpan dan menghapus data nilai Primary Key : id_nilai

Foreign key : nis.

Tabel 4.9 Struktur File mata_pelajaran

1 Kdmp Varchar 4 Kode mata pelajaran

2 mat_pel Varchar 25 Mata pelajaran

3 Pengajar Varchar 25 Pengajar

4 Tingkat Varchar 10 Tingkat

1 id_nilai Integer 4 Id nilai

2 Nis Varchar 5 No induk siswa

4 mat_pel Varchar 18 Mata pelajaran

5 Tugas Float - Tugas

6 Harian Float - Harian

(22)

i. Tabel pesan

Nama Tabel : tb pesan

Fungsi : menyimpan dan mengahapus data pesan Primary Key : id_pesan

Tabel 4.10 Struktur File pesan

7 Uts Float - Uts

8 Uas Float - UAS

9 Total Flaot - Total

10 Prediket Varchar 1 Predikat

11 Ket Varchar 12 Keterangan data nilai

12 tahun_ajaran Varchar 9 Tahun ajaran

13 Semester Varchar 1 Semester

1 id_pesan Integer 5 Id pesan

2 Username Varchar 15 Username

3 Pesan Longtest - Pesan

4 Waktu Datetime - Jam,tgl,bln,thn

5 Sbg Varchar 5 Keterangan login

(23)

j. Tabel upload_file

Nama Tabel : tb upload_file

Fungsi : menyimpan dan menghapus data upload Primary Key : id_upload

Tabel 4.11 Struktur File upload_file

F. Relasi Tabel

Tb.data_guru

Nip nama

Tempat_lahir Tanggal_lahir Jenis_kelamin Agama Jabatan Gaji_pokok Gambar

Tb. Kelas Kd_kelas Kelas Wali_kelas Tingkat

Tb.data_siswa

Nis nama

Tempat_lahir Tanggal_lahir Jenis_kelamin

Agama Alamat

Kelas Gambar

Tahun_masuk

Tb. Mata pelajaran Kdmp Mata_pelajaran Pengajar Tingkat

Tb. Nilai

Id_nilai Nis Kelas Mata_pelajaran Tugas Harian

UAS Total

Predikat Ket Tahun_ajaran Semeter Tb. Login

Username Password

Tb. Login_siswa Username Password

Tb. Login_guru Username Password

Tb. Upload_file

Id_upload Pengapload

Katagori File name

Tb. Pesan

Id_pesan Username Pesan Waktu

Tmp_name

Sebagai

Gambar 4.11 Relasi tabel

1 id_upload Integer 4 Id upload

2 Pengupload Varchar 15 Pengupload

3 Kategori Varchar 12 Katagori

4 Filename Varchar 40 Filename

5 Tmpname Varchar 35 Tempat penyimpan

(24)

H. Perancangan Hirarki Program

Hirarki program yang dikembangkan dalam perancangan sistem informasi pengolahan data siswa dan nilai berbasis web pada smp hangtuah kota tanjungpinang merupakan analisis dengan mengunakan diagram alir data (DFD).

Login

Admin Guru Siswa

Siswa

Guru

Kelas

MatPel

Nilai

Upload

Pesan

ID Pass

LogOut

Profil

Wali Kelas Nilai

Upload

Pesan

Account

LogOut

Profil

Nilai

Pesan

Download

Account

LogOut

Gambar 4.12 Rancangan Hirarki Program

Dalam perancangan struktur program sistem infromasi pengolahan data dan nilai menggambarkan proses login admin, login guru dan login siswa struktur program ini dibagi menjadi modul-modul kecil yang mudah diperbaiki jika terjadi kesalahan dan mudah diuji coba jika ada modifikasi.

(25)

Struktur program dibagi tiga bagian, login admin, login guru dan login siswa. Isi dari login admin adalah Data siswa, data guru, data kelas, data mata pelajran, data nilai, data file, data pesan dan data Id pass. Kemudian yang menjadi proses adalah Input data siswa, edit data siswa, hapus data siswa, input data guru, edit data guru, hapus data guru, input data kelas, edit data kelas, hapus data kelas, input data mata pelajaran, edit data mata pelajaran, hapus data mata pelajaran, input data nilai, edit data nilai, hapus data nilai, input data file, edit data file, hapus data file, input data pesan, hapus data pesan. Sedangkan output nya adalah Laporan siswa, laporan guru, laporan kelas, laporan mata pelajaran, laporan nilai, PDF.

Sedangkan login guru terdapat profil, nilai, wali kelas, upload, pesan account, dimana pada proses input terdapat pada data nilai. Sedangkan pada login siswa terdapat profil, nilai, pesan, download, account, disina data input adalah pesan, hasil output yaitu data nilai.

(26)

Admin.php Guru.php Siswa.php

Admin_Siswa.php

Admin_Guru.php

Admin_Kelas.php

Admin_MatPel.php

Admin_Nilai.php

Admin_Upload.php

Admin_Pesanphp

Admin_berita.php

Admin.php

Guru_Profil.php

Guru_Nilai.php

Guru_Walikelas.php

Guru_upload.php

Guru_Pesan.php

Siswa_Profil.php

Siswa_Nilai.php

Siswa_Pesan.php

Siswa_Download.php

Siswa_pass.php Login.php

Guru_pass.php

Gambar 4.13 Rancangan Hirarki Link program

1. Perancangan Hirarki Menu

Struktur menu merupakan bentuk umum dalam suatu perancangan aplikasi yang dapat memudahkan pengguna dalam mengunakan sistem yang dibangun. Dengan adanya struktur menu ini, maka proses pengolahan data diharapkan lebih cepat dilakukan, sehingga keterlambatan dalam penyajian data dapat ditekan seminimal mungkin. Struktur menu yang dibuatkan dalam sistem ini terdiri dari menu-menu dan sub menunya.

(27)

Dapat dilihat dari gambar berikut :

Sistem Pengolahan

Beranda Sekolah Guru Siswa Kelas Mat_pel Album Fhoto Berita

Login

Gambar 4. 14 Hirarki Struktur Menu/Utama

2. Perancangan Format Masukan (Input Design)

Rancangan masukan digunakan oleh pemakai sistem dalam berkomunikasi dengan komputer (User Interface). Rancangan masukan ini berupa pemasukan data kedalam database sistem, perancangan input meliputi desain berbentuk dokumen-dokumen input yang digunakan, dokumen input sangat penting pada sistem informasi. Data yang salah tercatat di dokumen akan mengakibatkan output yang dihasilkan sistem otomatis akan salah.

Perancangan input disini dilakukan dengan menelusuri output yang dihasilkan sistem informasi sehingga ditemukan item apa saja yang harus ada dalam sistem output.

(28)

Adapun rancangan input nya dapat dilihat pada gambar :