1.6.

Rancangan Antar Muka

1.6.1.Rancangan Keluaran
Rancangan keluaran ini dimaksudkan memberi gambaran mengenai
keluaran dari E-commerce pada Toko Queen Susu yang diusulkan. Rincian
mengenai rancangan keluaran tersebut sebagai berikut:
a. Nama keluaran : Update Status
Fungsi : Sebagai tanda bukti status pesanan
Media : Monitor
Distribusi : Admin
Rangkap : 1(satu)
Frekuensi : Setiap melakukan pesanan
Volume : 30/hari
Format : Lampiran C-1
Keterangan : Berisikan informasi mengenai update status
pesanan pelanggan

b. Nama keluaran : Laporan Penjualan

Fungsi : Sebagai bukti laporan penjualan bulanan
Media : Monitor dan kertas
Distribusi : Owner
Rangkap : 1 (satu)
Frekuensi : Berisikan informasi mengenai data-data
laporan penjualan untuk perionde satu bulan
Volume : 30/hari
Format : Lampiran C-2
Keterangan : Berisikan informasi mengenai data-data
laporan penjualan untuk perionde satu bulan
1.6.2.Rancangan Masukan
a. Nama masukan : Data Barang
Sumber : Admin
Fungsi : Untuk mengetahui data barang
Media : Kertas/monitor
Rangkap : 1 (satu)
Frekuensi : Setiap admin melakukan penambahan barang
Volume : 1/bulan
Format : Lampiran D-1
Keterangan : Berisikan informasi mengenai data-data
barang

b. Nama masukan : Data Item Barang

Sumber : Admin
Fungsi : Untuk mengetahui jenis-jenis barang
Media : Kertas/monitor
Rangkap : 1 (satu)
Frekuensi : Bulanan
Volume : 1/bulan
Format : Lampiran D-2
Keterangan : Berisikan informasi tentang item-item barang

c. Nama masukan : Data Konfirmasi Pembayaran

Sumber : Pelanggan
Fungsi : Sebagai masukan untuk menginput data-data
konfirmasi pembayaran
Media : Kertas/monitor
Rangkap : 1 (satu)
Frekuensi : Setiap pembeli hendak melakukan konfirmasi
pembayaran
Volume : 30/hari
 Format : Lampiran D-3
Keterangan : Berisikan informasi mengenai data-data
konfirmasi pembayaran

d. Nama masukan : Data Pelanggan

Sumber : Pelanggan
Fungsi : Untuk mengetahui data pelanggan
Media : Kertas/monitor
Rangkap : 1 (satu)
Frekuensi : Setiap adanya penambahan pelanggan
Volume : 30/hari
Format : Lampiran D-4
Keterangan : Cukup jelas

e. Nama masukan : Data Pesanan

Sumber : Pelanggan
Fungsi : Untuk mengetahui pesanan barang
Media : Monitor
Rangkap : 1 (satu)
Frekuensi : Setiap terjadinya pesanan
Volume : 30/hari
Format : Lampiran D-5
Keterangan : Cukup jelas
1.7. Struktur Rancangan Layar
Berikut merupakan struktur rancangan layar yang ada pada E-commerce
Queen Susu, yaitu sebagai berikut :

Ecommerce
Queen Susu

Admin Pelanggan

Login

Login

Entry
Pelanggan
Entry Data
Barang
Entry Pesanan

Entry Item
Barang
Entry
Konfirmasi
Cetak Laporan Pembayaran
Penjualan

Update Status

Gambar 4.11 Struktur Rancangan Layar

1.7.1. Racangan Layar
1.7.1.1. Rancangan Layar Admin
Berikut merupakan rancangan layar admin pada Ecommerce Queen Susu,
yaitu sebagai berikut :
1. Rancangan Layar Login Admin

Gambar 4.12 Rancangan Login Admin

Gambar 4.13 Racangan Layar Halaman Utama Admin

2. Racangan Layar Data Barang

Gambar 4.14 Rancangan Layar Data barang

3. Rancangan Layar Item Barang

Gamabar 4.15 Rancangan Layar Item Baran

4. Rancangan Layar Cetak Laporan Penjualan

Gambar 4.16 Rancangan Layar Cetak Laporan Penjualan

5. Rancangan Layar Update Status

4.17 ancangan Layar Update Status

1.7.1.2. Rancangan Layar Pelanggan
Berikut merupakan rancangan layar pelanggan pada Ecommerce Queen
Susu, yaitu sebagai berikut :
1. Rancangan Layar Login Pelanggan

Gambar 4.18 Rancangan Layar Login Pelanggan

2. Racangan Layar Entry Pelanggan

Gambar 4.19 Rancangan Layar Entry Pelanggan

3. Rancangan Layar Halaman Utama Pelanggan

Gambar 4.20 Rancangan Layar Halaman Utama Pelanggan

4. Rancangan Layar Pelanggan Lihat Barang

Gambar 4.21 Rancangan Layar Pelanggan Lihat barang

5. Rancangan Layar Keranjang Pemesanan

Gambar 4.22 Rancangan Layar Keranjang Pemesanan

6. Rancangan Layar Entry Pesanan

Gambar 4.23 Rancangan Layar Entry Pesanan

7. Racangan Layar Konfirmasi Pembayaran

Gambar 4.24 Rancangan Layar Konfirmasi Pembayaran

8. Rancangan Layar Pembeli Lihat Pembayaran

Gambar 4.25 Rancangan Layar Pembeli Lihat Pembayaran

1.8. Sequence Diagram
1. Sequence Diagram Login Admin

Gambar 4.26 Sequence Diagram Login Admin

2. Sequence Diagram Entry Barang

Gambar 4.27 Sequence Diagram Entry Barang

3. Sequence Diagram Item Barang

Gambar 4.28 Sequence Diagram Login Admin