ANALISIS DAN PERANCANGAN
PENGOLAHAN KATALOG PENGOLAHAN WILAYAH
3. Perancangan Antar Muka Pelanggan
Antar muka login pelanggan (M01)
Ini adalah tampilan login pelanggan yang terdiri dari data masukan seperti email, password, tombol login dan tombol lupa password
Header
footer
Beranda Produk Bantuan Tentang kami Kontak kami
Keranjang belanja daftar | login
Kategori -lemari -kursi -meja Layanan pembayaran Tranfer bank -no rekening - atas nama Internet payment - paypal M01
Alamat : Login pelanggan Email :
Password :
login Lupa password
Navigasi :
1. Klik tombol beranda menuju tampilan M02
2. Klik tombol produk menuju tampilan M03
3. Klik link detail produk menuju tampilan M04
4. Klik tombol bantuan menuju tampilan M05
5. Klik tombol tentang kami menuju tampilan M06
6. Klik tombol kontak kami menuju tampilan M07
7. Klik link login menuju tampilan M01
Gambar 3-66 Tampilan Login Pelanggan
Antar muka beranda (M02)
Ini adalah tampilan menu beranda yang terdiri dari tampilan produk, menu, tombol login, dan tombol daftar.
Header
footer Beranda Produk Bantuan Tentang kami Kontak kami
Keranjang belanja slamat datang : ramdani | logout
Kategori -lemari -kursi -meja Layanan pembayaran Tranfer bank -no rekening - atas nama Internet payment - paypal
SELAMAT DATANG DI WEBSITE INDAH FURNITURE
Chat Yahoo Messenger
Produk terbaru Produk terlaris Produk banyak dilihat
Produk diskon M02
Detail produk Detail produk Detail produk
Detail produk
Nama produk/ harga Nama produk / harga Nama produk / harga
Data pesanan Data retur Data akun
Navigasi :
1. Klik tombol beranda menuju tampilan M02
2. Klik tombol produk menuju tampilan M03
3. Klik link detail produk menuju tampilan M04
4. Klik tombol bantuan menuju tampilan M05
5. Klik tombol tentang kami menuju tampilan M06
6. Klik tombol kontak kami menuju tampilan M07
7. Klik tombol data pesanan menuju tampilan M08
8. Klik tombol data retur menuju tampilan M09
9. Klik tombol data akun menuju tampilan M10
10. Klik tombol keranjang belanja menuju tampilan M11 11. Klik link login menuju tampilan
M01
Antar muka produk (M03)
Ini adalah tampilan menu produk yang terdiri dari produk yang dijual, tombol detail produk, dan cari data
Header
footer
Beranda Produk Bantuan Tentang kami Kontak kami
Keranjang belanja selamat datang : ramdani | logout
Kategori -lemari -kursi -meja Layanan pembayaran Tranfer bank -no rekening - atas nama Internet payment - paypal M03
Detail produk Detail produk
Detail produk Detail produk
Nama produk/ harga Nama produk / harga
Nama produk / harga Nama produk / harga
cari Data pesanan Data retur Data akun
Navigasi :
1. Klik tombol beranda menuju tampilan M02
2. Klik tombol produk menuju tampilan M03
3. Klik link detail produk menuju tampilan M04
4. Klik tombol bantuan menuju tampilan M05
5. Klik tombol tentang kami menuju tampilan M06
6. Klik tombol kontak kami menuju tampilan M07
7. Klik tombol data pesanan menuju tampilan M08
8. Klik tombol data retur menuju tampilan M09
9. Klik tombol data akun menuju tampilan M10
10. Klik tombol keranjang belanja menuju tampilan M11 11. Klik link login menuju tampilan
M01
Gambar 3-68 Tampilan Produk Antar muka detail produk (M04)
Ini adalah tampilan detail produk yang terdiri dari produk, tombol simpan keranjang dan kembali
Header
footer
Beranda Produk Bantuan Tentang kami Kontak kami
Keranjang belanja selamat datang : ramdani | logout
Kategori -lemari -kursi -meja Layanan pembayaran Tranfer bank -no rekening - atas nama Internet payment - paypal M04 Gambar produk Nama produk Kategori produk Diskon : % Stok : Harga : Rp Keterangan : Jumlah pesanan / qty :
Simpan kekeranjang belanja kembali
Data pesanan Data retur Data akun
Navigasi :
1. Klik tombol beranda menuju tampilan M02
2. Klik tombol produk menuju tampilan M03
3. Klik link detail produk menuju tampilan M04
4. Klik tombol bantuan menuju tampilan M05
5. Klik tombol tentang kami menuju tampilan M06
6. Klik tombol kontak kami menuju tampilan M07
7. Klik tombol data pesanan menuju tampilan M08
8. Klik tombol data retur menuju tampilan M09
9. Klik tombol data akun menuju tampilan M10
10. Klik tombol keranjang belanja menuju tampilan M11 11. Klik link login menuju tampilan
M01
12. Klik tombol kembali menuju tampilan M03
Antar muka bantuan (M05)
Ini adalah tampilan bantuan yang terdiri dari data bantuan cara berbelanja di website ini
Header
footer
Beranda Produk Bantuan Tentang kami Kontak kami
Keranjang belanja selamat datang : ramdani | logout Kategori -lemari -kursi -meja Layanan pembayaran Tranfer bank -no rekening - atas nama Internet payment - paypal M05 Bantuan
Data pesanan Data retur Data akun
Navigasi :
1. Klik tombol beranda menuju tampilan M02
2. Klik tombol produk menuju tampilan M03
3. Klik link detail produk menuju tampilan M04
4. Klik tombol bantuan menuju tampilan M05
5. Klik tombol tentang kami menuju tampilan M06
6. Klik tombol kontak kami menuju tampilan M07
7. Klik tombol data pesanan menuju tampilan M08
8. Klik tombol data retur menuju tampilan M09
9. Klik tombol data akun menuju tampilan M10
10. Klik tombol keranjang belanja menuju tampilan M11 11. Klik link login menuju tampilan
M01
Gambar 3-70 Tampilan Bantuan Antar muka tentang kami (M06)
Ini adalah tapilan tentang kami yang berisi data perusahaan dan produk yang dijual.
Header
footer
Beranda Produk Bantuan Tentang kami Kontak kami
Keranjang belanja selamat datang : ramdani | logout Kategori -lemari -kursi -meja Layanan pembayaran Tranfer bank -no rekening - atas nama Internet payment - paypal M06 Tentang kami
Data pesanan Data retur Data akun
Navigasi :
1. Klik tombol beranda menuju tampilan M02
2. Klik tombol produk menuju tampilan M03
3. Klik link detail produk menuju tampilan M04
4. Klik tombol bantuan menuju tampilan M05
5. Klik tombol tentang kami menuju tampilan M06
6. Klik tombol kontak kami menuju tampilan M07
7. Klik tombol data pesanan menuju tampilan M08
8. Klik tombol data retur menuju tampilan M09
9. Klik tombol data akun menuju tampilan M10
10. Klik tombol keranjang belanja menuju tampilan M11 11. Klik link login menuju tampilan
M01
Antar muka kontak kami (M07)
Ini adalah tampilan kontak kami yang berisi no telepon dan cara pembayaran
Header
footer
Beranda Produk Bantuan Tentang kami Kontak kami
Keranjang belanja selamat datang : ramdani | logout
Kategori -lemari -kursi -meja Layanan pembayaran Tranfer bank -no rekening - atas nama Internet payment - paypal M07 Kontak kami
Data pesanan Data retur Data akun
Navigasi :
1. Klik tombol beranda menuju tampilan M02
2. Klik tombol produk menuju tampilan M03
3. Klik link detail produk menuju tampilan M04
4. Klik tombol bantuan menuju tampilan M05
5. Klik tombol tentang kami menuju tampilan M06
6. Klik tombol kontak kami menuju tampilan M07
7. Klik tombol data pesanan menuju tampilan M08
8. Klik tombol data retur menuju tampilan M09
9. Klik tombol data akun menuju tampilan M10
10. Klik tombol keranjang belanja menuju tampilan M11 11. Klik link login menuju tampilan
M01
Gambar 3-72 Tampilan Kontak Kami Antar muka data pesanan (M08)
Header
footer
Beranda Produk Bantuan Tentang kami Kontak kami
Keranjang belanja selamat datang : ramdani | logout
Kategori -lemari -kursi -meja Layanan pembayaran Tranfer bank -no rekening - atas nama Internet payment - paypal M08 Data pesanan
Data pesanan Data retur Data akun
No. pesanan tanggal status pesanan status pembayaran status pengiriman total belanja aksi
√ Ξ X
No pesanan cari
Navigasi :
1. Klik tombol beranda menuju tampilan M02
2. Klik tombol produk menuju tampilan M03
3. Klik link detail produk menuju tampilan M04
4. Klik tombol bantuan menuju tampilan M05
5. Klik tombol tentang kami menuju tampilan M06
6. Klik tombol kontak kami menuju tampilan M07
7. Klik tombol data pesanan menuju tampilan M08
8. Klik tombol data retur menuju tampilan M09
9. Klik tombol data akun menuju tampilan M10
10. Klik tombol keranjang belanja menuju tampilan M11 11. Klik link login menuju tampilan
M01
12. Klik tombol √ menuju tampilan M
13. Klik tombol Ξ menuju tampilan M 14. Klik tombol X untuk menghapus
data pesanan
Antar muka data keranjang belanja (M11)
Ini adalah tampilan keranjang belanja yang terdiri dari data produk yang dibeli, tombol checkout dan tombol kembali
Header
footer
Produk Bantuan Tentang kami Kontak kami
Keranjang belanja selamat datang : ramdani | logout Kategori -lemari -kursi -meja Layanan pembayaran Tranfer bank -no rekening - atas nama Internet payment - paypal M09 Keranjang belanja
Data pesanan Data retur Data akun
Nama produk hapus diskon qty harga total
hapus update
Belanja lagi checkout
Navigasi :
1. Klik tombol beranda menuju tampilan M02
2. Klik tombol produk menuju tampilan M03
3. Klik link detail produk menuju tampilan M04
4. Klik tombol bantuan menuju tampilan M05
5. Klik tombol tentang kami menuju tampilan M06
6. Klik tombol kontak kami menuju tampilan M07
7. Klik tombol data pesanan menuju tampilan M08
8. Klik tombol data retur menuju tampilan M09
9. Klik tombol data akun menuju tampilan M10
10. Klik tombol keranjang belanja menuju tampilan M11 11. Klik link login menuju tampilan
M01
12. Klik tombol belanja lagi menuju tampilan M04
13. Klick tombol check out menuju tampilan M12
Gambar 3-74 Tampilan Data Keranjang Belanja Antar muka data checkout (M12)
Ini adalah tampilan checkout yang terdir dari data alamat pelanggan, tombol kembali, dan tombol konfirmasi pembelian
Header
footer
Produk Bantuan Tentang kami Kontak kami
Keranjang belanja selamat datang : ramdani | logout Kategori -lemari -kursi -meja Layanan pembayaran Tranfer bank -no rekening - atas nama Internet payment - paypal M12 Data pengiriman
Data pesanan Data retur Data akun
Kembali checkout Data pengiriman Alamat tujuan : Nama penerima : Alamat : Provinsi : Kabupaten / kota : Kode pos : No telp / hp : Keterangan : ……. Navigasi :
1. Klik tombol beranda menuju tampilan M02
2. Klik tombol produk menuju tampilan M03
3. Klik link detail produk menuju tampilan M04
4. Klik tombol bantuan menuju tampilan M05
5. Klik tombol tentang kami menuju tampilan M06
6. Klik tombol kontak kami menuju tampilan M07
7. Klik tombol data pesanan menuju tampilan M08
8. Klik tombol data retur menuju tampilan M09
9. Klik tombol data akun menuju tampilan M10
10. Klik tombol keranjang belanja menuju tampilan M11 11. Klik link login menuju tampilan
M01
12. Klik tombol kembali menuju tampilan M11
13.
14. Klick tombol check out menuju tampilan M13
Antar muka data selesai belanja (M13)
Ini adalah tampilan jika sudah selesai ber belanja
Header
footer
Produk Bantuan Tentang kami Kontak kami
Keranjang belanja selamat datang : ramdani | logout Kategori -lemari -kursi -meja Layanan pembayaran Tranfer bank -no rekening - atas nama Internet payment - paypal M13 selesai
Data pesanan Data retur Data akun
Terimakasi telah melakukan pemesanan
Pesanan sudah kami terima, silahkan periksa email anda kami telah mengirimkan data pesanan ke email anda. Untuk melakukan pembayaran silahkan tunggu 1x24 jam dengan syarat sudah melakukan negoisasi ongkos kirim dengan pihak kami. Setelah 1x24jam pelanggan dapat melakukan pembayaran dengan cara klik tombol "DATA PESANAN" yang ada di menu bagian atas
Navigasi :
1. Klik tombol beranda menuju tampilan M02
2. Klik tombol produk menuju tampilan M03
3. Klik link detail produk menuju tampilan M04
4. Klik tombol bantuan menuju tampilan M05
5. Klik tombol tentang kami menuju tampilan M06
6. Klik tombol kontak kami menuju tampilan M07
7. Klik tombol data pesanan menuju tampilan M08
8. Klik tombol data retur menuju tampilan M09
9. Klik tombol data akun menuju tampilan M10
10. Klik tombol keranjang belanja menuju tampilan M11 11. Klik link login menuju tampilan
M01
12. Klik tombol kembali menuju tampilan M11
13.
14. Klick tombol check out menuju tampilan M13