Perancangan Tampilan untuk pengunjungsebelum login Perancangan Tampilan untuk Member setelah Login Perancangan Tampilan untuk Admin

3.2.9 Perancangan Antarmuka

Perancangan antarmuka untuk sistem yang akan dibangun dibedakan sesuai dengan jenis penggunanya, yaitu admin, petugas, pemesan dan pengunjung. Perancangan antarmuka dan navigasinya dapat dilihat melalui gambar berikut:

3.2.9.1 Perancangan Tampilan untuk pengunjungsebelum login

Gambar 3.28 Halaman Beranda Gambar 3.29 Halaman Tentang Kami 43 7447 9 6 : -- - 23 462 72 ;772 77727 ; 6 42 67 = 7 ;7 974 57 ;772 77727 ; 6 42 67 = 3; 832 62 76:617 7 32 7872= 3; 7 7 32 = ;772 27 ; 77727 ; 6 42 572;7 67 = ;772 27 ; 77727 ; 6 42 572;7 67 = ;772 27 ; 77727 ; 6 42 572;7 67 = ;772 27 ; 77727 ; 6 42 572;7 67 = ;772 27 ; 77727 ; 6 42 572;7 67 = ;772 27 ; 77727 ; 6 42 572;7 67 = 3;3 627 7 6 7 ;47 23 447 4627 ?7 ;6 7 ?7 1 4 627 7 + 1 4 6 7 ;47 + 1 4 23 447 + 1 4 4627 ?7 ;6 7 ?7 , 1 4 + 1 4 + 1 4 + A:: B . ;772 27 ; 77727 ; 6 42 572;7 67 = ;772 27 ; 77727 ; 6 42 572;7 67 = ;772 27 ; 77727 ; 6 42 572;7 67 = ;772 27 ; 77727 ; 6 42 572;7 67 = ;772 27 ; 77727 ; 6 42 572;7 67 = ;772 27 ; 77727 ; 6 42 572;7 67 = Gambar 3.30 Halaman Produk Kami 43 7447 9 6 : -- - 23 462 72 ;772 77727 ; 6 42 67 = 7 ;7 974 57 ;772 77727 ; 6 42 67 = 3; 832 62 76:617 7 32 7872= 3; 7 7 32 = 3;3 627 7 6 7 ;47 23 447 4627 ?7 ;6 7 ?7 1 4 627 7 + 1 4 6 7 ;47 + 1 4 23 447 + 1 4 4627 ?7 ;6 7 ?7 , 1 4 + 1 4 + 1 4 + A:: B . , 6 7 7 23 4 4627 ?7 ;6 7 ?7 Gambar 3.31 Halaman Keranjang Belanja Gambar 3.32 Halaman detail Gambar 3.33 Halaman Daftar Gambar 3.34 Halaman Lupa Password

3.2.9.2 Perancangan Tampilan untuk Member setelah Login

Gambar 3.35 Halaman Beranda Gambar 3.36 Halaman Tentang Kami Gambar 3.37 Halaman Produk Kami Gambar 3.38Halaman Keranjang Belanja Gambar 3.39 Halaman Detail Gambar 3.40 Halaman Histori Belanja 23 462 72 ;772 77727 ; 6 42 67 = 7 ;7 974 57 ;772 77727 ; 6 42 67 = 3;3 627 7 6 7 ;47 23 447 4627 ?7 ;6 7 ?7 1 4 627 7 + 1 4 6 7 ;47 + 1 4 23 447 + 1 4 4627 ?7 ;6 7 ?7 , 1 4 + 1 4 5 + + 1 4 + A:: B . 7 83662 5 C 77662 5 32 6 7 ?7D 6 ;D 3;3 Gambar 3.41 Halaman Setting

3.2.9.3 Perancangan Tampilan untuk Admin

1. Perancangan Tampilan untuk Owner

= = = 2 = 7 2732 627 7 6 ;7 27 46 72 1 4 627 7 + 7 1 4 6 ;7 27 + 7 1 4 7 + 7 1 4 7 + 7 1 4 4 + , 1 4 + 7 , 1 4 6 + 7 , 1 4 5 + 7 ,. 1 4 4 7 1 4 + 7 1 4 6 + 7 1 4 57 + 7 . 1 4 + 7 1 4 + 7 1 4 6 + 7 1 4 57 + 7 . 1 4 + 7 1 4 + 7 1 4 6 + 7 1 4 57 + 7 . 1 4 ; + 7 14 + 7 1 4 + 7 - 1 4 + 7 - 1 4 6 + 7 - 1 4 57 + 7 -. 1 4 4 4 + 7 1 4 + 7 1 4 6 + 7 1 4 57 + 7 . 1 4 3 4 + 7 1 4 + 7 1 4 6 + 7 1 4 57 + 7 . 1 4 + 7 1 4 + 7 1 4 + 7 7 7 ? 4 A4 4 A 4 A ; A ; 7 = 4 = 4 = = = ; = = 4 : = 3 4 = . . 1 1? 1 . 1 ? 1 . 1 1? 1 . 1 ? 1 . 1 1? 1 . 1 ? 1 . 1 1? 1 . 1 ? 1 . 1 1? 1 . 1 ? 1 . 1 1? 1 . 1 ? 1 . . 1 1 B 4 . Gambar 3.42 Halaman Beranda Gambar 3.43 Halaman Pengaturan = = = 7 2732 627 7 6 ;7 27 46 72 4 4 4 6 =5 = E E B 6 =5 = 6 =5 = 7 , 7 = 4 = 4 = = = ; = = 4 = 3 4 = 476;32 1 4 627 7 + 7 1 4 6 ;7 27 + 7 1 4 7 + 7 1 4 7 + 7 1 4 4 + , 1 4 + 7 , 1 4 6 + 7 , 1 4 5 + 7 ,. 1 4 4 7 1 4 + 7 1 4 6 + 7 1 4 57 + 7 . 1 4 + 7 1 4 + 7 1 4 6 + 7 1 4 57 + 7 . 1 4 + 7 1 4 + 7 1 4 6 + 7 1 4 57 + 7 . 1 4 ; + 7 14 + 7 1 4 + 7 - 1 4 + 7 - 1 4 6 + 7 - 1 4 57 + 7 -. 1 4 4 4 + 7 1 4 + 7 1 4 6 + 7 1 4 57 + 7 . 1 4 3 4 + 7 1 4 + 7 1 4 6 + 7 1 4 57 + 7 . 1 4 + 7 1 4 + 7 1 4 + 7 Gambar 3.44 Halaman Data Kategori Gambar 3.45 Halaman Tambah Kategori Gambar 3.46 Halaman Edit Kategori Gambar 3.47 Halaman SubKategori Gambar 3.48 Halaman Tambah SubKategori Gambar 3.49Halaman Edit SubKategori Gambar 3.50 Halaman Produk Gambar 3.51Halaman Tambah Produk Gambar 3.52 Halaman Edit Produk Gambar 3.53Halaman DetailProduk Gambar 3.54 Halaman Tambah SubProduk Gambar 3.55 Halaman Edit SubProduk Gambar 3.56 Halaman Gambar Produk Gambar 3.57 Halaman Tambah Gambar Produk Gambar 3.58 Halaman Propinsi Gambar 3.59Halaman Tambah Propinsi Gambar 3.60 Halaman Edit Propinsi Gambar 3.61 Halaman KabKota Gambar 3.62 Halaman Tambah KabKota Gambar 3.63 Halaman Edit KabKota Gambar 3.64 Halaman Ongkos Kirim Gambar 3.65 Halaman Laporan Pesanan Gambar 3.66 Halaman Laporan Pembayaran Gambar 3.67 Halaman Laporan Pengiriman Gambar 3.68 Halaman Laporan Retur Produk

2. Perancangan Tampilan untuk Gudang

Gambar 3.69 Halaman Beranda Gambar 3.70 Halaman Pengaturan Gambar 3.71 Halaman kategori Gambar 3.72 Halaman Tambah kategori Gambar 3.73 Halaman Edit kategori 7 2732 627 7 6 ;7 27 46 72 4 4 4 6 =5 = 6 =5 = ; , 4 = 4 = = = ; = 476;32 1 4 627 7 + ; 1 4 6 ;7 27 + ; 1 4 4 + ; 1 4 + ; 1 4 6 + ; 1 4 5 + ; . 1 4 4 ; , 1 4 + ; , 1 4 6 + ; , 1 4 5 + ; ,. 1 4 + ; 1 4 + ; 1 4 6 + ; 1 4 5 + ; . 1 4 + ; 1 4 + ; 1 4 + ; 1 4 F . + ; . 1 4 6 + ; 1 4 5 + ; 1 4 ; + ; 14 + ; Gambar 3.74 Halaman Subkategori Gambar 3.75 Halaman Tambah Subkategori Gambar 3.76 Halaman Edit Subkategori Gambar 3.77 Halaman Produk Gambar 3.78 Halaman Tambah Produk Gambar 3.79 Halaman Edit Produk 7 2732 627 7 6 ;7 27 46 72 5 ; , G 6 =5 = ; , G 6 =5 = ; 4 = 4 = = = ; = 1 4 627 7 + ; 1 4 6 ;7 27 + ; 1 4 4 + ; 1 4 + ; 1 4 6 + ; 1 4 5 + ; . 1 4 4 ; , 1 4 + ; , 1 4 6 + ; , 1 4 5 + ; ,. 1 4 + ; 1 4 + ; 1 4 6 + ; 1 4 5 + ; . 1 4 + ; 1 4 + ; 1 4 + ; 1 4 F . + ; . 1 4 6 + ; 1 4 5 + ; 1 4 ; + ; 14 + ; Gambar 3.80 Halaman detail Produk Gambar 3.80 Halaman Tambah detail Produk Gambar 3.81 Halaman Gambar Gambar 3.82 Halaman Tambah Gambar 3. Perancangan Tampilan untuk Kasir Gambar 3.83 Halaman Beranda Gambar 3.84 Halaman Pengaturan Gambar 3.84 Halaman Produk Gambar 3.85 Halaman Detail Produk Gambar 3.86 Halaman Pesanan Gambar 3.87 Halaman Pembayaran Gambar 3.88 Halaman Pengiriman Gambar 3.89 Halaman Retur 4. Perancangan tampilan untuk direktur dan seketaris 7 2732 627 7 6 ;7 27 46 72 1 4 627 7 + 1 4 6 ;7 27 + 1 4 + 1 4 + 1 4 6 + 1 4 5 + . 1 4 4 4 + , 1 4 + , 1 4 6 + , 1 4 5 + ,. 1 4 3 4 + 1 4 6 + 1 4 + 1 4 + 1 4 + - 1 4 2 + 7 ? 4 A4 4 A 4 A ; A ; . . 1 1? 1 . 1 ? 1 . 1 1? 1 . 1 ? 1 . 1 1? 1 . 1 ? 1 . 1 1? 1 . 1 ? 1 . 1 1? 1 . 1 ? 1 . 1 1? 1 . 1 ? 1 . . 1 1 B 4 . = = = 2 = = 4 :4 = 3 4 = Gambar 3.90 Halaman Beranda Gambar 3.91 Halaman Pengaturan Gambar 3.92 Halaman Propinsi Gambar 3.93 Halaman Tambah Propinsi Gambar 3.94 Halaman Edit Propinsi Gambar 3.95 Halaman Kabkota Gambar 3.96 Halaman Tambah Kabkota Gambar 3.97 Halaman Edit Kabkota Gambar 3.98 Halaman Ongkir Gambar 3.99 Halaman Edit Ongkir Gambar 3.100 Halaman Laporan Pesanan Gambar 3.101 Halaman Laporan Pesanan Gambar 3.102 Halaman Laporan Pengiriman Gambar 3.103 Halaman Laporan Retur M01 M02 M03 M04 M05 M06 M07 M08 M09 Konfirmasi hapus Apakah anda Yakin akan menghapus Kategori?

3.2.10 Jaringan Semantik