3.4. Perancangan Antar Muka
Untuk memudahkan pembuatan website khususnya dalam desain tampilan, maka dibuat perancangan antar muka terlebih dahulu. Hasil perancangan ini
selanjutnya digunakan sebagai panduan dalam membuat tampilan aplikasi SPK Pembelian Gadget Elektronik. Aplikasi SPK Pembelian Gadget Elektronik
memiliki beberapa halaman yang akan dibuat yaitu: 1
Halaman Utama 2
Halaman Produk 3
Halaman Pendaftaran 4
Halaman Profil 5
Halaman AHP 6
Halaman Administrator
Berikut ini merupakan perancangan dan penjelasan dari tampilan halaman aplikasi yang akan dibuat.
3.4.1. Tampilan Halaman Utama
Gambar 3.9 Desain Tampilan Halaman Utama Identitas Online Shop
Utama Produk Pendaftaran Profil Login
Nama Password
Produk Populer
Link Produk Link Produk
Login
Identitas Online Shop Utama Produk Pendaftaran Profil
Login
Nama Password
Katalog Produk
Link Produk Link Produk
Link Produk Link Produk
Link SPK AHP
Login
Gambar 3.9 di atas menggambarkan desain tampilan halaman utama dari aplikasi yang akan dibuat. Pada bagian atas halaman utama terdapat identitas
online shop dan di bawahnya terdapat menu sebagai penghubung ke halaman lain. Di bagian kiri halaman utama, terdapat kotak untuk mengisi nama dan password
apabila telah terdaftar sebagai pelanggan. Area kanan merupakan daerah untuk memunculkan produk-produk populer.
3.4.2. Tampilan Halaman Produk
Gambar 3.10 Desain Tampilan Halaman Produk
Pada gambar 3.10 menunjukkan desain tampilan halaman produk. Secara garis besar desain halaman ini tidak jauh berbeda dengan desain halaman utama.
Perbedaannya hanyalah area kanan pada halaman ini memuat katalog seluruh produk yang tersedia. Pada katalog produk ini akan diberikan link untuk fitur SPK
pembelian gadget elektronik yang menerapkan metode AHP.
Identitas Online Shop Utama Produk Pendaftaran Profil
Login
Nama Password
Pendaftaran
Nama Password
Email No Telp
Alamat
Login
Identitas Online Shop Utama Produk Pendaftaran Profil
Login
Nama Password
Uraian Profil Online Shop
Login
3.4.3. Tampilan Halaman Pendaftaran
Gambar 3.11 Desain Tampilan Halaman Pendaftaran
Gambar 3.11 menampilkan desain halaman pendaftaran dimana area sebelah kanan berisi form pendaftaran menjadi pelanggan online shop ini.
3.4.4. Tampilan Halaman Profil
Gambar 3.12 Desain Tampilan Halaman Profil
Gambar 3.12 menampilkan desain halaman profil dimana area sebelah kanan berisi profil online shop.
Daftar
Identitas Online Shop
Produk Negara
Kota Lihat Pelanggan
Lihat Transaksi
Berisi form sesuai dengan menu yang dipilih
3.4.5. Tampilan Halaman AHP
Kategori