Perancangan Antarmuka Administrator Perancangan Antarmuka Menu Registrasi

Header Akun Saya Produk Terlaris Produk Terbaru Yahoo Messenger Anda login sebagai xxxmail.com B16 Main Menu facebook Tanggal : No. Retur Kode Pemesanan : Opsi Retur Status Retur Halaman utama Tentang Kami Konfirmasi Pembayaran Produk Hubungi kami Download Katalog Retur Klik Halaman Utama menuju B01 Klik Produk menuju B02 Klik Download Katalog B03 Klik Tentang Kami Menuju B04 Klik Hubungi Kami menuju B05 Klik Konfirmasi pembayaran menuju B06 Klik profil saya menuju B07 Klik Ubah menuju B08 Klik ganti password menuju B09 Klik Catatan belanja menuju B10 Klik catatan pemesanan menuju B11 Klik Verifikasi menuju B12 Klik keranjang belanja menuju B13 Klik Retur menuju B15 Klik logout menuju A01 Nama Barang Harga QTY Yang di retur Proses Batal Profil Saya Ganti Password Catatan Pemesanan Keranjang 0 Logout Catatan Belanja Verifikasi Penerimaan Retur Gambar 3.52 perancangan antarmuka detail retur

3.2.2.3 Perancangan Antarmuka Administrator

1. Perancangan Antar muka login Berikut dapat dilihat perancangan antarmuka login administrator dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.53 di bawah ini : Header C01 Email : Password : Lupa password Klik login menuju C03 Login Login Hari, Tanggal - Jam Klik Lupa password menuju C02 Gambar 3.53 Perancangan antarmuka menu login administrator 2. Perancangan Antar Muka Lupa Password Berikut dapat dilihat perancangan antarmuka lupa password dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.54 di bawah ini : Header C02 Klik kembali menuju C01 Kirim Lupa Password Hari, Tanggal - Jam Email : Kembali Gambar 3.54 Perancangan antarmuka lupa password 3. Perancangan Antarmuka Menu Halaman Utama Berikut dapat dilihat perancangan antarmuka home dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.55 di bawah ini : Header C03 Anda login sebagai administrator Footer Ongkos kirim Akun saya Main Menu Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Katalog Tentang Kami Kontak Kami Gambar 3.55 Perancangan antarmuka menu halaman utama 4. Perancangan Antarmuka Akun Saya Berikut dapat dilihat perancangan antarmuka akun saya dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.56 di bawah ini : Header C04 Main Menu Akun saya Jabatan Email Password Ubah Email Ubah Password Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik Ubah Email menuju C05 Klik Ubah Password Menuju C06 Klik user menuju C07 Klik produk menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.56 Perancangan antarmuka menu akun saya 5. Perancangan Antarmuka Ubah Email Berikut dapat dilihat perancangan antarmuka ubah email dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.57 di bawah ini : Header C05 Main Menu Akun saya Email Lama Email Baru Update Batal Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik Update Menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.57 Perancangan antarmuka ubah email 6. Perancangan Antarmuka Ubah Password Berikut dapat dilihat perancangan antarmuka Ubah Password dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.58 di bawah ini : Header C06 Main Menu Akun saya Password Lama Password Baru Update Batal Konfirmasi Password Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik Update Menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.58 Perancangan antarmuka Ubah Password 7. Perancangan Antarmuka Menu User Berikut dapat dilihat perancangan antarmuka user dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.59 di bawah ini : Header C07 Main Menu User Email Password Jabatan Aksi x No Tambah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik Tambah Data menuju C08 Klik produk menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.59 Perancangan antarmuka menu user 8. Perancangan Antarmuka Tambah User Berikut dapat dilihat perancangan antarmuka tambah user dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.60 di bawah ini : Header C08 Main Menu User Simpan Batal Tambah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Email : Password : Konfirmasi Password : Jabatan : Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik Simpan menuju C07 Klik produk menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.60 Perancangan antarmuka tambah user 9. 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.61 di bawah ini : Header C09 Main Menu Produk No Nama UkuranHargaStok Aksi Ubah Hapus Lihat Tambah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Tambah Data Menuju C10 Klik edit menuju C11 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.61 Perancangan antarmuka menu produk 10. Perancangan Antarmuka Tambah Produk Berikut dapat dilihat perancangan antarmuka tambah produk dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.62 di bawah ini : Header C10 Main Menu Produk Browse Simpan Batal Tambah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Ukuran S Nama Produk : Gambar : Ukuran : Harga : Stok : Ukuran M Ukuran : Harga : Stok : Ukuran L Ukuran : Harga : Stok : Gambar 3.62 Perancangan antarmuka tambah produk 11. Perancangan Antarmuka Ubah Produk Berikut dapat dilihat perancangan antarmuka ubah produk dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.63 di bawah ini : Header C11 Main Menu Produk Ubah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Browse Simpan Batal Ukuran S Nama Produk : Gambar : Ukuran : Harga : Stok : Ukuran M Ukuran : Harga : Stok : Ukuran L Ukuran : Harga : Stok : Gambar 3.63 Perancangan antarmuka ubah produk 12. Perancangan Antarmuka Menu Katalog Berikut dapat dilihat perancangan antarmuka menu katalog dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.64 di bawah ini : Header C12 Main Menu Katalog No Katalog Aksi Ubah Hapus Tambah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Tambah Data menuju C13 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.64 Perancangan antarmuka menu Katalog 13. Perancangan Antarmuka Tambah Katalog Berikut dapat dilihat perancangan antarmuka Tambah Katalog dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.65 di bawah ini : Header C13 Main Menu Klik Halaman Utama menuju C03 Klik Ganti password menuju C04 Klik user menuju C05 Klik Jenis Pengiriman menuju C07 Klik produk menuju C10 Klik Propinsi menuju C13 Klik kota menuju C16 Klik ongkos kirim menuju C19 Klik logout menuju C01 Katalog File : Simpan Batal Tambah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Browse Gambar 3.65 Perancangan antarmuka Tambah Katalog 14. Perancangan Antarmuka Menu Propinsi Berikut dapat dilihat perancangan antarmuka menu propinsi dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.66 di bawah ini : Header C14 Main Menu Propinsi No Nama Propinsi Aksi Ubah Hapus Tambah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik Tambah Data menuju C15 Klik Ubah menuju C16 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.66 Perancangan antarmuka menu propinsi 15. Perancangan Antarmuka Tambah Propinsi Berikut dapat dilihat perancangan antarmuka tambah propinsi dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.67 di bawah ini : Header C15 Main Menu Propinsi Nama Propinsi Simpan Batal Tambah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik Simpan menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.67 Perancangan antarmuka tambah propinsi 16. Perancangan Antarmuka Ubah Propinsi Berikut dapat dilihat perancangan antarmuka Ubah Propinsi dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.68 di bawah ini : Header C16 Main Menu Propinsi Nama Propinsi Simpan Batal Ubah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik Simpan menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.68 Perancangan antarmuka ubah propinsi 17. Perancangan Antarmuka Menu Kota Berikut dapat dilihat perancangan antarmuka menu kota dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.69 di bawah ini : Header C17 Main Menu Kota No Nama Propinsi Aksi Ubah Hapus Nama Kota Tambah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Tambah Data menuju C18 Klik Ubah menuju C19 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.69 Perancangan antarmuka menu kota 18. Perancangan Antarmuka Tambah Kota Berikut dapat dilihat perancangan antarmuka tambah kota dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.70 di bawah ini : Header C18 Main Menu Kota Pilih Propinsi Nama Kota Simpan Batal Tambah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Simpan menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.70 Perancangan antarmuka tambah kota 19. Perancangan Antarmuka Ubah Kota Berikut dapat dilihat perancangan antarmuka ubah kota dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.71 di bawah ini : Header C19 Main Menu Kota Nama Kota Pilih Propinsi Simpan Batal Ubah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Simpan menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.71 Perancangan antarmuka ubah kota 20. Perancangan Antarmuka Menu Jenis Pengiriman Berikut dapat dilihat perancangan antarmuka menu jenis pengiriman dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.72 di bawah ini : Header C20 Main Menu Jenis Pengiriman Nama Paket Aksi Ubah Hapus No Tambah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik Tambah Data menuju C21 Klik Ubah menuju C22 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.72 Perancangan antarmuka menu jenis pengiriman 21. Perancangan Antarmuka Tambah Jenis Pengiriman Berikut dapat dilihat perancangan antarmuka tambah jenis pengiriman dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.73 di bawah ini : Header C21 Main Menu Jenis Pengiriman Nama Paket : Simpan Batal Tambah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik Simpan menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.73 Perancangan antarmuka tambah jenis pengiriman 22. Perancangan Antarmuka Ubah Jenis Pengiriman Berikut dapat dilihat perancangan antarmuka ubah jenis pengiriman dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.74 di bawah ini : Header C22 Main Menu Klik Simpan menuju C17 Jenis Pengiriman Nama Paket : Simpan Batal Ubah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik Simpan menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.74 Perancangan antarmuka ubah jenis pengiriman 23. Perancangan Antarmuka Menu Ongkos Kirim Berikut dapat dilihat perancangan antarmuka menu ongkos kirim dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.75 di bawah ini : Header C23 Main Menu Ongkos kirim No Jenis Pengiriman Nama Kota Tarif Aksi Ubah Tambah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tambah Data menuju C24 Klik Ubah menuju C25 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.75 Perancangan antarmuka menu ongkos kirim 24. Perancangan Antarmuka Tambah Ongkos Kirim Berikut dapat dilihat perancangan antarmuka ubah ongkos kirim dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.76 di bawah ini : Header C24 Main Menu Ongkos Kirim Nama Kota Nama Paket Tarif Simpan Batal Tambah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Simpan menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.76 Perancangan antarmuka tambah ongkos kirim 25. Perancangan Antarmuka Ubah Ongkos Kirim Berikut dapat dilihat perancangan antarmuka ubah ongkos kirim dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.77 di bawah ini : Header C25 Main Menu Ongkos Kirim Nama Kota Nama Paket Tarif Simpan Batal Ubah Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Simpan menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.77 Perancangan antarmuka ubah ongkos kirim 26. 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.78 di bawah ini : Header C26 Main Menu Tentang Kami Ubah Data Hapus Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Teks Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Ubah Data menuju C27 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.78 Perancangan antarmuka menu tentang kami 27. Perancangan Antarmuka Ubah Tentang Kami Berikut dapat dilihat perancangan antarmuka ubah tentang kami dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.79 di bawah ini : Header C27 Main Menu Tentang Kami Ubah Batal Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Teks Teks Tools Editor Ubah Data Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Ubah menuju C26 Klik Kontak Kami C28 Klik logout menuju C01 Gambar 3.79 Perancangan antarmuka ubah tentang kami 28. Perancangan Antarmuka Menu Kontak Kami Berikut dapat dilihat perancangan antarmuka menu kontak kami dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.80 di bawah ini : Header C28 Main Menu Kontak Kami Ubah Data Hapus Data Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Teks Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik Ubah Data menuju C29 Klik logout menuju C01 Gambar 3.80 Perancangan antarmuka menu kontak kami 29. Perancangan Antarmuka ubah Kontak Kami Berikut dapat dilihat perancangan antarmuka ubah kontak kami dari pembangunan aplikasi pemesanan online di distro Blo-on yang tercantum pada gambar 3.81 di bawah ini : Header C29 Main Menu Kontak Kami Ubah Batal Ongkos kirim Akun saya Halaman Utama User Jenis Pengiriman Produk Propinsi Kota Logout Katalog Tentang Kami Kontak Kami Teks Teks Tools Editor Ubah Data Klik Halaman Utama menuju C03 Klik Akun saya menuju C04 Klik user menuju C07 Klik produk menuju C09 Klik Simpan menuju C09 Klik Katalog menuju C12 Klik Propinsi menuju C14 Klik kota menuju C17 Klik Jenis Pengiriman menuju C20 Klik ongkos kirim menuju C23 Klik Tentang Kami C26 Klik Kontak Kami C28 Klik Ubah menuju C28 Klik logout menuju C01 Gambar 3.81 Perancangan antarmuka ubah kontak kami

3.2.2.4 Perancangan Antarmuka Staff Pemesanan