BAB IV PERANCANGAN SISTEM
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.
50
51
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.
52
B.
Rancangan Alur Pengolahan Data dan Nilai
Flowmap Usulan Pengolahan Data Siswa Siswa
Admin
Form Data Siswa
Kepala Sekolah
Laporan Siswa
Form Data Siswa
Pengisian Data Siswa
Form Data Siswa Yang Diisi
Form Data Siswa Yang Diisi
Input Data Siswa
Pass Default
Pass Default
Update Data Siswa
Update Data Siswa
db
Pembuatan laporan
Laporan siswa Laporan siswa
arsip
Gambar 4.1 Flowmap Usulan Pengolahan Data Siswa
53
Flow map usulan pengolahan data guru Guru
Admin
Form pengisian data guru
Kepala Sekolah
Form pengisian data guru Laporan data guru
Form pengisian yang telah diisi Pengisian form
T
Kelengkapan Form pengisian yang telah diisi Y Form pengisian yang telah diisi lengkap
Pengimputan data guru
Pass default
Pass default
Update data guru
Update data guru
db
Pembuatan laporan
Laporan data guru Laporan data guru
arsip
Gambar 4.2 Flowmap Usulan Pengolahan Data Guru
54
Flow map usulan pengolahan data nilai Siswa
Guru
Admin
Kepala sekolah
Wali kelas
Tugas,harian,uts, uas
Tugas,harian,uts, uas
Tugas,harian,uts, uas
Buku laporan nilai siswa
Buku laporan nilai siswa yang telah ACC
Penilaian
ACC buku laporan nilai siswa
Penilaian
Pembuata evaluasbel ajar yg pernah dtmpuhi
T
db ACC
Y Pembuatan laporan nilai siswa
Pembuatan laporan
Pembuatan laporan permatapelajaran
Laporan nilai persiswa
Laporan nilai permata pelajaran
arsip Buku laporan nilai siswa yang telah ACC
Laporan nilai semua siswa
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.
55
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:
Admin Data Siswa Data Nilai Data Kelas
Laporan Nilai Laporan Siswa Laporan Guru Laporan Data MatPel
Data Matpel Data Guru Data Account Data Pesan Upload File Laporan Siswa Per Wlk
Download file
Laporan Nilai
Laporan Nilai Siswa Data Pesan
Sistem informasi pengolahan data siswa dan nilai berbasis web
Data Login
Guru Data MatPel Data Nilai Data Guru Data Pesan/berita Data Upload file
Laporan Data Nilai Laporan Data Siswa Laporan Data MatPel Laporan data Guru
Kepala Sekolah
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
56
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), prosesproses 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
57
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:
Data pesan
Data pesan Data nilai
Guru
Siswa Data login
Data nilai
Data nilai Data nilai Data pesan
Data nilai Data nilai Data nilai
0.1 Proses nilai
Data nilai
Data Kelas
Data Kelas
Data account
0.2 Proses Kelas
Admin
Data Kelas
Data Login
Data Kelas
Data mata pelajaran Data Siswa Data Guru Data Nilai Data Kelas
Data account
0.3 Proses input
Login Guru
Data acconut Login siswa
Data mata pelajaran Data siswa Data guru Data nilai Data kelas
Data siswa
Data siswa
Data guru Kepala sekolah
Data guru Laporan nilai Laporan siswa Laporan guru
Data mata pelajaran Data mata pelajaran
Data pesan 0.4 Proses laporan Data nilai Data siswa Data guru
Data pesan
Data pesan Data Pesan Data pesan 0.5 Proses Pesan
Pesan Data Pesan
Gambar 4.5 Data Flow Diagram Level 0
58
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
Data Nilai
Data Nilai
Data Nilai
Data Nilai
Data Nilai Data Nilai
Data Nilai Data Nilai
1.0 Proses Input
1.1 Proses Update
1.2 Proses Hapus
1.3 Proses Lihat
Data Nilai Data Nilai
Data Nilai
Nilai
Gambar 4.6 DFD Level 1 Proses 1
59
Admin
Siswa
Data Siswa
Data Kelas
Data Kelas
Data Kelas Data Siswa
Data Kelas
2.1 Proses Lihat
2.2 Proses Pembagian Kelas
Data Siswa
Data Kelas
2.5 Proses Hapus
2.4 Proses Update Kelas
2.3 Proses Input Kelas
Data Kelas
Data Siswa Data Kelas
Data Kelas
Data Siswa
Kelas
Data Siswa
Gambar 4.7 DFD Level 1 Proses 2
SISWA
GURU
ADMIN
Data Siswa
Data Nilai Data Siswa
Data Guru
Data Kelas
Data Guru
3.0 Proses Input Data Siswa
3.1 Proses Input Data Guru
Data Mata Pelajaran
3.2 Proses Input data Mata Pelajaran
3.3 Proses Input data Nilai
Data Kelas
Data Siswa Data Guru
Siswa
3.4 Proses Input Data Kelas
Data Mata Pelajaran
Guru
Data Nilai
MatPel
Nilai
Gambar 4.8 DFD Level 1 proses 3
Kelas
60
Admin
Siswa
Guru
Data Pesan Data Pesan Data Pesan
5.0 Proses Lihat
Data Pesan
5.1 Proses Hapus
5.2 Proses Input
5.3 Proses Update
Data Pesan Data Pesan Data Pesan
Data Pesan
Pesan
Gambar 4.9 DFD Level 1 Proses 5
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=
tgl_lahir,
NIP,
nama_guru,
jenis_kelamin,
tempat_lahir,
agama,
jabatan,
61
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,
jenis_kelamin,tgl_lahir,tempat_lahir
nama_siswa, ,
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
62
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
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
63
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
64
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.
65
Siswa
1
memiliki
N
Nilai
N
diinput
1
Admin
N
memberi
11
Guru
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.
66
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
67
Tabel 4.3 Struktur File data siswa NO
Nama Field
Type
Size
Keterangan
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
c. Tabel kelas Nama Tabel Fungsi
: tb kelas :menyimpan data dan penghapusan data kelas
Primary Key
: kd_kls
68
Tabel 4.4 Struktur File kelas NO
Nama Field
Type
Size
Keterangan
1
kd_kls
Varchar
4
Kode kelas
2
Kelas
Varchar
10
Kelas
3
wali_kelas
Varchar
25
Wali kelas
4
Tingkat
Varchar
1
Tingkat siswa
d. Tabel login Nama Tabel
: tb login
Fungsi
: menyimpan dan menghapus data login
Primary Key
: username
Tabel 4.5 Struktur File login NO
Nama Field
Type
Size
Keterangan
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
69
Tabel 4.6 Struktur File guru NO
Nama Field
Type
Size
Keterangan
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 NO
Nama Field
Type
Size
Keterangan
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
70
Tabel 4.8 Struktur File mata_pelajaran NO
Nama Field
Type
Size
Keterangan
1
Kdmp
Varchar
4
Kode mata pelajaran
2
mat_pel
Varchar
25
Mata pelajaran
3
Pengajar
Varchar
25
Pengajar
4
Tingkat
Varchar
10
Tingkat
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 NO
Nama Field
Type
Size
Keterangan
1
id_nilai
Integer
4
Id nilai
2
Nis
Varchar
5
No induk siswa
3
Kelas
Varchar
4
Kelas
4
mat_pel
Varchar
18
Mata pelajaran
5
Tugas
Float
-
Tugas
6
Harian
Float
-
Harian
71
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
i. Tabel pesan Nama Tabel
: tb pesan
Fungsi
: menyimpan dan mengahapus data pesan
Primary Key
: id_pesan
Tabel 4.10 Struktur File pesan NO
Nama Field
Type
Size
Keterangan
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
72
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 NO
Nama Field
Type
Size
Keterangan
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
F.
Relasi Tabel
Tb.data_guru Nip nama Tempat_lahir Tanggal_lahir
Tb. Kelas Kd_kelas Kelas Wali_kelas Tingkat
Jenis_kelamin Agama Jabatan Gaji_pokok Gambar
Tb. Mata pelajaran Kdmp Mata_pelajaran Pengajar Tingkat
Tb.data_siswa Nis nama Jenis_kelamin Tempat_lahir Tanggal_lahir Agama Alamat Gambar Kelas Tahun_masuk
Tb. Login Username
Tb. Nilai Id_nilai Nis Kelas Mata_pelajaran Tugas Harian UAS Total Predikat Ket Tahun_ajaran Semeter
Password
Tb. Upload_file Tb. Login_siswa Id_upload Username Password
Pengapload Katagori File name Tmp_name
Tb. Login_guru Username
Tb. Pesan
Password Id_pesan Username Pesan Waktu Sebagai
Gambar 4.11 Relasi tabel
73
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
Profil
Profil
Guru
Nilai
Nilai
Kelas
Wali Kelas
Pesan
MatPel
Upload
Download
Nilai
Pesan
Account
Upload
Account
LogOut
Pesan
LogOut
ID Pass
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.
74
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.
75
Login.php
Admin.php
Guru.php
Siswa.php
Admin_Siswa.php
Guru_Profil.php
Siswa_Profil.php
Admin_Guru.php
Guru_Nilai.php
Siswa_Nilai.php
Admin_Kelas.php
Guru_Walikelas.php
Siswa_Pesan.php
Admin_MatPel.php
Guru_upload.php
Siswa_Download.php
Admin_Nilai.php
Guru_Pesan.php
Siswa_pass.php
Admin_Upload.php
Guru_pass.php
Admin_Pesanphp
Admin_berita.php
Admin.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.
76
Dapat dilihat dari gambar berikut :
Sistem Pengolahan
Beranda
Sekolah
Guru
Siswa
Kelas
Mat_pel
Album Fhoto
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.
Berita
77
Adapun rancangan input nya dapat dilihat pada gambar :
Headder Menu User name XXXXXXXXXXXXXXX
Password XXXXXXXXXXXXXXX
Siswa
Login
Guru Admin
Footer
Gambar 4.15 Rancangan Form Login
HEADER MENU PROFIL DATA GURU
NAMA TEMPAT LAHIR
FHOTO
TANGGAL LAHIR JENIS KELAMIN
: : : :
AGAMA
:
JABATAN
:
GURU
:
FOOTER
Gambar 4.16 Rancangan Form data guru
78
HEADER MENU SELECT KELAS
SEMESTER
MATA PELAJARAN
::
KELAS
:
MATA PELAJARAN
TAHUN AJARAN
FOOTER
Gambar 4.17 Rancangan Form nilai sebagai guru
HEADER
MENU
DATA ACCOUNT PASSWORD
Username Password New pass Ulangi pass Cancel
SAVE
FOOTER
Gambar 4.18 Rancangan Form Account
79
Headder Menu You can download file Select katagori
Materi
Footer
Gambar 4.19 Rancangan Form Download
Headder Menu
Daftar nilai Tahun ajaran
semester
XXXXXXXXX
XXXXXXXXX
PDF
Footer
Gambar 4.20 Rancangan Form nilai
80
Headder Menu
Sisa
300
Cancel
1
2
Kirim
3
Footer
Gambar 4.21 Rancangan Form Pesan
Headder Menu Profil biodata siswa Nama Jenis kelamin Tanggal lahir Tempat lahir Agama Alamat
Footer
Gambar 4.22 Rancangan Form Profil sebagai siswa
81
Headder Menu
PDF
Footer
Gambar 4.23 Rancangan Form Wali Kelas
SMP HANGTUAH Tanjungpinang Jln. Tugu Pahlawan Telp. xxxxxx
LOGO
Data xxxx X
XX
XXX
XXX
XXX
XXX
XXX
XXX
XXX
XXX
XXX
Tanjungpinang Kepala Sekolah
XXXXXXX
Page X
Gambar 4.24 Rancangan Form Laporan