276
Home Guru → Entri Nilai
Gambar 4.78 Rancangan Layar Entri Nilai Home Guru → Entri Nilai → Entri Nilai Detail
Gambar 4.79 Rancangan Layar Detail Entri Nilai
277
Home Guru → Ganti Password
Gambar 4.80 Rancangan Layar Ganti Password Guru
4.2.4
Perancangan Layar Admin
Rancangan layar Admin Login Admin
Gambar 4.81 Rancangan Layar Login Admin
278
Home Admin
Gambar 4.82 Rancangan Layar Entri Home Admin Home Admin → Manajemen Siswa
Gambar 4.83 Rancangan Layar Manajemen Siswa
279
Home Admin → Manajemen Siswa → Tambah Siswa
Gambar 4.84 Rancangan Layar Tambah Siswa Home Admin → Manajemen Siswa → Edit Siswa
Gambar 4.85 Rancangan Layar Edit Siswa
280
Home Admin → Manajemen Guru
Gambar 4.86 Rancangan Layar Edit Manajemen Guru Home Admin → Manajemen Guru → Tambah Guru
HEADER Halaman Utama Ganti Password Keluar Manajemen Siswa
Tambah Guru
Manajemen Guru Manajemen Kelas Manajemen Mata Pelajaran Manajemen Jadwal Manajemen Ujian Manajemen Berita Manajemen Pertanyaan Manajemen Silabus
Copyright ©Adrian ©Juan ©Deri
Gambar 4.87 Rancangan Layar Tambah Guru
281
Home Admin → Manajemen Guru → Edit Guru
Gambar 4.88 Rancangan Layar Edit Guru Home Admin → Manajemen Kelas
Gambar 4.89 Rancangan Layar Manajemen Kelas
282
Home Admin → Manajemen Kelas → Tambah Kelas
Gambar 4.90 Rancangan Layar Tambah Kelas Home Admin → Manajemen Mata Pelajaran
Gambar 4.91 Rancangan Layar Entri Manajemen Mata Pelajaran
283
Home Admin → Manajemen Mata Pelajaran → Tambah Mata Pelajaran
Gambar 4.92 Rancangan Layar Tambah Mata Pelajaran Home Admin → Manajemen Jadwal
Gambar 4.93 Rancangan Layar Manajemen Jadwal
284
Home Admin → Manajemen Jadwal → Manajemen Jadwal Teori
Gambar 4.94 Rancangan Layar Manajemen Jadwal Teori Home Admin → Manajemen Jadwal → Manajemen Jadwal Teori → Tambah Jadwal Teori
Gambar 4.95 Rancangan Layar Tambah Jadwal Teori
285
Home Admin → Manajemen Jadwal → Manajemen Jadwal Praktikum
Gambar 4.96 Rancangan Layar Manajemen Jadwal Praktikum Home Admin → Manajemen Jadwal → Manajemen Jadwal Praktikum → Tambah Jadwal Praktikum
Gambar 4.97 Rancangan Layar Tambah Jadwal Praktikum
286
Home Admin → Manajemen Ujian
Gambar 4.98 Rancangan Layar Manajemen Jadwal Ujian Home Admin → Manajemen Ujian → Manajemen Jadwal Ujian Teori
Gambar 4.99 Rancangan Layar Manajemen Jadwal Ujian Teori
287
Home Admin → Manajemen Ujian → Manajemen Jadwal Ujian Teori → Tambah Jadwal Ujian Teori
Gambar 4.100 Rancangan Layar Tambah Jadwal Ujian Teori Home Admin → Manajemen Ujian → Manajemen Jadwal Ujian Praktikum
Gambar 4.101 Rancangan Layar Manajemen Jadwal Ujian Praktikum
288
Home Admin → Manajemen Ujian → Manajemen Jadwal Ujian Praktikum → Tambah Jadwal Ujian Praktikum
Gambar 4.102 Rancangan Layar Tambah Jadwal Praktikum Home Admin → Manajemen Berita
HEADER Halaman Utama Ganti Password Keluar Manajemen Siswa
Daftar Berita
Manajemen Guru
Tambah Berita
Manajemen Kelas Manajemen Mata Pelajaran Manajemen Jadwal
xx
xxx
dd/Month/yyyy
Edit|Hapus
Manajemen Ujian
xx
xxx
dd/Month/yyyy
Edit|Hapus
Manajemen Berita Manajemen Pertanyaan Manajemen Silabus
Copyright ©Adrian ©Juan ©Deri
Gambar 4.103 Rancangan Layar Manajemen Berita
289
Home Admin → Manajemen Berita → Tambah Berita
Gambar 4.104 Rancangan Layar Tambah Berita Home Admin → Manajemen Pertanyaan
Gambar 4.105 Rancangan Layar Manajemen Pertanyaan
290
Home Admin → Manajemen Silabus
Gambar 4.106 Rancangan Layar Manajemen Silabus Home Admin → Manajemen Silabus→ Tambah Silabus
Gambar 4.107 Rancangan Layar Tambah Silabus
291
Home Admin → Ganti Password
Gambar 4.108 Rancangan Layar Ganti Password Admin
4.2.5
Perancangan Layar Kepala Sekolah
Rancangan layar Kepala Sekolah Login Kepala Sekolah
Gambar 4.109 Rancangan Layar Login kepala Sekolah
292
Home Kepala Sekolah
Gambar 4.110 Rancangan Layar Home Kepala Sekolah Home Kepala Sekolah → Laporan Siswa
Gambar 4.111 Rancangan Layar Laporan Siswa
293
Home Kepala Sekolah → Laporan Guru
Gambar 4.112 Rancangan Layar Laporan Guru Home Kepala Sekolah → Laporan Jadwal
Gambar 4.113 Rancangan Layar Laporan Jadwal
294
Home Kepala Sekolah → Laporan Ujian
Gambar 4.114 Rancangan Layar Laporan Jadwal Ujian Home Kepala Sekolah → Laporan Praktikum
Gambar 4.115 Rancangan Layar Laporan Praktikum
295
Home Kepala Sekolah → Laporan Ujian Praktek
Gambar 4.116 Rancangan Layar Laporan Ujian Praktek Home Kepala Sekolah → Laporan Nilai
Gambar 4.117 Rancangan Layar Laporan Nilai
296
Home Kepala Sekolah → Laporan Nilai → Laporan Nilai Kelas
Gambar 4.118 Rancangan Layar Laporan Nilai Per Kelas Home Kepala Sekolah → Laporan Nilai → Laporan Nilai Kelas → Laporan Nilai Mata Pelajaran yang di pilih
Gambar 4.119 Rancangan Layar Detail Laporan Nilai
297
Home Kepala Sekolah → Laporan Berita
Gambar 4.120 Rancangan Layar Laporan Berita Home Kepala Sekolah → Ganti Password
Gambar 4.121 Rancangan Layar Ganti Password
298
4.3
Implementasi
4.3.1
Hasil Jalannya Program
Hasil Jalannya Program dari sisi Siswa : 1. Halaman Login Siswa
Gambar 4.122 Hasil Jalannya Program Login Siswa
Tampilan di atas adalah gambar layar pertama yang akan terlihat pada saat siswa membuka dan mengakses website ini. Logo sekolah, nama sekolah serta visi dan misi sekolah akan telihat pada bagian banner. Di bagian tengah akan terdapat textbox untuk memasukkan kode pengguna serta textbox lainnya yang digunakan untuk memasukkan password dari user tersebut. Selain itu akan terdapat tombol submit yang digunakan untuk melakukan pengecekan password sehingga kode pengguna dan password pengguna akan sama dengan yang ada di dalam database user tersebut. Dan apabila kode pengguna dan password pengguna
299
cocok maka user dapat masuk ke halaman berikutnya. Di bagian footer akan terdapat hak cipta e-learning berbasis web pada SMAK IPEKA TOMANG II.
2. Halaman Home Siswa
Gambar 4.123 Hasil Jalannya Program Home Siswa
Ketika inputan password dan juga kode pengguna cocok dan statusnya adalah siswa, maka akan dilanjutkan ke halaman HOME siswa. Di halaman ini terdapat pilihan menu di sebelah kiri seperti pilihan menu: Kelasku, Data Pribadi, Jadwal, Ujian, Nilai, Pertanyaan, Berita, dan News Feed. Di bagian atas di bawah banner terdapat pilihan menu: Halaman Utama, Ganti Password, dan Keluar. Dan di bagian tengah atau bagian content terdapat bagian Pesan Pribadi yang akan di gunakan untuk memberikan pesan pribadi dari admin kepada siswa yang bersangkutan. Dan juga terdapat bagian Berita Terkini yang akan digunakan untuk memberikan berita atau pengumuman penting yang diberikan dari sekolah kepada siswa.
300
3. Halaman Ganti Password
Gambar 4.124 Hasil Jalannya Program Ganti Password Siswa
Pada tampilan Halaman ini, siswa dapat merubah password lama dengan password baru sesuai dengan yang diinginkannya, dengan cara mengisi text box password lama, dan password baru, serta ulangi password baru, kemudian pilih tombol “ubah”. Dihalaman ini juga terdapat pilihan menu di samping kiri dari layar seperti pilihan menu: Kelasku, Data Pribadi, Jadwal, Ujian, Nilai, Pertanyaan, Berita, dan News Feed. Di bagian atas di bawah banner terdapat pilihan menu: Halaman Utama, Ganti Password, dan Keluar.