9. Perancangan Antar Muka Keranjang Belanja Member
HEADER Kurs
Keranjang belanja
T18 Keterangan :
· Klik Home menuju T10
· Klik Semua Produk menuju T11
· Klik Cara Pembelian menuju T12
· Klik Pembayaran dan Pengiriman
menuju T13 ·
Klik Tentang Kami menuju T14 ·
Klik Pencarian menuju T15 ·
Klik Kategori menuju T16 ·
Klik Detail Produk menuju T17 ·
Klik Order menuju T18 jika order valid, jika jenis bahan
kosong menuju M07, jika stok kosong menuju M08, jika stok tidak
mencukupi menuju M09
FOOTER Kategori
Pencarian
Produk Terlaris Produk Paling banyak dilihat
Payment Customer Service
Akun Dan Pesanan Saya
Ganti Password Akun Saya
Pesanan Saya Retur Pesanan
Home Semua Produk
Cara Pembelian Pembayaran dan Pengiriman
Tentang Kami Tanggal | Selamat Datang, Member
Keranjang Belanja
logout
Keterangan; - Jika ada perubahan jumlah pembelian barang, dapat diubah di
kolom Qty. Lalu klik tombol Update untuk menyimpan perubahan. - Jika sudah selesai memilih barang yang di beli. Silahkan klik
tombol Check Out. Checkout
Update No
Produk Qty
Harga Berat
Diskon Subtotal
1 xxxx
[ ] Rp.xx
xx Xx
xx xxx
Total Keterangan :
Kembali Belanja
Gambar 3. 88 Perancangan Antar Muka Keranjang Belanja Member
10. Perancangan Antar Muka Alamat Pengiriman Member
HEADER Kurs
Alamat Pengiriman
T19 Keterangan :
· Klik Home menuju T10
· Klik Semua Produk menuju T11
· Klik Cara Pembelian menuju T12
· Klik Pembayaran dan Pengiriman
menuju T13 ·
Klik Tentang Kami menuju T14 ·
Klik Pencarian menuju T15 ·
Klik Kategori menuju T16 ·
Klik Detail Produk menuju T17 ·
Klik Order menuju T18 jika order valid, jika jenis bahan
kosong menuju M07, jika stok kosong menuju M08, jika stok tidak
mencukupi menuju M09
FOOTER Kategori
Pencarian
Produk Terlaris Produk Paling banyak dilihat
Payment Customer Service
Akun Dan Pesanan Saya
Ganti Password Akun Saya
Pesanan Saya Retur Pesanan
Home Semua Produk
Cara Pembelian Pembayaran dan Pengiriman
Tentang Kami Tanggal | Selamat Datang, Member
Keranjang Belanja
logout
Teruskan Kembali
Alamat Sendiri Alamat Lain
Isi Alamat
Gambar 3. 89 Perancangan Antar Muka Alamat Pengiriman Member
11. Perancangan Antar Muka Review Pemesanan Member
HEADER Kurs
Review pesanan
T20 Keterangan :
· Klik Home menuju T10
· Klik Semua Produk menuju T11
· Klik Cara Pembelian menuju T12
· Klik Pembayaran dan Pengiriman
menuju T13 ·
Klik Tentang Kami menuju T14 ·
Klik Pencarian menuju T15 ·
Klik Kategori menuju T16 ·
Klik Detail Produk menuju T17 ·
Klik Order menuju T18 jika order valid, jika jenis bahan
kosong menuju M07, jika stok kosong menuju M08, jika stok tidak
mencukupi menuju M09
FOOTER Kategori
Pencarian
Produk Terlaris Produk Paling banyak dilihat
Payment Customer Service
Akun Dan Pesanan Saya
Ganti Password Akun Saya
Pesanan Saya Retur Pesanan
Home Semua Produk
Cara Pembelian Pembayaran dan Pengiriman
Tentang Kami Tanggal | Selamat Datang, Member
Keranjang Belanja
logout
Aturan Bisnis : Kembali
Selesai No
Produk Qty
Harga Berat
Diskon Subtotal
1 xxxx
[ ] Rp.xx
xx Xx
xx xxx
Biaya pengiriman dan penanganan Keterangan :
xxx Total
Alamat Pengiriman : Nama penerima
xxx Alamat
xxx Kodepos
xxx Provinsi
xxx Kota
xxx Telepon
xxx Jasa pengiriman :
Jne - jenis
Gambar 3. 90 Perancangan Antar Muka Review Pemesanan Member
12. Perancangan Antar Muka Detail Pesanan Member
HEADER Kurs
Pesanan Anda
T21 Keterangan :
· Klik Home menuju T10
· Klik Semua Produk menuju T11
· Klik Cara Pembelian menuju T12
· Klik Pembayaran dan Pengiriman
menuju T13 ·
Klik Tentang Kami menuju T14 ·
Klik Pencarian menuju T15 ·
Klik Kategori menuju T16 ·
Klik Detail Produk menuju T17 ·
Klik Order menuju T18 jika order valid, jika jenis bahan
kosong menuju M07, jika stok kosong menuju M08, jika stok tidak
mencukupi menuju M09
FOOTER Kategori
Pencarian
Produk Terlaris Produk Paling banyak dilihat
Payment Customer Service
Akun Dan Pesanan Saya
Ganti Password Akun Saya
Pesanan Saya Retur Pesanan
Home Semua Produk
Cara Pembelian Pembayaran dan Pengiriman
Tentang Kami Tanggal | Selamat Datang, Member
Keranjang Belanja
logout
Konfirmasi pembayaran via bank ;
Kembali Keterangan :
Alamat Pengiriman : Nama penerima
xxx Alamat
xxx Kodepos
xxx Provinsi
xxx Kota
xxx Telepon
xxx Deskripsi pemesanan….
No Produk
Qty Harga
Berat Diskon
Subtotal 1
xxxx [ ]
Rp.xx xx
Xx xx
xxx Biaya pengiriman dan penanganan
xxx Total
Detail Pesanan
Nomer pesanan : xxx
Total Pembayaran : Rp.xxxxx
Atas Nama :
Jumlah pembayaran :
Tanggal Pembayaran :
Konfirmasi PayPal
Gambar 3. 91 Perancangan Antar Muka Detail Pesanan Member
3.2.5.4 Perancangan Antar Muka Pengunjung
1. Perancangan Antar MukaHome Pengunjung
HEADER Kurs
Produk Terbaru
Sedang Diskon
Produk Terlaris
PN01 Keterangan :
· Klik Home menuju PN01
· Klik Semua Produk menuju PN02
· Klik Cara Pembelian menuju PN03
· Klik Pembayaran dan Pengiriman
menuju PN04 ·
Klik Tentang Kami menuju PN05 ·
Klik Pencarian menuju PN06 ·
Klik Kategori menuju PN07 ·
Klik Detail Produk menuju PN08 ·
Klik Lupa Password menuju PN09 ·
Klik Daftar menuju PN10 ·
Klik Detail menuju PN11
FOOTER Kategori
Pencarian
Produk Terlaris Produk Paling banyak dilihat
Payment Home
Semua Produk Cara Pembelian
Pembayaran dan Pengiriman Tentang Kami
Login | Daftar Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Tanggal
Login Email
Password Daftar
Lupa Password |
Gambar 3. 92 Perancangan Antar Muka Home Pengunjung
2. Perancangan Antar Muka Semua Produk Pengunjung
HEADER Kurs
Semua Produk
PN02
Keterangan :
· Klik Home menuju PN01
· Klik Semua Produk menuju PN02
· Klik Cara Pembelian menuju PN03
· Klik Pembayaran dan Pengiriman
menuju PN04 ·
Klik Tentang Kami menuju PN05 ·
Klik Pencarian menuju PN06 ·
Klik Kategori menuju PN07 ·
Klik Detail Produk menuju PN08 ·
Klik Lupa Password menuju PN09 ·
Klik Daftar menuju PN10 ·
Klik Detail menuju PN11
FOOTER Kategori
Pencarian
Produk Terlaris Produk Paling banyak dilihat
Payment Home
Semua Produk Cara Pembelian
Pembayaran dan Pengiriman Tentang Kami
Login | Daftar Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Tanggal
Login
Email Password
Daftar Lupa Password |
Gambar 3. 93 Perancangan Antar Muka Semua Produk Pengunjung
3. Perancangan Antar Muka Cara Pembelian Pengunjung
HEADER Kurs
· Dafarkan diri Anda di darmacom.com. Jangan lupa isi data diri Anda
dengan benar ·
Login ke Account Anda di darmacom.com ·
Pilih produk yang ingin Anda beli. ·
Jika telah selesai memilih produk yang dibeli, lihat keranjang belanja untuk mengetahui total yang harus di bayar.
· Anda bisa melakukan perubahan jumlah barang yang dibeli, dengan
mengisi perubahan pada form jumlah dan kemudian klik Update. ·
Jika sudah yakin dengan produk yang Anda pesan klik tombol Checkout ·
Kemudian dilanjutkan dengan pengisian alamat pengiriman. jika sudah benar klik tombol Next
· Lalu akan tampil data review pesanan, total keseluruhan pembayaran.
· Masuk ke riwayat pesanan dan Konfirmasi pembayaran atau Klik tombol
PayPal Click here to pay jika anda ingin membayar menggunakan PayPal.
Cara Pembelian
PN03 Keterangan :
· Klik Home menuju PN01
· Klik Semua Produk menuju PN02
· Klik Cara Pembelian menuju PN03
· Klik Pembayaran dan Pengiriman
menuju PN04 ·
Klik Tentang Kami menuju PN05 ·
Klik Pencarian menuju PN06 ·
Klik Kategori menuju PN07 ·
Klik Detail Produk menuju PN08 ·
Klik Lupa Password menuju PN09 ·
Klik Daftar menuju PN10 ·
Klik Detail menuju PN11
FOOTER Kategori
Pencarian
Produk Terlaris Produk Paling banyak dilihat
Payment Home
Semua Produk Cara Pembelian
Pembayaran dan Pengiriman Tentang Kami
Login | Daftar Tanggal
Login Email
Password Daftar
Lupa Password |
Gambar 3. 94 Perancangan Antar Muka Cara Pembelian Pengunjung
4. Perancangan Antar Muka Pembayaran dan Pengiriman Pengunjung
HEADER Kurs
Deskripsi cara pembayaran dan pengiriman
Pembayaran dan Pengiriman
PN04 Keterangan :
· Klik Home menuju PN01
· Klik Semua Produk menuju PN02
· Klik Cara Pembelian menuju PN03
· Klik Pembayaran dan Pengiriman
menuju PN04 ·
Klik Tentang Kami menuju PN05 ·
Klik Pencarian menuju PN06 ·
Klik Kategori menuju PN07 ·
Klik Detail Produk menuju PN08 ·
Klik Lupa Password menuju PN09 ·
Klik Daftar menuju PN10 ·
Klik Detail menuju PN11
FOOTER Kategori
Pencarian
Produk Terlaris Produk Paling banyak dilihat
Payment Home
Semua Produk Cara Pembelian
Pembayaran dan Pengiriman Tentang Kami
Login | Daftar Tanggal
Login
Email Password
Daftar Lupa Password |
Gambar 3. 95 Perancangan Antar Muka Pembayaran dan Pengiriman Pengunjung
5. Perancangan Antar Muka Tentang Kami Pengunjung
HEADER Kurs
Deskripsi Tentang Kami
Tentang Kami
PN05 Keterangan :
· Klik Home menuju PN01
· Klik Semua Produk menuju PN02
· Klik Cara Pembelian menuju PN03
· Klik Pembayaran dan Pengiriman
menuju PN04 ·
Klik Tentang Kami menuju PN05 ·
Klik Pencarian menuju PN06 ·
Klik Kategori menuju PN07 ·
Klik Detail Produk menuju PN08 ·
Klik Lupa Password menuju PN09 ·
Klik Daftar menuju PN10 ·
Klik Detail menuju PN11
FOOTER Kategori
Pencarian
Produk Terlaris Produk Paling banyak dilihat
Payment Home
Semua Produk Cara Pembelian
Pembayaran dan Pengiriman Tentang Kami
Login | Daftar Tanggal
Login
Email Password
Daftar Lupa Password |
Gambar 3. 96 Perancangan Antar Muka Tentang KamiPengunjung
6. Perancangan Antar Muka Pencarian Produk Pengunjung
HEADER Kurs
Pencarian Produk
PN06 Keterangan :
· Klik Home menuju PN01
· Klik Semua Produk menuju PN02
· Klik Cara Pembelian menuju PN03
· Klik Pembayaran dan Pengiriman
menuju PN04 ·
Klik Tentang Kami menuju PN05 ·
Klik Pencarian menuju PN06 ·
Klik Kategori menuju PN07 ·
Klik Detail Produk menuju PN08 ·
Klik Lupa Password menuju PN09 ·
Klik Daftar menuju PN10 ·
Klik Detail menuju PN11
FOOTER Kategori
Pencarian
Produk Terlaris Produk Paling banyak dilihat
Payment Home
Semua Produk Cara Pembelian
Pembayaran dan Pengiriman Tentang Kami
Login | Daftar Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Gambar
Nama Produk Harga Produk
Detail Tanggal
Login Email
Password Daftar
Lupa Password |
Gambar 3. 97 Perancangan Antar Muka Pencarian Produk Pengunjung
7. Perancangan Antar Muka Kategori Produk Pengunjung
