Perancangan Layar 1. Perancangan struktur menu

4.3.5 Perancangan Layar 1. Perancangan struktur menu

Lihat Abse nsi Home Lihat Nilai Login Siswa Ganti Password Uta ma MENU UTAM A Walisiswa Keluar Lihat Abse nsi Lihat Nilai Ganti Password Keluar Absensi Rekap Data Siswa Data Siswa per Kelas Data Karyawan Grafik Instruktur Kepala Sekolah Data Kelas Ganti Password Keluar Utama Nilai Tambah Na ma Karyawa n Ta mba h Ganti Password Keluar Ubah Hapus Ubah Administrasi Data Karyawan Data Siswa Data Kelas Data Materi Na ma Siswa Tambah Na ma Kelas Tambah Hapus Ubah Hapus Ubah Hapus Ganti Password Keluar Gambar 4.36 Struktur Menu pada Sistem Nama kelas Lihat Nilai Lihat absen 2. Perancangan Layar Tampilan Header Home Login Siswa Wali Siswa Insruktur Kepala Sekolah Administrasi Footer Gambar 4.37 Menu Utama dan Home Header Home Login Siswa Wali Siswa Insruktur Kepala Sekolah Administrasi Footer Gambar 4.38 Login Siswa Header I Header II Header III Informasi Lihat Absensi Lihat Nilai Header IV Pengaturan Ganti Password Keluar Footer Gambar 4.39 Halaman Untuk Siswa Header I Header II Halaman Utama Lihat Nilai Header III Pengaturan Ganti Password Keluar Footer Gambar 4.40 Lihat Absensi Header I Header II Halaman Utama Absensi Header III Pengaturan Ganti Password Keluar Footer Gambar 4.41 Lihat Nilai Header I Header II Header III Header IV Password Lama Input Type Password Baru Input Type Password Baru Ulangi Input Type Ganti Batal Footer Gambar 4.42 Ganti Password Header Home Login Wali Siswa Insruktur Kepala Sekolah Administra Header III Login Wali Siswa Nama Siswa Option Type Password Input Type Login Header II Footer Gambar 4.43 Login Wali Siswa Header I Header II Header III Informasi Lihat Absensi Lihat Nilai Header IV Pengaturan Ganti Password Keluar Footer Gambar 4.44 Halaman Untuk Wali Siswa Header I Header II Halaman Utama Lihat Nilai Header III Pengaturan Ganti Password Keluar Footer Gambar 4.45 Lihat Absensi Header I Header II Halaman Utama Absensi Header III Pengaturan Ganti Password Keluar Footer Gambar 4.46 Lihat Nilai Header I Header II Header III Header IV Password Lama Input Type Password Baru Input Type Password Baru Ulangi Input Type Ganti Batal Footer Gambar 4.47 Ganti Password Header IV Nama Kelas 1. 2. 3. N. Header Home Login Siswa Wali Siswa Insruktur Kepala Sekolah Administras Header III Login Instruktur Nama Siswa Option Type Password Input Type Login Header II Footer Gambar 4.48 Login Instruktur Header I Header II DATA KELAS 1. 2. 3. N. Pengaturan Header III Ganti Password Keluar Footer Gambar 4.49 Halaman Untuk Instruktur Header I Header II DATA KELAS Header III Absensi Nilai Header IV Data Kelas N Pengaturan Ganti Password Keluar Back Periksa Absensi Periksa Nilai Footer Gambar 4.50 Data Kelas Header I Header II DATA KELAS Header III Daftar Kelas Nilai Pengaturan Header IV Kehadiran Per-Session 1-N Kelas N Ganti Password Keluar Footer Gambar 4.51 Absensi Header I Header II DATA KELAS Header III Absensi Nilai Pengaturan Ganti Password Header IV Input Data Absensi Kelas N Nama Siswa Data Absensi 1. Option Masuk Tidak Masuk 2. 3. N. Keluar KIRIM Footer Gambar 4.52 Input Data Absensi Header I Header II DATA KELAS Header III Daftar Kelas Absensi Pengaturan Ganti Password Header IV Daftar Nilai Kelas N Untuk Materi X Link Nilai Per-Harian, Tugas, Tengah SMS, dan Akhir SMS Keluar Footer Gambar 4.53 Nilai Header I Header II DATA KELAS Header III Absensi Nilai Pengaturan Ganti Password Header IV Input Data Nilai Siswa Kelas N Nama Siswa Data Nilai 1. Option Nilai 2. 3. N. Keluar KIRIM Footer Gambar 4.54 Input Data Nilai Header I Header II Header III Header IV Password Lama Input Type Password Baru Input Type Password Baru Ulangi Input Type Ganti Batal Footer Gambar 4.55 Ganti Password Header Home Login Siswa Wali Siswa Insruktur Kepala Sekolah Administras Header III Login Kepala Sekolah User Id Input Type Password Input Type Login Header II Footer Gambar 4.56 Login Kepala Sekolah Header I MENU KEPALA SEKOLAH Header II Utama Rekapitulasi Data Siswa Data Siswa Per Kelas Header III Data Karyawan Grafik Ganti Password Keluar Footer Gambar 4.57 Halaman Kepala Sekolah Header I MENU KEPALA SEKOLAH Utama Rekapitulasi Data Siswa Data Siswa Per Kelas Nama Alamat Dll Header II Tabel Detail Data Siswa Input Type Int Type Data Karyawan Grafik Ganti Password Tabel Data Siswa Keluar Nama Kelas Alamat Footer Gambar 4.58 Halaman Rekapitulasi Data Siswa Header I MENU KEPALA SEKOLAH Utama Rekapitulasi Data Siswa Data Siswa Per Kelas Nama Kelas Data Kelas Jenis Jumlah Siswa Data Karyawan Grafik Ganti Password Keluar Footer Gambar 4.59 Halaman Data Kelas Header I MENU KEPALA SEKOLAH Utama Data Kelas ... Rekapitulasi Data Siswa No Nama Jenis Kelamin Alamat Data Siswa Per Kelas Data Karyawan Grafik Ganti Password Keluar Footer Gambar 4.60 Halaman Data Siswa Per Kelas Header I Header II Tabel Detail Data Karyawan Nama Input Type Alamat Int Type Dll MENU KEPALA SEKOLAH Utama Rekapitulasi Data Siswa Data Siswa Per Kelas Data Karyawan Grafik Ganti Password Keluar Tabel Data Karyawan Kelas Alamat Nama Footer Gambar 4.61 Halaman Data Karyawan Header I MENU KEPALA SEKOLAH Utama Rekapitulasi Data Siswa Grafik Keadaan Siswa Data Siswa Per Kelas Data Karyawan Grafik Ganti Password Keluar Footer Gambar 4.62 Halaman Grafik Header I MENU KEPALA SEKOLAH Header II Utama Rekapitulasi Data Siswa Data Siswa Per Kelas Password Lama Password Baru Ganti Password Input Type Input Type Data Karyawan Password Baru Konf. Input Type Grafik GANTI PASSWORD Ganti Password Keluar Footer Gambar 4.63 Halaman Ganti Password Header Home Login Siswa Wali Siswa Insruktur Kepala Sekolah Administrasi Header III Login Administrator User Id Option Type Password Input Type Login Header II Footer Gambar 4.64 Login Administrator Header I TAMBAH DATA Header II Utama Data Karyawan Data Siswa Header III Data Kelas Data Materi Ganti Password Keluar Footer Gambar 4.65 Halaman Administrator Header I TAMBAH DATA Utama Data Karyawan Data Siswa Nama Alamat Dll Header II Tabel Tambah Data Karyawan Input Type Int Type Data Kelas TAMBAH Data Materi Ganti Password Tabel Data Karyawan Keluar Nama Karyawan Jabatan Alamat Footer Gambar 4.66 Halaman Tambah Data Karyawan Header I TAMBAH DATA Utama Data Karyawan Nama Alamat Header II Tabel Update Data Karyawan Input Type Input Type Data Siswa Data Kelas Dll Input Type UBAH HAPUS Data Materi Ganti Password Tabel Data Karyawan Keluar Nama Karyawan Jabatan Alamat Footer Gambar 4.67 Update Data Karyawan Klik Link Nama Karyawan Header I TAMBAH DATA Utama Data Karyawan Nama Alamat Header II Tabel Tambah Data Siswa Input Type Input Type ta Siswa Data Kelas Dll Input Type TAMBAH Data Materi Ganti Password Tabel Data Siswa Kelua Nama Siswa Kelas Alamat Footer Gambar 4.68 Halaman Tambah Data Siswa Header I TAMBAH DATA Utama Data Karyawan Nama Alamat Header II Tabel Update Data Siswa Input Type Input Type Data Siswa Data Kelas Dll Input Type UBAH HAPUS Data Materi Ganti Password Tabel Data Siswa Keluar Nama Siswa Kelas Alamat Footer Gambar 4.69 Update Data Siswa Klik Link Nama Siswa Header I TAMBAH DATA Utama Data Karyawan Nama Kelas Jenis Kelas Header II Tabel Tambah Data Kelas Input Type Input Type Data Siswa Data Kelas TAMBAH Data Materi Ganti Password Tabel Data Kelas Keluar Nama Kelas Jenis Status Footer Gambar 4.70 Halaman Tambah Data Kelas Header I TAMBAH DATA Utama Data Karyawan Data Siswa Nama Kelas Jenis Kelas Header II Tabel Update Data Kelas Input Type Input Type Data Kelas UBAH HAPUS Data Materi Ganti Password Tabel Data Kelas Keluar Nama Kelas Jenis Status Footer Gambar 4.71 Update Data Kelas Klik Link Nama Kelas Header I TAMBAH DATA Utama Data Karyawan Nama Materi Instruktur Header II b mha ti Input Type Input Type Data Siswa Data Kelas Dll TAMBAH Input Type Data Materi Ganti Password Tabel Data Kelas Per-Materi Keluar Kelas Aktif Jam Masuk Instruktur Materi Footer Gambar 4.72 Halaman Tambah Data Materi Header I TAMBAH DATA Utama Data Karyawan Nama Materi Instruktur Header II Tabel Tambah Data Materi Input Type Input Type Data Siswa Data Kelas Dll UBAH HAPUS Input Type Lihat Nilai Lihat Absensi Data Materi Ganti Password Tabel Data Kelas Per-Materi Keluar Kelas Aktif Jam Masuk Instruktur Materi Footer Gambar 4.73 Update Data Materi Klik Link Kelas Aktif Header I TAMBAH DATA Header II Utama Data Karyawan Data Siswa Password Lama Password Baru Ganti Password Input Type Input Type Data Kelas Password Baru Konf. Input Type Data Materi GANTI PASSWORD Ganti Password Keluar Footer Gambar 4.74 Ganti Password Administrator Header Home Login Siswa Wali Siswa Insruktur Kepala Sekolah Administrasi Gambar 4.75 Keluar Menu Home

4.4 Pemrograman Coding