Gam
Mis
meng harus
Gam
diri konf
Gambar 4.70
hala
233
ambar 4.68 Tampilan Kursus Kemudian kita pilih kategori kursus yang
isalnya kategori geografi. Pilihlah mata pelajaran yang ada. Sis
engikuti mata pelajaran geografi maka link harus di pilih.
ambar 4.69 Tampilan Mata Kuliah Ajar Siswa akan melakukan konfirmasi untuk
diri sebagai anggota kursus dengan memilih Ya konfirmasi.
4.70 Konfirmasi Mengikuti Kursus
Setelah melakukan konfirmasi siswa aka halaman kursus geografi.
ang akan diambil.
iswa yang akan ink
geografi yang
untuk mendaftarkan h Ya pada halaman
akan masuk pada
Gam
6.
diliha
Gam
7.
prof ubah.
234
ambar 4.71 Tampilan Kuliah
Peserta
Peserta yang mengikuti kursus guru atau dilihat pada halaman peserta dengan memilih link pe
ambar 4.72 Tampilan Daftar Peserta Ubah
profile
Link ubah profile berfungsi untuk melakuka profil siswa. Gambar berikut merupakan profile
ubah. tau murid dapat
h link perserta
lakukan perubahan yang dapat anda
Gam
1. Ranc
Halam menu
tenga terbar
login a.
B b.
K Ik
c. U
235
ambar 4.73 Tampilan Form Edit Profile
ancangan Halaman Utama
laman utama terdiri dari tulisan logo Al-Ikwani nu login dibagian atas, informasi mata pela
ngah, informasi kata pembuka, calendar, online baru di bagian kanan. Menu kiri dalam keada
ogin , terdiri dari menu sebagai berikut:
Berita situs, menu untuk melihat berita-berita s Kategori kursus, nama-nama kelas yang a
Ikwaniyah. Upcoming Event
, kegiatanyang akan berlangsun aniyah online atas,
pelajaran di bagian ne users
dan berita adaan user belum
ita situs. ada di Mts Al-
gsung.
236
Gambar 4.74 Rancangan Halaman Utama
2. Rancangan Halaman Login
Rancangan halaman login terdiri dari formulir inputan berupa username
, password, dan pilihan login sebagai guru, siswa, admin, tamu.
237
Gambar 4.7 5 Rancangan Halaman Login
3. Rancangan Halaman User Setelah Login
a. User Guru
Setelah User guru melakukan login dan berhasil maka akan ditampilkan halaman utama dengan beberapa menu tambahan
kursus yang saya ikuti mata pelajaran yang diambil dibagian tengah, dan administrasi kursus.
238
Gambar 4.76 Rancangan Halaman User Guru Setelah Login b.
User Siswai Setelah user siswa melakukan login dan berhasil maka akan
ditampilkan halaman utama dengan beberapa menu tambahan kursus yang siswai ikuti mata pelajaran yang diambil
dibagian tengah.
239
Gambar 4.77 Rancang Halaman User SiswaI Setelah Login c.
User Admin Setelah user admin melakukan login dan berhasil maka akan
ditampilkan halaman utama dengan beberapa menu tambahan administrasi yang terdiri dari konfigurasi, pengguna, kursus,
catatan, file kursus, dan admin.
240
Gambar 4.78 Rancangan Halaman User Admin Setelah Login
241
Gambar 4.79 State Trantition Diagram Halaman Tampilan
242
4.5 Tahap Implementasi