Perancangan Tampilan awal Perancangan Antarmuka
40
T01
SHEETSTER
Password Username
Login Masukan Usernam dan
password kemudian klik login untuk masuk ke layar
T02
LOGIN
Laporan KP | IF-5
Ukuran, background, font, warna di sesuaikan
Gambar 3.16 Antarmuka Login
Perancangan antarmuka tampilan user dapat dilihat pada Gambar 3.13
41
T02 Header
Input Data Utama KWT
DOP
menuju pengisian KWT · Klik Tombol DOP untuk
menuju Pengisian DOP menuju M01
· Klik Link Tambah untuk menambahkan data
KWT atau DOP · Klik Link Edit untuk
merubah data KWT atau DOP
KWT DOP Hapus Tambah Edit
Footer Laporan KP | IF-5
Ukuran, background, font, warna di sesuaikan
Gambar 3.17 Antarmuka User
42 Perancangan antarmuka tampilan pesan dapat dilihat pada Gambar 3.18 sampai 3.21
M01
Anda Harus Login
Pesan Peringatan anda harus login sebelum masuk
ke aplikasi
Laporan KP | IF - 5
Ukuran, background, font, warna di sesuaikan
Gambar 3.18 Antarmuka Pesan Peringatan Harus Login
43
M02
Data kurang lengkap
Peringatan anda yakin ingin menghapus file yang
dipilih
Laporan KP | IF - 5
Ukuran, background, font, warna di sesuaikan
Gambar 3.19 Antarmuka Pesan Peringatan Data Kurang Lengkap
44
T02
· Klik tombol Mulai Baru
GUESS WORD
Persiapan untuk masuk ke layar menu T03.
· Klik tombol Pengaturan untuk masuk ke layar
menu T04. · Klik tombol Bantuan
untuk msuk ke layar menu T05.
· Klik tombol Keluar untuk msuk ke layar
menu T06
IMK | 2012 | IF-5
Ukuran, background, font, warna di sesuaikan
Ya M03
kin ingin menghapus data ini ? Ya tidak
· Klik tombol Cara Bermain untuk masuk
ke layar menu T06. · Klik tombol Info untuk
masuk ke layar menu T07.
· Klik tombol Kembali ke layar menu T02
Laporan KP | IF - 5
Ukuran, background, font, warna di sesuaikan
Gambar 3.20 Antarmuka Pesan Peringatan Hapus Data
45
T02
· Klik tombol Mulai Baru Persiapan untuk masuk
ke layar menu T03. · Klik tombol Pengaturan
untuk masuk ke layar menu T04.
· Klik tombol Bantuan untuk msuk ke layar
menu T05. · Klik tombol Keluar
untuk msuk ke layar menu T06
IMK | 2012 | IF-5
Ukuran, background, font, warna di sesuaikan
M04
· Klik tombol Kembali ke layar menu T02
Anda yakin ingin mengubah data ini ? Ya Tidak
Laporan KP | IF-5
Ukuran, background, font, warna di sesuaikan
Gambar 3.21 Antarmuka Pesan Peringatan Hapus Data