Perancangan Arsitektur - Struktur Menu

ANALISIS DAN PERANCANGAN SISTEM

6.1 Pengolahan data

3.3. Struktur Menu

3.3.1. Perancangan Arsitektur

Perancangan arsitektur merupakan perancangan yang dibuat sebelum program aplikasi dibuat. Dengan perancangan arsitektur akan mempermudah proses pembangunan aplikasi E-Commerce Toko Catalaya Boutique & Gallery. 3.3.2. Perancangan Antar Muka

Interface atau antar muka merupakan tampilan dari sutau program

aplikasi yang berperan sebagai media komunikasi yang digunakan sebagai sarana untuk berinteraksi antara program dengan user. Sistem yang akan dibangun diharapkan menyediakan interface yang mudah dipahami dan digunakan oleh

user.

Perancangan interface untuk aplikasi E-Commerce Toko Catalaya Boutique & Gallery adalah sebagai berikut :

1. Antar muka pengunjung a. Form Beranda Pengunjung

Detail Detail Detail

Gambar Gambar

KATEGORI

H01

PRODUK 1 PRODUK 2

Gambar

Detail Detail Detail

Gambar Gambar

Gambar

Detail Detail Detail

Gambar Gambar Gambar LOGO JNE JNE TRACKING SEARCH

JNE Anybill Number :

INFORMASI PEMBAYARAN Item

Total RP. ,- DAFTAR PRODUK

PRODUK 3

Gambar 3.35. Form Beranda Pengunjung / Member

PENDAFTARAN MEMBER

H02

BUAT AKUN BARU

Password Konfirmasi Password

Alamat

Propinsi -- Pilih Propinsi ---- Pilih Propinsi -- Kabupaten/Kota -- Pilih Kabupaten/Kota ---- Pilih Kabupaten/Kota --

Kode Pos No. Telepon Kode Capcha Kode Capcha Masukan Kode Nama Depan

Nama Belakang

*Kolom Wajib Diisi

Gambar 3.36. Form Pendaftaran Member

2. Antar muka Member

a. Form Login Member

H03 Masuk EMAIL : PASSWORD : HALAMAN LOGIN Lupa Password ?

JIKA ANDA MEMILIKI ACCOUNT MEMBER DENGAN KAMI, SILAHKAN LOGIN.

Gambar 3.37. Form Login Member

Detail Detail Detail

Gambar Gambar

KATEGORI

H04

PRODUK 1 PRODUK 2 Gambar

Detail Detail Detail

Gambar Gambar

Gambar

Detail Detail Detail

Gambar Gambar Gambar LOGO JNE JNE TRACKING SEARCH

JNE Anybill Number :

INFORMASI PEMBAYARAN

Item Total RP. ,-

DAFTAR PRODUK

PRODUK 3

Gambar 3.38 Form Katalog Produk

c. Form Keranjang Belanja

INFORMASI PRODUK

H05

TOTAL

Item Total RP. ,-

GAMBAR

INFO PRODUK PILIH PEMESANAN

Kode Produk : Nama Produk : Warna : Berat : Harga : Stok : Ukuran : Jumlah : Tambah Pemesanan

d. Form Pengaturan Akun Member

UBAH AKUN LOGIN

H06

LOGO JNE

JNE TRACKING

SEARCH JNE Anybill Number :

INFORMASI PEMBAYARAN Item Total RP. ,- Password Lama Alamat Email Password Baru Confirm Password SIMPAN PASSWORD

Ubah Akun Login Ubah Alamat Pengguna

MENU MEMBER

Konfirmasi Pembayaran Riwayat Pemesanan Riwayat Retur Pemesanan

Gambar 3.40. Form Pengaturan Akun Member

e. Form Konfirmasi Pembayaran

KONFIRMASI PEMBAYARAN

H07

LOGO JNE JNE TRACKING

SEARCH JNE Anybill Number :

INFORMASI PEMBAYARAN

Item Total RP. ,-

Order ID _{Ubah Akun Login}

Ubah Alamat Pengguna MENU MEMBER

Konfirmasi Pembayaran Riwayat Pemesanan Riwayat Retur Pemesanan Jumlah Pembayaran Number Bukti Transfer Tanggal Pembayaran Dari Pembayaran Atas Nama Tujuan Pembayaran Simpan Konfirmasi Pembayaran

Gambar 3.41. Form Konfirmasi Pembayaran

f. Form Riwayat Pemesanan

RIWAYAT PEMESANAN

H08

LOGO JNE

JNE TRACKING

JNE Anybill Number :

INFORMASI PEMBAYARAN Item

Total RP. ,- Ubah Akun Login Ubah Alamat Pengguna

MENU MEMBER

Konfirmasi Pembayaran Riwayat Pemesanan Riwayat Retur Pemesanan

Order ID Tanggal Transaksi Biaya Status

Rp.

Gambar 3.42. Form Riwayat Pemesanan

g. Form Retur Pemesanan

PENGAJUAN RETUR PEMESANAN

H09

Jenis Pengiriman : Tanggal Transaksi :

INFORMASI PEMBAYARAN

Item Total RP. ,-

Ubah Akun Login Ubah Alamat Pengguna

MENU MEMBER

Konfirmasi Pembayaran Riwayat Pemesanan Riwayat Retur Pemesanan

Nama Produk Jumlah Retur Alasan Retur Barang

Alamat Pemesan Alamat Pengiriman Informasi Pemesanan

Pengajuan Retur Pemesanan Kembali

Gambar 3.43. Form Retur Pemesanan

h. Form Riwayat Retur Pemesanan

RIWAYAT RETUR PEMESANAN

H010

LOGO JNE

JNE TRACKING

JNE Anybill Number :

INFORMASI PEMBAYARAN

Item Total RP. ,-

Ubah Akun Login Ubah Alamat Pengguna

MENU MEMBER

Konfirmasi Pembayaran Riwayat Pemesanan Riwayat Retur Pemesanan

Order ID Tanggal Transaksi Order ID Status No

Gambar 3.44. Form Riwayat Retur Pemesanan

3. Antar Muka Admin a. Form Login Admin

Username atau E-Mail Password

Masuk

Masuk Lupa Password? HA1

Ukuran Form 1024 x 768 Warna Background Gradasi Biru Font Tahoma

Ukuran 11pt

· Jika email dan kata sandi telah terisi dan memilih masuk maka akan menuju H-A-3

· Jika email dan kata sandi tidak valid dan memilih masuk maka akan keluar pesan M01

· Jika memilih lupa kata sandi maka akan menuju H-A-2

Gambar 3.45. Form Login Admin

b. Form Beranda Admin

Ukuran Form 1024 x 768 Warna Background Gradasi Biru Font Tahoma

Ukuran 11pt

H A 3 · Jika memilih menu pengolahan data admin maka akan menuju F-A-4

· Jika memilihmenu pengolaha data master sub menu kategori maka akan menuju F-A-5

· Jika memilihmenu pengolaha data master sub menu barang maka akan menuju F-A-6

· Jika memilihmenu pengolaha data master sub menu barang detail maka akan menuju F-A-7

· Jika memilihmenu pengolaha data master sub menu provinsi maka akan menuju F-A-8

· Jika memilihmenu pengolaha data master sub menu kota maka akan menuju F-A-9

· Jika memilihmenu pengolaha data master sub menu forwarder maka akan menuju F-A-10

· Jika memilihmenu pengolaha data master sub menu jenis pengiriman maka akan menuju F-A-11

· Jika memilihmenu pengolaha data master sub menu ongkos kirim maka akan menuju F-A-1

· Jika memilihmenu pengolaha data master sub menu member maka akan menuju F-A-13

· Jika memilihmenu pengolaha data master sub menu rekening maka akan menuju F-A-14

· Jika memilihmenu pengolaha data master sub menu warna maka akan menuju F-A-15

· Jika memilihmenu pengolaha data master sub menu ukuran maka akan menuju F-A-16

· Jika memilihmenu pengolaha data master sub menu kurs maka akan menuju F-A-17

· Jika memilihmenu pengolaha data transaksi sub menu data transaksi maka akan menuju F-A-18

· Jika memilihmenu pengolaha data transaksi sub menu konfirmasi pembayaran maka akan menuju F-A-19

· Jika memilihmenu pengolaha data laporan sub menu harian maka akan menuju F-A-20

· Jika memilihmenu pengolaha data transaksi sub menu mingguan maka akan menuju F-A-21

· Jika memilihmenu pengolaha data transaksi sub menu bulanan maka akan menuju F-A-22

· Jika memilihmenu pengolaha data transaksi sub menu tahunan maka akan menuju F-A-23

· Jika memilihmenu pengaturan akun sub menu ubah biodata maka akan menuju F-A-24

· Jika memilihmenu pengaturan akun sub menu ubah kata sandi maka akan menuju F-A-25

· Jika memilihmenupengaturan akun sub menukeluar maka akan menuju F-A-26

Image

Baranda Pengolahan Data Admin Pengolahan Data Master Pengolahan Data transaksi Pengolaha Data Laporan Pengaturan Akun

SELAMAT DATANG ADMINISTRATOR !

Image

Gambar 3.46. Form Beranda Admin

Ukuran Form 1024 x 768 Warna Background Gradasi Biru Font Tahoma

Ukuran 11pt H A 4

Image

Baranda Pengolahan Data Admin Pengolahan Data Master Pengolahan Data transaksi Pengolaha Data Laporan Pengaturan Akun

Pengolahan Data Admin

Image

Cari Berdasarkan :

Semua Kata Kunci

NO Nama Member Alamat Telepon Email Delete

1 Image

Tambah Admin 1

Prev Next Cari

· Jika memilih menu beranda maka akan menuju H-A-3

· Jika memilih menu pengolahan data admin maka akan menuju H-A-4

· Jika data tidak valid maka akan keluar pesan M03

· Jika memilihmenu pengolaha data master sub menu kategori maka akan menuju H-A-5

· Jika memilihmenu pengolaha data master sub menu barang maka akan menuju H-A-6

· Jika memilihmenu pengolaha data master sub menu barang detail maka akan menuju H-A-7

· Jika memilihmenu pengolaha data master sub menu provinsi maka akan menuju H-A-8

· Jika memilihmenu pengolaha data master sub menu kota maka akan menuju H-A-9

· Jika memilihmenu pengolaha data master sub menu forwarder maka akan menuju H-A-10

· Jika memilihmenu pengolaha data master sub menu jenis pengiriman maka akan menuju H-A-11

· Jika memilihmenu pengolaha data master sub menu ongkos kirim maka akan menuju H-A-12

· Jika memilihmenu pengolaha data master sub menu member maka akan menuju H-A-13

· Jika memilihmenu pengolaha data master sub menu rekening maka akan menuju H-A-14

· Jika memilihmenu pengolaha data master sub menu warna maka akan menuju H-A-15

· Jika memilihmenu pengolaha data master sub menu ukuran maka akan menuju H-A-16

· Jika memilihmenu pengolaha data master sub menu kurs maka akan menuju H-A-17

· Jika memilihmenu pengolaha data transaksi sub menu data transaksi maka akan menuju H-A-18

· Jika memilihmenu pengolaha data transaksi sub menu konfirmasi pembayaran maka akan menuju H-A-19

· Jika memilihmenu pengolaha data laporan sub menu harian maka akan menuju H-A-20

· Jika memilihmenu pengolaha data transaksi sub menu mingguan maka akan menuju H-A-21

· Jika memilihmenu pengolaha data transaksi sub menu bulanan maka akan menuju H-A-22

· Jika memilihmenu pengolaha data transaksi sub menu tahunan maka akan menuju H-A-23

· Jika memilihmenu pengaturan akun sub menu ubah biodata maka akan menuju H-A-24

· Jika memilihmenu pengaturan akun sub menu ubah kata sandi maka akan menuju H-A-25

· Jika memilihmenupengaturan akun sub menukeluar maka akan menuju H-A-26

Gambar 3.47. Form Pengolahan Data Admin

d. Form Tambah Admin