3.2.2 Perancangan Antarmuka
Spesifikasi antarmuka merupakan suatu bentuk tampilan dari
program yang akan dibuat untuk kebutuhan interface dengan user. Spesifikasi antarmuka terdiri dari perancangan tampilan menu, tampilan
form, tampilan pesan, keluaran dan jaringan semantik.
3.2.2.1 Perancangan Antarmuka Pengunjung
1. Perancangan Antarmuka Halaman Utama
Berikut dapat dilihat perancangan antar muka Halaman utama dari pembangunan aplikasi penjualan online di distro Blo-on yang tercantum
pada gambar 3.33 di bawah ini :
Header
Gambar Halaman Utama
Main Menu
Halaman utama Tentang Kami
Konfirmasi Pembayaran Produk
Hubungi kami Login
Yahoo Messenger facebook
Produk Terlaris
Produk Terbaru A01
Klik Halaman Utama menuju A01 Klik Produk menuju A02
Klik Tentang Kami Menuju A03 Klik Hubungi Kami menuju A04
Klik Register menuju A05 Klik Login menuju A06
Registrasi Download Katalog
Gambar 3.33 Perancangan antarmuka halaman utama
2. Perancangan Antarmuka Menu Produk
Berikut dapat dilihat perancangan antarmuka menu produk dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum
pada gambar 3.34 di bawah ini :
Header
Gambar produk
Main Menu
Login
Yahoo Messenger facebook
Produk Terlaris
Produk Terbaru A02
Registrasi Produk
Halaman utama Tentang Kami
Konfirmasi Pembayaran Produk
Hubungi kami Download Katalog
Klik Halaman Utama menuju A01 Klik Produk menuju A02
Klik Tentang Kami Menuju A03 Klik Hubungi Kami menuju A04
Klik Register menuju A05 Klik download katalog menuju A08
Klik Login menuju A06
Gambar 3.34 Perancangan antarmuka menu produk
3. Perancangan Antarmuka Menu Tentang Kami
Berikut dapat dilihat perancangan antarmuka menu tentang kami dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum
pada gambar 3.35 di bawah ini :
Header
Teks
Main Menu
Login
Yahoo Messenger facebook
Produk Terlaris
Produk Terbaru A03
Registrasi
Logo distroblo-on
Halaman utama Tentang Kami
Konfirmasi Pembayaran Produk
Hubungi kami Download Katalog
Tentang Kami Klik Halaman Utama menuju A01
Klik Produk menuju A02 Klik Tentang Kami Menuju A03
Klik Hubungi Kami menuju A04 Klik Register menuju A05
Klik download katalog menuju A08 Klik Login menuju A06
Gambar 3.35 Perancangan antarmuka menu tentang kami
4. Perancangan Antarmuka Menu Hubungi Kami