Perancangan Antar Muka Pengunjung

3.5.4 Perancangan Antar Muka Pengunjung

1. Perancangan Antamuka Beranda

Berikut dapat dilihat perancangan antar muka beranda dari pembangunan aplikasi e-commerce di toko dbeauty shop yang tercantum pada gambar 3.36 dibawah ini: F01 Gambar Header Beranda | Hubungi Kami | Cara Pemesanan | Cara Pembayaran | Beranda © 2011 Dbeauty Shop Oriflame Swedish Cosmetics Produk Terbaru Gambar Keterangan Detail Gambar Keterangan Gambar Keterangan Gambar Keterangan Gambar Keterangan Gambar Keterangan Produk Terbanyak dilihat Gambar Keterangan Gambar Keterangan Gambar Keterangan Folow us : facebook Gambar Keterangan Gambar Keterangan Gambar Keterangan Keranjang Belanja Pencarian Cari Item Keterangan Lihat keranjang belanja JNE Tracking Masukan Nomor Airwaybill JNE : Cari Gambar JNE Contact Sales Kami Siap Melayani Anda Kami menerima Gambar Gambar Kategori produk Nama Produk Nama Produk Selamat Datang | Daftar | Masuk Detail Detail Detail Detail Detail Detail Detail Detail Detail Detail Detail Produk Terlaris Gambar Klik Beranda Menuju F01 Klik Hubungi Kami Menuju F02 Klik Cara Pemesanan Menuju F03 Klik Cara Pembayaran Menuju F04 Klik Daftar Menuju F05 Klik Login Menuju F06 Klik Keranjang Belanja Menuju F07 Klik Cari Menuju F08 Lupa Password Menuju F09 Klik Detail Menuju F10 Gambar 3.36 Perancangan Antarmuka Beranda

2. Perancangan Antarmuka Hubungi Kami

Berikut dapat dilihat perancangan antarmuka hubungi kami dari pembangunan aplikasi e-commerce di toko dbeauty shop yang tercantum pada gambar 3.42 dibawah ini: F02 Gambar Header Beranda | Hubungi Kami | Cara Pemesanan | Cara Pembayaran | Hubungi Kami © 2011 Dbeauty Shop Oriflame Swedish Cosmetics Folow us : facebook Keranjang Belanja Pencarian Cari Item Keterangan Lihat keranjang belanja JNE Tracking Masukan Nomor Airwaybill JNE : Cari Gambar JNE Contact Sales Kami Siap Melayani Anda Kami menerima Gambar Gambar Kategori produk Nama Produk Nama Produk Selamat Datang | Daftar | Masuk Gambar Nama Pesan kirim Email Telepon Hubungi Kami Beranda Klik Beranda Menuju F01 Klik Hubungi Kami Menuju F02 Klik Cara Pemesanan Menuju F03 Klik Cara Pembayaran Menuju F04 Klik Daftar Menuju F05 Klik Login Menuju F06 Klik Keranjang Belanja Menuju F07 Klik Cari Menuju F08 Lupa Password Menuju F09 Klik Detail Menuju F10 Gambar 3.37 Perancangan Antarmuka Hubungi Kami

3. Perancangan Antarmuka Cara Pemesanan

Berikut dapat dilihat perancangan antarmuka cara pemesanan dari pembangunan aplikasi e-commerce di toko dbeauty shop yang tercantum pada gambar 3.43 dibawah ini: F03 Gambar Header Beranda | Hubungi Kami | Cara Pemesanan | Cara Pembayaran | Cara Pemesanan © 2011 Dbeauty Shop Oriflame Swedish Cosmetics Folow us : facebook Keranjang Belanja Pencarian Cari Item Keterangan Lihat keranjang belanja JNE Tracking Masukan Nomor Airwaybill JNE : Cari Gambar JNE Contact Sales Kami Siap Melayani Anda Kami menerima Gambar Gambar Kategori produk Nama Produk Nama Produk Selamat Datang | Daftar | Masuk Gambar Beranda Text Cara Pemesanan Klik Beranda Menuju F01 Klik Hubungi Kami Menuju F02 Klik Cara Pemesanan Menuju F03 Klik Cara Pembayaran Menuju F04 Klik Daftar Menuju F05 Klik Login Menuju F06 Klik Keranjang Belanja Menuju F07 Klik Cari Menuju F08 Lupa Password Menuju F09 Klik Detail Menuju F10 Gambar 3.38 perancangan Antarmuka Cara Pemesanan Retur

4. Perancangan Antarmuka Cara Pembayaran

Berikut dapat dilihat perancangan antarmuka cara pembayaran dari pembangunan aplikasi e-commerce di toko dbeauty shop yang tercantum pada gambar 3.39 dibawah ini: F04 Gambar Header Beranda | Hubungi Kami | Cara Pemesanan | Cara Pembayaran | Cara Pembayaran © 2011 Dbeauty Shop Oriflame Swedish Cosmetics Folow us : facebook Keranjang Belanja Pencarian Cari Item Keterangan Lihat keranjang belanja JNE Tracking Masukan Nomor Airwaybill JNE : Cari Gambar JNE Contact Sales Kami Siap Melayani Anda Kami menerima Gambar Gambar Kategori produk Nama Produk Nama Produk Selamat Datang | Daftar | Masuk Gambar Beranda Text Cara Pembayaran Klik Beranda Menuju F01 Klik Hubungi Kami Menuju F02 Klik Cara Pemesanan Menuju F03 Klik Cara Pembayaran Menuju F04 Klik Daftar Menuju F05 Klik Login Menuju F06 Klik Keranjang Belanja Menuju F07 Klik Cari Menuju F08 Lupa Password Menuju F09 Klik Detail Menuju F10 Gambar 3.39 Perancangan Antarmuka Cara Pembayaran

5. Perancangan Antarmuka Daftar

Berikut dapat dilihat perancangan antarmuka daftar dari pembangunan aplikasi e-commerce di toko dbeauty shop yang tercantum pada gambar 3.40 dibawah ini: F05 Gambar Header Beranda | Hubungi Kami | Cara Pemesanan | Cara Pembayaran | Daftar © 2011 Dbeauty Shop Oriflame Swedish Cosmetics Folow us : facebook Keranjang Belanja Pencarian Cari Item Keterangan Lihat keranjang belanja JNE Tracking Masukan Nomor Airwaybill JNE : Cari Gambar JNE Contact Sales Kami Siap Melayani Anda Kami menerima Gambar Gambar Kategori produk Nama Produk Nama Produk Selamat Datang | Daftar | Masuk Gambar Beranda From Daftar Member Daftar Nama Email Password Konfirmasi Password Provinsi Kota Alamat Telepon Kode Pos Nama Lengkap Alamat Tempat Tinggal Nomor Telpon Email dan Password Klik Beranda Menuju F01 Klik Hubungi Kami Menuju F02 Klik Cara Pemesanan Menuju F03 Klik Cara Pembayaran Menuju F04 Klik Daftar Menuju F05 Klik Login Menuju F06 Klik Keranjang Belanja Menuju F07 Klik Cari Menuju F08 Lupa Password Menuju F09 Klik Detail Menuju F10 Gambar 3.40 Perancangan Antarmuka Daftar

6. Perancangan Antarmuka Login

Berikut dapat dilihat perancangan antarmuka login dari pembangunan aplikasi e-commerce di toko dbeauty shop yang tercantum pada gambar 3.41 dibawah ini: F06 Gambar Header Beranda | Hubungi Kami | Cara Pemesanan | Cara Pembayaran | Login © 2011 Dbeauty Shop Oriflame Swedish Cosmetics Folow us : facebook Keranjang Belanja Pencarian Cari Item Keterangan Lihat keranjang belanja JNE Tracking Masukan Nomor Airwaybill JNE : Cari Gambar JNE Contact Sales Kami Siap Melayani Anda Kami menerima Gambar Gambar Kategori produk Nama Produk Nama Produk Selamat Datang | Daftar | Masuk Gambar Beranda Login Member Lupa Password? Masuk Email Password Klik Beranda Menuju F01 Klik Hubungi Kami Menuju F02 Klik Cara Pemesanan Menuju F03 Klik Cara Pembayaran Menuju F04 Klik Daftar Menuju F05 Klik Login Menuju F06 Klik Keranjang Belanja Menuju F07 Klik Cari Menuju F08 Lupa Password Menuju F09 Klik Detail Menuju F10 Gambar 3.41 Perancangan Antarmuka Login

7. Perancangan Antarmuka Keranjang Belanja

Berikut dapat dilihat perancangan antarmuka keranjang belanja dari pembangunan aplikasi e-commerce di toko dbeauty shop yang tercantum pada gambar 3.42 dibawah ini: F07 Gambar Header Beranda | Hubungi Kami | Cara Pemesanan | Cara Pembayaran | Keranjang © 2011 Dbeauty Shop Oriflame Swedish Cosmetics Folow us : facebook Keranjang Belanja Pencarian Cari Item Keterangan Lihat keranjang belanja JNE Tracking Masukan Nomor Airwaybill JNE : Cari Gambar JNE Contact Sales Kami Siap Melayani Anda Kami menerima Gambar Gambar Kategori produk Nama Produk Nama Produk Selamat Datang | Daftar | Masuk Gambar Beranda Keranjang Belanja Nama Produk Harga Jumlah Berat Diskon Stok Sub Total Hapus Klik Beranda Menuju F01 Klik Hubungi Kami Menuju F02 Klik Cara Pemesanan Menuju F03 Klik Cara Pembayaran Menuju F04 Klik Daftar Menuju F05 Klik Login Menuju F06 Klik Keranjang Belanja Menuju F07 Klik Cari Menuju F08 Lupa Password Menuju F09 Klik Detail Menuju F10 Gambar 3.42 Perancangan Antarmuka Keranjang Belanja

8. Perancangan Antarmuka Cari

Berikut dapat dilihat perancangan antarmuka cari dari pembangunan aplikasi e-commerce di toko dbeauty shop yang tercantum pada gambar 3.43 dibawah ini: F08 Gambar Header Beranda | Hubungi Kami | Cara Pemesanan | Cara Pembayaran | Cari © 2011 Dbeauty Shop Oriflame Swedish Cosmetics Folow us : facebook Keranjang Belanja Pencarian Cari Item Keterangan Lihat keranjang belanja JNE Tracking Masukan Nomor Airwaybill JNE : Cari Gambar JNE Contact Sales Kami Siap Melayani Anda Kami menerima Gambar Gambar Kategori produk Nama Produk Nama Produk Selamat Datang | Daftar | Masuk Gambar Beranda Hasil Pencarian = nama barang Gambar Keterangan Detail Gambar Keterangan Detail Gambar Keterangan Detail Gambar Keterangan Detail Gambar Keterangan Detail Gambar Keterangan Detail Gambar Keterangan Detail Gambar Keterangan Detail Gambar Keterangan Detail Klik Beranda Menuju F01 Klik Hubungi Kami Menuju F02 Klik Cara Pemesanan Menuju F03 Klik Cara Pembayaran Menuju F04 Klik Daftar Menuju F05 Klik Login Menuju F06 Klik Keranjang Belanja Menuju F07 Klik Cari Menuju F08 Lupa Password Menuju F09 Klik Detail Menuju F10 Gambar 3.43 Perancangan Antarmuka Cari

9. Perancangan Antarmuka Lupa Password

Berikut dapat dilihat perancangan antarmuka lupa Password dari pembangunan aplikasi e-commerce di toko dbeauty shop yang tercantum pada gambar 3.44 dibawah ini: F09 Gambar Header Beranda | Hubungi Kami | Cara Pemesanan | Cara Pembayaran | Lupa Password © 2011 Dbeauty Shop Oriflame Swedish Cosmetics Klik Beranda Menuju F01 Klik Hubungi Kami Menuju F02 Klik Cara Pemesanan Menuju F03 Klik Cara Pembayaran Menuju F04 Klik Daftar Menuju F05 Klik Login Menuju F06 Klik Keranjang Belanja Menuju F07 Klik Cari Menuju F08 Lupa Password Menuju F09 Klik Detail Menuju F10 Folow us : facebook Keranjang Belanja Pencarian Cari Item Keterangan Lihat keranjang belanja JNE Tracking Masukan Nomor Airwaybill JNE : Cari Gambar JNE Contact Sales Kami Siap Melayani Anda Kami menerima Gambar Gambar Kategori produk Nama Produk Nama Produk Selamat Datang | Daftar | Masuk Gambar Beranda Lupa Password Email Reset Password Gambar 3.44 Perancangan Antarmuka Lupa Password

10. Perancangan Antarmuka Detail Produk

Berikut dapat dilihat perancangan antarmuka detail Produk dari pembangunan aplikasi e-commerce di toko dbeauty shop yang tercantum pada gambar 3.45 dibawah ini: F10 Gambar Header Beranda | Hubungi Kami | Cara Pemesanan | Cara Pembayaran | Lupa Password © 2011 Dbeauty Shop Oriflame Swedish Cosmetics Klik Beranda Menuju F01 Klik Hubungi Kami Menuju F02 Klik Cara Pemesanan Menuju F03 Klik Cara Pembayaran Menuju F04 Klik Daftar Menuju F05 Klik Login Menuju F06 Klik Keranjang Belanja Menuju F07 Klik Cari Menuju F08 Lupa Password Menuju F09 Klik Detail Menuju F10 Folow us : facebook Keranjang Belanja Pencarian Cari Item Keterangan Lihat keranjang belanja JNE Tracking Masukan Nomor Airwaybill JNE : Cari Gambar JNE Contact Sales Kami Siap Melayani Anda Kami menerima Gambar Gambar Kategori produk Nama Produk Nama Produk Selamat Datang | Daftar | Masuk Gambar Beranda Jenis - katagori Gambar Qty: Add to chart Keterangan : Share : Facebook, Twitter Kategori Nama Produk berat Diskon stok Share : Facebook, Twitter Keterangan Produk Terbaru Gambar Keterangan Detail Gambar Keterangan Gambar Keterangan Detail Detail Gambar 3.45 Perancangan Antarmuka Detail Produk

3.5.5 Perancangan Antarmuka Member