Perancangan antar muka Mengolah Struktur Menu Siswa

104 Perancangan Antarmuka Halaman Login Petugas A01 logo Welcome Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak Home | Berita | Guru | Siswa | Contact | Data Master | Data User | Profile | Logout Selamat datang di e-learning A01 Tampilan Utama Login Admin A01 - Jika pilih menu home akan tampil A01 - Jika pilih menu berita akan tampil A02 - Jika pilih menu guru akan tampil A03 - Jika pilih menu siswa akan tampil A04 - Jika pilih menu contact akan tampil A05 -Jika pilih data master tahun ajaran tampil A06 - Jika pilih data master kelas tampil A07 -Jika pilih data master mapel tampil A08 -Jika pilih data master jadwal guru mengajar tampil A09 -Jika pilih Data User tampil A10 -Jika pilih menu edit profile tampil A11 -Jika pilih menu ganti password tampil A12 - Jika pilih logout tampil T01 -Jika login berhasil tampil pesan M01 Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact Data Master Data User Profile Logout Keterangan : Nama Form : A01 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.31 Halaman Utama Petugas Perancangan Antarmuka Halaman Berita A02 Berita Home A02 Tambah Berita Batal Isi Berita Kateogri Berita Isi Berita Filter Status Category Post Category Date Written by Status eerer 2012-06-03 FERI PIKTORIA Live View Edit Delete Hapus Publish Tampilan data berita A02 - Jika pilih Home tampil A01. -Jika pilih menu Tambah Berita tampil A02-1 -Jika pilih menu edit tampil A02-2 -Jika pilih menu Delete A02 -Jika pilih menu Publish tampil A02 -Jika tambah berita berhasil tampil pesan M03 - Jika edit berita berhasil tampil pesan M04 -jika berita didelet tampil pesan M05 Keterangan : Nama Form : A02 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.32 Halaman Berita 105 Perancangan Antarmuka Halaman Tambah Berita A02-1 Berita Home A02-1 Tambah Berita Isi Berita Kateogri Berita Tambah Berita Title Url Simpan Simpan Keluar Tampilan Menu Tambah Berita A02-1 - Jika pilih Home tampil A01. -Jika pilih menu edit tampil A02-2 -Jika pilih menu Delete A02 -Jika pilih menu Publish tampil A02 -Jika tambah berita berhasil tampil pesan M03 Keterangan : Nama Form : A02-1 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Status Introduction Content Gambar 3.33 Halaman Tambah Berita Perancangan Antarmuka Halaman Edit Berita A02-2 Berita Home A02-2 Tambah Berita Isi Berita Kateogri Berita Edit Berita Title Url Simpan Simpan Keluar Tampilan Menu Edit Berita A02-2 - Jika pilih Home tampil A01. -Jika pilih menu Tambah Berita tampil A02-1 -Jika pilih menu edit tampil A02-2 -Jika pilih menu Delete A02 -Jika pilih menu Publish tampil A02 - Jika edit berita berhasil tampil pesan M04 Keterangan : Nama Form : A02-2 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Status Introduction Content Gambar 3.34 Halaman Edit Berita 106 Perancangan Antarmuka Halaman Data Guru A03 NOMOR INDUK NAMA LENGKAP 10000001 Henky Irawan, S.S. 10000002 Drs. Hardi Sujiono 10000003 Dra. Hj. Dadah Nurhamidah, M.Pd.I 10000004 Drs. Iim Abdurohim 10000005 Uwang Suwandi, S.Pd. 10000006 Dakim Yudha I 10000007 Drs. Cecep Rahmat 10000008 Jajang, S.Pd. 10000009 Drs. Dedi Gunawan 10000010 Masrudin 10000011 Yoyo Wiryonudin 10000012 Neni Irnaningsih, AMPd. 10000013 Engkus Kusnama logo List Guru Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak A 03 1 2 3 4 Cari Keterangan : Nama Form : A03 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Import Form Excel File Browse Upload Home | Berita | Guru | Siswa | Contact | Data Master | Data User | Profile | Logout Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact Data Master Data User Profile Logout Tampilan Menu Data Guru A03 - Jika pilih menu home akan tampil A01 - Jika pilih menu berita akan tampil A02 - Jika pilih menu Home akan tampil A01 - Jika pilih menu siswa akan tampil A04 - Jika pilih menu contact akan tampil A05 -Jika pilih data master tahun ajaran tampil A06 - Jika pilih data master kelas tampil A07 -Jika pilih data master mapel tampil A08 -Jika pilih data master jadwal guru mengajar tampil A09 -Jika pilih Data User tampil A10 -Jika pilih menu edit profile tampil A11 -Jika pilih menu ganti password tampil A12 - Jika pilih logout tampil T01 Gambar 3.35 Halaman Data Guru Perancangan Antarmuka Halaman Data Siswa A04 logo List Siswa Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak A 04 1 2 3 4 Cari Keterangan : Nama Form : A04 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Import Form Excel File Browse Upload Home | Berita | Guru | Siswa | Contact | Data Master | Data User | Profile | Logout NOMOR INDUK NAMA LENGKAP 08091293 YATI SUMIATI 08091294 YENI INDRIA 08091295 YENI NURHAYATI 08091296 YULIYANTI 08091297 AAN DAHLIA 08091298 ABDUL AZIS 08091299 ABDUL KARIM 08091300 ACHMAD NOOR. A 08091301 ADAM RAFLI MAULANA 08091302 ADNAN MIPTAHUDIN 08091303 AEF SAEFUL 08091304 AGUNG RIDWANSYAH Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact Data Master Data User Profile Logout Tampilan Menu Data Siswa A04 - Jika pilih menu home akan tampil A01 - Jika pilih menu berita akan tampil A02 - Jika pilih menu Home akan tampil A01 - Jika pilih menu guru akan tampil A03 - Jika pilih menu contact akan tampil A05 -Jika pilih data master tahun ajaran tampil A06 - Jika pilih data master kelas tampil A07 -Jika pilih data master mapel tampil A08 -Jika pilih data master jadwal guru mengajar tampil A09 -Jika pilih Data User tampil A10 -Jika pilih menu edit profile tampil A11 -Jika pilih menu ganti password tampil A12 - Jika pilih logout tampil T01 Gambar 3.36 Halaman Data Siswa 107 Perancangan Antarmuka Halaman Contak A05 To contact us please fill out the form below. Name: Email: Subject: Message: Attach a zip file: Send Browse Contact logo Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak A 05 Keterangan : Nama Form : A05 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Home | Berita | Guru | Siswa | Contact | Data Master | Data User | Profile | Logout Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact Data Master Data User Profile Logout Tampilan Menu Data Contak A05 - Jika pilih menu home akan tampil A01 - Jika pilih menu berita akan tampil A02 - Jika pilih menu Home akan tampil A01 - Jika pilih menu guru akan tampil A03 - Jika pilih menu siswa akan tampil A04 -Jika pilih data master tahun ajaran tampil A06 - Jika pilih data master kelas tampil A07 -Jika pilih data master mapel tampil A08 -Jika pilih data master jadwal guru mengajar tampil A09 -Jika pilih Data User tampil A10 -Jika pilih menu edit profile tampil A11 -Jika pilih menu ganti password tampil A12 - Jika pilih logout tampil T01 Gambar 3.37 Halaman Data Contak Perancangan Antarmuka Halaman Data Master Tahun Ajaran A06 Tahun Ajaran Home A06 Hapus Tahun Ajaran Kurikulum 20112012 Rekayasa Perangkat Lunak Edit Delete 20122013 Rekayasa Perangkat Lunak Edit Delete Tampilan Data Master Tahun Ajaran A06 - Jika pilih Home tampil A01 -Jika pilih Tambah Tahun Ajaran tampil A06-1 -Jika pilih menu edit tampil A06-2 -Jika pilih menu Hapus tampil A06 -Jika tambah tahun ajaran berhasil tampil pesan M03 - Jika edit tahun ajaran berhasil tampil pesan M04 -jika tahun ajaran didelet tampil pesan M05 Tambah Tahun Ajaran Items Keterangan : Nama Form : A06 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.38 Halaman Data Tahun Ajaran 108 Perancangan Antarmuka Halaman Data Master Tambah Tahun Ajaran A06-1 Tahun Ajaran Home A06-1 Tampilan Edit Tahun Ajaran A06-2 - Jika pilih Home tampil A06 -Jika pilih Tambah Tahun Ajaran tampil A06-2 -Jika pilih Simpan maka data akan tersimpan dan tampil A06 -Jika pilih menu Batal A06 -Jika tambah tahun ajaran berhasil tampil pesan M03 Tambah Tahun Ajaran Items Tambah Tahun Ajaran Kurikulum Simpan Batal Keterangan : Nama Form : A06-1 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.39 Halaman Tambah Data Tahun Ajaran Perancangan Antarmuka Halaman Data Master Edit Tahun Ajaran A06-2 Tahun Ajaran Home A06-2 Tampilan Edit Tahun Ajaran A06-2 - Jika pilih Home tampil A01 -Jika pilih Tambah Tahun Ajaran tampil A06-1 -Jika pilih Simpan maka data akan tersimpan dan tampil A06 -Jika pilih menu Batal A06 -Jika edit tahun ajaran berhasil tampil pesan M04 Tambah Tahun Ajaran Items Edit Tahun Ajaran Kurikulum Simpan Batal Keterangan : Nama Form : A06-2 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.40 Halaman Edit Data Tahun Ajaran 109 Perancangan Antarmuka Halaman Data Master Kelas A07 Kelas Home A07 Tambah Kelas Kelas Nama kelas X RPL 1 Edit Delete X RPL 2 Edit Delete Tampilan Data Master Kelas A07 - Jika pilih Home tampil A01 -Jika pilih Tambah Kelas tampil A07-1 -Jika pilih menu edit tampil A07-2 -Jika pilih menu Hapus tampil A07 -Jika tambah kelas berhasil tampil pesan M03 - Jika edit kelas berhasil tampil pesan M04 -jika delet kelas berhasil tampil pesan M05 Keterangan : Nama Form : A07 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.41 Halaman Data Master Kelas Perancangan Antarmuka Halaman Tambah Data Master Kelas A07-1 Kelas Home A07-1 Tampilan Tambah Kelas A07-1 - Jika pilih Home tampil A01 -Jika pilih Tambah Kelas tampil A07-1 -Jika pilih Simpan maka data akan tersimpan dan tampil A07 -Jika pilih menu Batal A07 -Jika tambah kelas berhasil tampil pesan M03 Tambah Kelas Tambah Kelas Nama Kelas Tahun Ajaran Simpan -- Select -- Batal Keterangan : Nama Form : A07-1 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.42 Halaman Tambah Data Master Kelas 110 Perancangan Antarmuka Halaman Edit Data Master kelas A07-2 Kelas Home A07-2 Tampilan Edit Kelas A07-2 - Jika pilih Home tampil A01 -Jika pilih Tambah Kelas tampil A07-1 -Jika pilih Simpan maka data akan tersimpan dan tampil A07 -Jika pilih menu Batal A07 - Jika edit kelas berhasil tampil pesan M04 Tambah Kelas Editing Kelas “Nama Kelas” Nama Kelas Tahun Ajaran Simpan -- Select -- Batal Keterangan : Nama Form : A07-2 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.43 Halaman Edit Data Master Kelas Perancangan Antarmuka Halaman Data Master Matapelajaran A08 Mapel Home A08 Tambah Mata Pelajaran Matapelajaran Nama Mata Pelajaran KELAS Al Quran Hadits X RPL 1 Edit Delete Aqidah Ahlak X RPL 1 Edit Delete Bahasa dan Sastra Indonesia X RPL 1 Edit Delete Bahasa Inggris X RPL 1 Edit Delete Tampilan data master mapel A08 - Jika pilih Home tampil A01 -Jika pilih Tambah Mata Pelajaran tampil A08-1 -Jika pilih menu edit tampil A08-2 -Jika pilih menu Hapus tampil A08 -Jika tambah matapelajaran berhasil tampil pesan M03 - Jika edit matapelajaran berhasil tampil pesan M04 -jika delet matapelajaran berhasil tampil pesan M05 Keterangan : Nama Form : A08 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.44 Halaman Data Master Matapelajaran 111 Perancangan Antarmuka Halaman Tambah Data Master Matapelajaran A08-1 Mapel Home A08-1 Tambah Mata Pelajaran Tampilan tambah data master mapel A08-1 - Jika pilih Home tampil A01 -Jika pilih Tambah Mata Pelajaran tampil A08-1 -Jika pilih menu Simpan tampil A08 -Jika pilih menu Batal tampil A08 -Jika tambah matapelajaran berhasil tampil pesan M03 Tambah Mata Pelajaran Kode Mata Pelajaran Nama Mata Pelajaran Kelas Tahun Ajaran Simpan Batal -- Select -- -- Select -- Keterangan : Nama Form : A08-1 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.45 Halaman Tambah Data Master Matapelajaran Perancangan Antarmuka Halaman Edit Data Master Matapelajaran A08-2 Mapel Home A08-2 Tambah Mata Pelajaran Tampilan tambah data master mapel A08-2 - Jika pilih Home tampil A01 -Jika pilih Tambah Mata Pelajaran tampil A08-1 -Jika pilih menu Simpan tampil A08 -Jika pilih menu Batal tampil A08 - Jika edit matapelajaran berhasil tampil pesan M04 Editing Mata Pelajaran “Nama Mata Pelajaran” Kode Mata Pelajaran Nama Mata Pelajaran Kelas Tahun Ajaran Simpan Batal -- Select -- -- Select -- Keterangan : Nama Form : A08-2 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.46 Halaman Edit Data Matapelajaran 112 Perancangan Antarmuka Halaman Data Mengajar Guru A09 Jadwal Mengajar Home A09 Tambah Jadwal Jadwal Guru Mengajar Nama Guru Mapel kelas hari jmlh jam jam Agus rahmat Bahasa Inggris X RPL 1 senin 2 8 Edit Delete Tampilan data master Jadwal A09 - Jika pilih Home tampil A01 -Jika pilih Tambah Jadwal tampil A09-1 -Jika pilih menu edit tampil A09-2 -Jika pilih menu Hapus tampil A09 -Jika tambah jadwal mengajar berhasil tampil pesan M03 - Jika edit jadwal mengajar berhasil tampil pesan M04 -jika delet jadwal mengajar berhasil tampil pesan M05 Keterangan : Nama Form : A09 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.47 Halaman Data Mengajar Perancangan Antarmuka Halaman Tambah Data Mengajar A09-1 Jadwal Mengajar Home A09-1 Tambah Jadwal Tampilan tambah data master Jadwal A09-1 - Jika pilih Home tampil A01 -Jika pilih Tambah Jadwal tampil A09-1 -Jika pilih menu Simpan tampil A09 -Jika pilih menu Batal tampil A09 -Jika tambah jadwal mengajar berhasil tampil pesan M03 Tambah Jadwal Guru Mata Pelajaran Kelas Hari Jam Jumlah Jam Simpan Batal -- Select -- -- Select -- -- Select -- -- Select -- Keterangan : Nama Form : A09-1 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.48 Halaman Tambah Data Mengajar 113 Perancangan Antarmuka Halaman Edit Data Mengajar A09-2 Jadwal Mengajar Home A09-2 Tambah Jadwal Tampilan Edit data master Jadwal A09-2 - Jika pilih Home tampil A01 -Jika pilih Tambah Jadwal tampil A09-1 -Jika pilih menu Simpan tampil A09 -Jika pilih menu Batal tampil A09 - Jika edit jadwal mengajar berhasil tampil pesan M04 Editing Jadwal “Id Jadwal” Guru Mata Pelajaran Kelas Hari Jam Jumlah Jam Simpan Batal -- Select -- -- Select -- -- Select -- -- Select -- Keterangan : Nama Form : A09-2 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.49 Halaman Edit Data Mengajar Perancangan Antarmuka Halaman Data User A10 Users Home A10 Add users Batal Users Filter Status Group Hapus Aktivasi Nama E-mail Group Active Joined Terakhir Berkunjung FERI PIKTORIA feriferi.com Administrators Yes 2012-02-14 2012-06-20 Edit Delete Ade adesmkdm.com Guru Yes 2012-02-15 2012-06-21 Edit Delete Dida didasmkdmi.com siswa Yes 2012-02-15 2012-06-22 Edit Delete 1 2 3 4 5 → Imfort porm XLS Tampilan data master user A10 - Jika pilih Home tampil A01 -Jika pilih Tambah user tampil A10-1 -Jika pilih menu Simpan tampil A010 -Jika pilih menu Batal tampil A10 -Jika tambah user berhasil tampil pesan M03 - Jika edit user berhasil tampil pesan M04 -jika delet user berhasil tampil pesan M05 Keterangan : Nama Form : A10 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.50 Halaman Data User 114 Perancangan Antarmuka Halaman Edit Profile A11 logo Edit Your Profile Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak Home | Berita | Guru | Siswa | Contact | Data Master | Data User | Profile | Logout Nama lengkap Password Tanggal lahir Jenis kelamin Email Phone Alamat Kelas No Induk Kode pos Upload Photo Photo A11 Browse Save Profile Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact Data Master Data User Profile Logout Tampilan Menu Edit Profile A11 - Jika pilih menu home akan tampil A01 - Jika pilih menu berita akan tampil A02 - Jika pilih menu Home akan tampil A01 - Jika pilih menu siswa akan tampil A04 - Jika pilih menu contact akan tampil A05 -Jika pilih data master tahun ajaran tampil A06 - Jika pilih data master kelas tampil A07 -Jika pilih data master mapel tampil A08 -Jika pilih data master jadwal guru mengajar tampil A09 -Jika pilih Data User tampil A10 -Jika pilih menu guru tampil A03 -Jika pilih menu ganti password tampil A12 - Jika pilih logout tampil T01 -Jika edit profile berhasil tampil pesan M06 Keterangan : Nama Form : A11 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.51 Halaman Edit Profile Perancangan Antarmuka Halaman Ganti Password A12 logo Ganti Password Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak Home | Berita | Guru | Siswa | Contact | Data Master | Data User | Profile | Logout Password Confirmasi Password A12 Submit Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact Data Master Data User Profile Logout Keterangan : Nama Form : A12 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Tampilan Menu Ganti Password A12 - Jika pilih menu home akan tampil A01 - Jika pilih menu berita akan tampil A02 - Jika pilih menu Home akan tampil A01 - Jika pilih menu siswa akan tampil A04 - Jika pilih menu contact akan tampil A05 -Jika pilih data master tahun ajaran tampil A06 - Jika pilih data master kelas tampil A07 -Jika pilih data master mapel tampil A08 -Jika pilih data master jadwal guru mengajar tampil A09 -Jika pilih Data User tampil A10 -Jika pilih menu guru tampil A03 -Jika pilih menu edit profile tampil A11 - Jika pilih logout tampil T01 - Jika password berhasil di edit tampil pesan M04 Gambar 3.52 Halaman Ganti Password 115 Perancangan Antarmuka Halaman Utama Login Guru G01 logo Welcome Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak Home | Berita | Guru | Siswa | Contact | Data Pembelajaran | Profile | Logout Selamat datang di e-learning G01 Tampilan Utama Login Guru G01 - Jika pilih menu home akan tampil G01 - Jika pilih menu berita akan tampil A02 - Jika pilih menu guru akan tampil G02 - Jika pilih menu siswa akan tampil G03 - Jika pilih menu contact akan tampil G04 -Jika pilih data pembelajaran materi G05 - Jika pilih data pembelajaran tugas tampil G06 -jika pilih data pembelajaran ujian tampil G07 -Jika pilih data pembelajaran nilai tampil G08 -jika pilih edit profile tampil A11 -Jika pilih ganti password tampil G12 - Jika pilih logout tampil T01 -Jika login berhasil tampil pesan M01 Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact DataPembelajaran Profile Logout Keterangan : Nama Form : G01 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Foto Profile sekolah Gambar 3.53 Halaman Utama Guru Perancangan Antarmuka Halaman Data Guru G02 logo Data Guru Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak Home | Berita | Guru | Siswa | Contact | Data Pembelajaran | Profile | Logout G02 Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact DataPembelajaran Profile Logout Keterangan : Nama Form : G02 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Tampilan menu data guru G02 - Jika pilih menu home akan tampil G01 - Jika pilih menu berita akan tampil A02 - Jika pilih menu home akan tampil G01 - Jika pilih menu siswa akan tampil G03 - Jika pilih menu contact akan tampil G04 -Jika pilih data pembelajaran materi G05 - Jika pilih data pembelajaran tugas tampil G06 -jika pilih data pembelajaran ujian tampil G07 -Jika pilih data pembelajaran nilai tampil G8 -jika pilih edit profile tampil A11 -Jika pilih ganti password tampil A12 - Jika pilih logout tampil T01 NOMOR INDUK NAMA LENGKAP 10000001 Henky Irawan, S.S. 10000002 Drs. Hardi Sujiono 10000003 Dra. Hj. Dadah Nurhamidah, M.Pd.I 10000004 Drs. Iim Abdurohim 10000005 Uwang Suwandi, S.Pd. 10000006 Dakim Yudha I 10000007 Drs. Cecep Rahmat 10000008 Jajang, S.Pd. 10000009 Drs. Dedi Gunawan 10000010 Masrudin 10000011 Yoyo Wiryonudin 10000012 Neni Irnaningsih, AMPd. 10000013 Engkus Kusnama 1 2 3 4 Cari Gambar 3.54 Halaman Data Guru 116 Perancangan Antarmuka Halaman Data Siswa G03 logo Data Siswa Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak Home | Berita | Guru | Siswa | Contact | Data Pembelajaran | Profile | Logout G03 Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact DataPembelajaran Profile Logout Keterangan : Nama Form : G03 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Tampilan Menu Data Siswa G03 - Jika pilih menu home akan tampil G01 - Jika pilih menu berita akan tampil A02 - Jika pilih menu guru akan tampil G02 - Jika pilih menu home akan tampil G01 - Jika pilih menu contact akan tampil G04 -Jika pilih data pembelajaran materi G05 - Jika pilih data pembelajaran tugas tampil G06 -jika pilih data pembelajaran ujian tampil G07 -jika pilih pembelajaran nilai tampil G8 -jika pilih edit profile tampil A11 -Jika pilih ganti password tampil A12 - Jika pilih logout tampil T01 1 2 3 4 NOMOR INDUK NAMA LENGKAP 08091293 YATI SUMIATI 08091294 YENI INDRIA 08091295 YENI NURHAYATI 08091296 YULIYANTI 08091297 AAN DAHLIA 08091298 ABDUL AZIS 08091299 ABDUL KARIM 08091300 ACHMAD NOOR. A 08091301 ADAM RAFLI MAULANA 08091302 ADNAN MIPTAHUDIN 08091303 AEF SAEFUL 08091304 AGUNG RIDWANSYAH Cari Gambar 3.55 Halaman Data Siswa Perancangan Antarmuka Halaman Data Contak G04 logo Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak Home | Berita | Guru | Siswa | Contact | Data Pembelajaran | Profile | Logout G04 Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact DataPembelajaran Profile Logout Keterangan : Nama Form : G04 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Tampilan Menu Data Contak G04 - Jika pilih menu home akan tampil G01 - Jika pilih menu berita akan tampil A02 - Jika pilih menu guru akan tampil G02 - Jika pilih menu home akan tampil G01 - Jika pilih menu siswa akan tampil G03 -Jika pilih data pembelajaran materi G05 - Jika pilih data pembelajaran tugas tampil G06 -jika pilih data pembelajaran ujian tampil G07 -jika pilih pembelajaran nilai tampil G8 -jika pilih edit profile tampil A11 -Jika pilih ganti password tampil A12 - Jika pilih logout tampil T01 To contact us please fill out the form below. Name: Email: Subject: Message: Attach a zip file: Send Browse Contact Gambar 3.56 Halaman Data Contak 117 Perancangan Antarmuka Halaman Data Pembelajaran Materi G05 Materi Home G05 List materi Batal Materi Filter Id Materi Mapel Guru Kelas 19 materi 1 Software Juhana hadi s.kom XRPL1 Download Edit Delete Upload materi Tampilan Menu Pembelajaran Materi G05 - Jika pilih Home tampil G01. -Jika pilih menu Upload materi tampil G05-1 -Jika pilih menu edit tampil G05-2 -Jika pilih menu Delete tampil A05 -Jika pilih menu Publish tampil A05 -Jika upload materi berhasil tampil pesan M03 - Jika edit materi berhasil tampil pesan M04 -jika delet materi berhasil tampil pesan M05 Keterangan : Nama Form : G05 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.57 Halaman Data Materi Perancangan Antarmuka Halaman Data Pembelajaran Tugas G06 Tugas Home G06 List tugas Batal Tugas Filter Id Tugas Materi Kelas 19 materi 1 Software XRPL1 Download Edit Delete Upload tugas Tampilan Menu Pembelajaran Tugas G06 - Jika pilih Home tampil G01. -Jika pilih menu Upload tugas tampil G06-1 -Jika pilih menu edit tampil G06-2 -Jika pilih menu Delete tampil A06 -Jika pilih menu Publish tampil A06 -Jika upload tugas berhasil tampil pesan M03 - Jika edit tugas berhasil tampil pesan M04 -jika delet tugas berhasil tampil pesan M05 Keterangan : Nama Form : G06 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.58 Halaman Data Tugas 118 Perancangan Antarmuka Halaman Data Pembelajaran Ujian G07 Ujian Tambah soal Batal Soal Ujian Cari Matapelajaran Pertanyaan software Sistem Operasi adalah software atau Edit perangkat lunak untuk Import xls 1 2 3 4 Home G07 Tampilan Menu Pembelajaran Ujian G07 - Jika pilih Home tampil G01. -Jika pilih menu Upload tugas tampil G06-1 -Jika pilih menu edit tampil G06-2 -Jika pilih menu Delete tampil A06 -Jika pilih menu Publish tampil A06 -Jika tambah soal berhasil tampil pesan M03 - Jika edit soal berhasil tampil pesan M04 Keterangan : Nama Form : G07 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Gambar 3.59 Halaman Data Ujian Perancangan Antarmuka Data Pembelajaran Nilai G08 logo Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak Home | Berita | Guru | Siswa | Contact | Data Pembelajaran | Profile | Logout G08 Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact DataPembelajaran Profile Logout Keterangan : Nama Form : G04 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Tampilan Menu Data Pembelajaran Nilai G08 - Jika pilih menu home akan tampil G01 - Jika pilih menu berita akan tampil A02 - Jika pilih menu guru akan tampil G02 - Jika pilih menu home akan tampil G01 - Jika pilih menu siswa akan tampil G03 -Jika pilih data pembelajaran materi G05 - Jika pilih data pembelajaran tugas tampil G06 -jika pilih data pembelajaran ujian tampil G07 -jika pilih menu contak tampil G04 -jika pilih edit profile tampil A11 -Jika pilih ganti password tampil A12 - Jika pilih logout tampil T01 Data Nilai NO INDUK NAMA SISWA MATA PELAJARAN NILAI Tugas Nilai Ujian 08090001 Abdul Azis Bahasa Indonesia 80 100 Filter Gambar 3.60 Halaman Data Nilai 119 Perancangan Antarmuka Halaman Utama Login Siswa S01 logo Welcome Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak Home | Berita | Guru | Siswa | Contact | Data Pembelajaran | Profile | Logout Selamat datang di e-learning S01 Tampilan Utama Login Siswa S01 - Jika pilih menu home akan tampil S01 - Jika pilih menu berita akan tampil S02 - Jika pilih menu guru akan tampil G02 - Jika pilih menu siswa akan tampil G03 - Jika pilih menu contact akan tampil G04 -Jika pilih data pembelajaran materi S03 - Jika pilih data pembelajaran tugas tampil S04 -jika pilih data pembelajaran ujian tampil S05 -Jika pilih data pembelajaran nilai tampil S06 -jika pilih edit profile tampil A11 -Jika pilih ganti password tampil G12 - Jika pilih logout tampil T01 -Jika login siswa berhasil tampil pesan M01 Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact DataPembelajaran Profile Logout Keterangan : Nama Form : S01 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Foto Profile sekolah Gambar 3.61 Halaman Utama Siswa Perancangan Antarmuka Halaman Data Berita S01 logo Berita Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak Home | Berita | Guru | Siswa | Contact | Data Pembelajaran | Profile | Logout S02 Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact DataPembelajaran Profile Logout Keterangan : Nama Form : S02 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Samsung Tablet Coba Jadi Alternatif iPad2 Posted: 2012-05-31 Jakarta - Menyaingi Apple jadi prioritas utama Microsoft saat ini. Sang CEO, Steve Ballmer mengungkapkan, bahwa perusahaannya sedang bekerja keras menciptakan komputer tablet yang bisa menjegal laju iPad. Disebutkan oleh sang penerus tahta Bill Gates, Microsoft dalam mengembangkan komputer bergaya tabletnya ini bekerja sama dengan sejumlah vendor hardware kenamaan seperti Hewlett-Packard HP, .... Pengumuman Posted: 2012-02-17 Pengumuman UAS Tampilan Menu Berita S02 - Jika pilih menu home akan tampil S01 - Jika pilih menu guru akan tampil G02 - Jika pilih menu siswa akan tampil G03 - Jika pilih menu contact akan tampil G04 -Jika pilih data pembelajaran materi S03 - Jika pilih data pembelajaran tugas tampil S04 -jika pilih data pembelajaran ujian tampil S05 -Jika pilih data pembelajaran nilai tampil S06 -jika pilih edit profile tampil A11 -Jika pilih ganti password tampil G12 - Jika pilih logout tampil T01 Gambar 3.62 Halaman Data Berita 120 Perancangan Antarmuka Halaman Data Pembelajaran Materi S03 logo Materi Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak Home | Berita | Guru | Siswa | Contact | Data Pembelajaran | Profile | Logout S03 Tampilan menu pembelajaran materi S03 - Jika pilih menu home akan tampil S01 - Jika pilih menu berita akan tampil S02 - Jika pilih menu guru akan tampil G02 - Jika pilih menu siswa akan tampil G03 - Jika pilih menu contact akan tampil G04 - Jika pilih data pembelajaran tugas tampil G06 -jika pilih data pembelajaran ujian tampil G07 -Jika pilih data pembelajaran nilai tampil G08 -jika pilih edit profile tampil A11 -Jika pilih ganti password tampil G12 - Jika pilih logout tampil T01 Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact DataPembelajaran Profile Logout Keterangan : Nama Form : S03 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Materi Matapelajaran keterangan Guru Kelas Materi 01 Matematika Materi Matematika 01 Lia Novita Nasution, S.Si. X RPL 1 Gambar 3.63 Halaman Data Materi Perancangan Antarmuka Halaman Data Pembelajaran Ujian S04 logo Soal Ujian Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak Home | Berita | Guru | Siswa | Contact | Data Pembelajaran | Profile | Logout S04 Tampilan menu pembelajaran ujian S04 - Jika pilih menu home akan tampil S01 - Jika pilih menu berita akan tampil S02 -Jika pilih menu pembelajaran materi tampil S03 - Jika pilih menu guru akan tampil G02 - Jika pilih menu siswa akan tampil G03 - Jika pilih menu contact akan tampil G04 - Jika pilih data pembelajaran tugas tampil G06 -jika pilih data pembelajaran ujian tampil G07 -Jika pilih data pembelajaran nilai tampil G08 -jika pilih edit profile tampil A11 -Jika pilih ganti password tampil G12 - Jika pilih logout tampil T01 Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact DataPembelajaran Profile Logout Keterangan : Nama Form : S04 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 MATA PELAJARAN TANGGAL JAM AWAL JAM AKHIR WAKTU Pendidikan Agama 2012-08-30 07:00:00 08:00:00 90.00 Bahasa dan Sastra Indonesia 2012-08-31 07:00:00 08:30:00 90.00 Gambar 3.64 Halaman Data Ujian 121 Perancangan Antarmuka Halaman Data Pembelajaran Ujian S04-1 logo Pendidikan Agama Rekayasa Perangkat Lunak SMK Darul Ma’arif - Paanukan Elearning Rekayasa Perangkat Lunak Home | Berita | Guru | Siswa | Contact | Data Pembelajaran | Profile | Logout S04-1 Tampilan menu pembelajaran ujian S04-1 - Jika pilih menu home akan tampil S01 - Jika pilih menu berita akan tampil S02 -Jika pilih menu pembelajaran materi tampil S03 - Jika pilih menu guru akan tampil G02 - Jika pilih menu siswa akan tampil G03 - Jika pilih menu contact akan tampil G04 - Jika pilih data pembelajaran tugas tampil G06 -jika pilih data pembelajaran ujian tampil G07 -Jika pilih data pembelajaran nilai tampil G08 -jika pilih edit profile tampil A11 -Jika pilih ganti password tampil G12 - Jika pilih logout tampil T01 -Jika selesai mengirim jawaban ke server tampil pesan M08 -Jika pilih menu ok pada pesan M09 maka tampil pesan M09 Login Nama user Ganti Password Edit profile foto Main menu Home Berita Guru Siswa Contact DataPembelajaran Profile Logout Keterangan : Nama Form : S04-1 Ukuran Layar : Dinamis Default 1280x800 TypeUkuran font : Arial, Helvetica11.3px Warna latar : 2C4100 Selamat Mengerjakan tes soal online Sisa Waktu Waktu Berjalan Sekarang Jam Pilihan Ganda 1. Yang bukan termasuk agama adalah a. islam b. kristen c. hindu d. pancasila Essai 1. Rukun Iman ada berapa Selesai Dan Kirim Jawaban ke Server Sisa Waktu Waktu Berjalan Sekarang Jam Gambar 3.65 Halaman Data Ujian 122

3.3.3 Perancangan Pesan

Perancangan pesan yang terdapat pada sistem ini dapat dilihat pada gambar berikut : Anda Telah Berhasil Login X M01 M02 Pos BERITA telah ditambah. X M03 Kelas XII RPL 2 berhasil disimpan X M04 Apakah Anda yakin ingin menghapus ini? Hal ini tidak dapat dibatalkan. M05 Ok Cancel Informasi Akun Berhasil di Perbaharui X M06 Pos .. telah dihapus. X M07 Belajarlah lebih baik lagi, sehingga bisa sukses di X kemudian hari. M08 Bidang Judul harus diisi. X Bidang URL diperlukan. Bidang Pendahuluan diperlukan. Bidang Konten diperlukan. Apakah Anda yakin M09 Ok Cancel Gambar 3.66 Perancangan Pesan 123 3.3.4 Jaringan Semantik Aliran dari menu-menu yang ada di program akan dijelaskan pada gambar berikut : 1. Jaringan semantik petugas T01 A02 A06 A04 A03 A10 A07 A09 A05 A08 M0 3,M 4, M5 A01 A11 A12 M 03 ,M 4,M 05 M03,M04, M05, M03, M04, M05 M03,M04, M5 M06 M04 T02 T03 T04 T05 M01 M03, M04,M 5 Gambar 3.67 Jaringan Semantik Petugas 124 2. Jaringan semantik guru T01 M19 G01 G08 G07 M03, M04, M05 G09 M01,M03, M04,M21 G04 G05 M0 3,M 04,M 05 G06 M0 3,M 04,M 05 G02 G03 T04 T03 T02 T05 Gambar 3.68 Jaringan Semantik Guru 125 3. Jaringan semantik siswa T01 S02 S06 S03 A09 A08 S01 A10 A11 A12 A13 T02 T03 T04 T05 M01 M06 M06 M08 Gambar 3.69 Jaringan Semantik Siswa

3.3.5 Perancangan Prosedural

Perancangan prosedural merupakan perancangan yang dilakukan untuk menetapkan detail algoritma yang akan dinyatakan kedalam suatu program. Adapun perancangan prosedual untuk e-learning yang akan dibangun adalah sebagai berikut: 1. Flowchart Login, merupakan prosedur yang terjadi ketika user mulaimengakses e-learning.