13. DFD Level 3 Proses 4.6 Kelola Pesanan
3.2.3 Perancangan Arsitektur
3.2.3.1 Perancangan Antar Muka
3.2.3.1.2 Perancangan Antar Muka Operator
1. Perancangan antar muka login
Gambar pada 3.34 di bawah ini merupakan perancangan antar muka login pada operator yang berfungsi sebagai halaman login untuk operator.
PR06
Nama Layar : PR06 Ukuran Layar : 1024 X 768
Font : arial
Warna Background : putih
Klik login menuju PR01 Klik lupa password menuju PR07 Granitex Petugas login Email Password login Lupa password ?
2. Perancangan antar muka lupa password
Gambar pada 3.35 di bawah ini merupakan perancangan antar muka lupa password pada operator yang berfungsi jika operator kehilangan password atau lupa password.
PR07
Nama Layar : PR07 Ukuran Layar : 1024 X 768
Font : arial
Warna Background : putih
Klik login menuju PR06 Klik proses menuju PR07 Granitex Lupa password Email Proses << Login
3. Perancangan antar muka beranda
Gambar pada 3.36 di bawah ini merupakan perancangan antar muka beranda pada operator yang berfungsi sebagai halaman utama pada operator.
PR01
Nama Layar : PR01 Ukuran Layar : 1024 X 768
Font : arial
Warna Background : putih
Klik home menuju PR01
Klik data kategori menuju PR02 Klik data barang
menuju PR03 Klik pesanan menuju PR04 Klik penjualan
menuju PR05 Klik ongkos kirim
menuju PR08 Klik komentar menuju PR09 Klik ganti password menuju PR11
Klik logout menuju PR12
header
footer Logo dan nama toko
Akses operator Home Ongkos kirim Penjualan Pesanan Data barang Data kategori Halaman >> home logout Ganti password Komentar Total data Info pesanan Info terbaru
Info stok barang habis
4. Perancangan antar muka data kategori
Gambar pada 3.37 di bawah ini merupakan perancangan antar muka data kategori pada operator yang berfungsi sebagai pengolahan data kategori.
PR02
Nama Layar : PR02 Ukuran Layar : 1024 X 768
Font : arial
Warna Background : putih
header
footer Logo dan nama toko
Akses operator
Halaman >> data kategori
Lihat data barang Tambah Home Ongkos kirim Penjualan Pesanan Data barang Data kategori Logout Ganti password Komentar
List data kategori
Data detail kategori
Tambah Jumlah barang
Edit
Klik home menuju PR01
Klik data kategori menuju PR02 Klik data barang
menuju PR03 Klik pesanan menuju PR04 Klik penjualan
menuju PR05 Klik ongkos kirim
menuju PR08 Klik komentar menuju PR09 Klik ganti password menuju PR11
Klik logout menuju PR12
Klik tambah menuju PR13 Klik lihat data barang menuju PR03 Klik tambah
menuju PR36 Klik jumlah barang
menuju PR37 Klik edit menuju
PR10
5. Perancangan antar muka data barang
Gambar pada 3.38 di bawah ini merupakan perancangan antar muka data barang pada operator yang berfungsi sebagai pengolahan data barang.
PR03
Nama Layar : PR03 Ukuran Layar : 1024 X 768
Font : arial
Warna Background : putih
header
footer Logo dan nama toko
Selamat datang, Operator | Keluar
Home Ongkos kirim Penjualan Pesanan Data barang Data kategori
Halaman >> Data barang | Kategori
Log out Ganti password
Komentar
Tambah
Tampilkan semua
Lihat data detail barang Tambah barang
Cari nama produk : cari
Edit Data barang
Jumlah detail
Klik home menuju PR01
Klik data kategori menuju PR02 Klik data barang
menuju PR03 Klik pesanan menuju PR04 Klik penjualan
menuju PR05 Klik ongkos kirim
menuju PR08 Klik komentar menuju PR09 Klik ganti password menuju PR11
Klik logout menuju PR12
Klik tambah barang menuju PR14 Klik lihat data
detail barang menuju PR15 Klik cari menuju
PR03 Klik tambah
menuju PR17 Klik jumlah detail
menuju PR16 Klik edit menuju
PR18
6. Perancangan antar muka laporan pesanan
Gambar pada 3.39 di bawah ini merupakan perancangan antar muka laporan pesanan pada operator yang berfungsi sebagai pengolahan laporan pesanan.
PR04
Nama Layar : PR04 Ukuran Layar : 1024 X 768
Font : arial
Warna Background : putih
header
footer Logo dan nama toko
Akses operator Home Ongkos kirim Penjualan Pesanan Data barang Data kategori
Halaman >> laporan pesanan
Log out Ganti password
Komentar
Tabel pesanan proses
Semua Belum bayar Butuh konfirmasi
Sudah dibayar
Proses
pengiriman Pesanan terkirim Retur Lainnya
Klik home menuju
PR01 Klik data kategori
menuju PR02 Klik data barang
menuju PR03 Klik pesanan menuju
PR04 Klik penjualan
menuju PR05 Klik ongkos kirim
menuju PR08 Klik komentar menuju PR09 Klik ganti password
menuju PR11 Klik logout menuju
PR12
Klik semua menuju PR04
Klik belum bayar menuju PR19 Klik butuh konfirmasi
menuju PR20 Klik sudah dibayar
menuju PR21 Klik proses
pengiriman PR22 Klik pesanan terkirim
PR23 Klik retur menuju
PR24
Klik lainnya menuju PR25
Klik tampilkan menuju PR04 Klik proses menuju
PR39
Dari tanggal : Sampai : Tampilkan
7. Perancangan antar muka laporan penjualan
Gambar pada 3.40 di bawah ini merupakan perancangan antar muka laporan penjualan pada operator yang berfungsi sebagai pengolahan data laporan penjualan.
PR05
Nama Layar : PR05 Ukuran Layar : 1024 X 768
Font : arial
Warna Background : putih
header
footer Logo dan nama toko
Akses operator Home Ongkos kirim Penjualan Pesanan Data barang Data kategori
Halaman >> laporan penjualan
Log out Ganti password
Komentar
Sampai tanggal :
Dari tanggal : tampilkan
Tabel penjualan
Semua Transfer bank paypal Cash on delivery
Klik home menuju PR01
Klik data kategori menuju PR02 Klik data barang
menuju PR03 Klik pesanan menuju PR04 Klik penjualan
menuju PR05 Klik ongkos kirim
menuju PR08 Klik komentar menuju PR09 Klik ganti password menuju PR11
Klik logout menuju PR12
Klik semua menuju PR05 Klik transfer bank
menuju PR26 Klik paypal menuju PR27 Klik cash on delivery menuju PR28
8. Perancangan antar muka ongkos kirim
Gambar pada 3.41 di bawah ini merupakan perancangan antar muka ongkos kirim pada operator yang berfungsi sebagai pengolahan data ongkos kirim.
PR08
Nama Layar : PR08 Ukuran Layar : 1024 X 768
Font : arial
Warna Background : putih
header
footer Logo dan nama toko
Akses operator Home Ongkos kirim Penjualan Pesanan Data barang Data kategori
Halaman >> Ongkos kirim
Tabel ongkos kirim
Log out Ganti password
Komentar
Tambah provinsi Lihat kota
Tambah Jumlah kota edit
Klik home menuju PR01
Klik data kategori menuju PR02 Klik data barang
menuju PR03 Klik pesanan menuju PR04 Klik penjualan
menuju PR05 Klik ongkos kirim
menuju PR08 Klik komentar menuju PR09 Klik ganti password menuju PR11
Klik logout menuju PR12
Klik tambah provinsi menuju PR31 Klik lihat kota
menuju PR32 Klik tambah
menuju PR34 Klik jumlah kota
menuju PR33 Klik edit menuju
PR35
9. Perancangan antar muka komentar
Gambar pada 3.42 di bawah ini merupakan perancangan antar muka komentar pada operator yang berfungsi sebagai pengolahan data komentar.
PR09
Nama Layar : PR09 Ukuran Layar : 1024 X 768
Font : arial
Warna Background : putih
header
footer Logo dan nama toko
Akses operator Home Ongkos kirim Penjualan Pesanan Data barang Data kategori Halaman >> komentar
List data komentar
Log out Ganti password
Komentar
Yang ditandai : Pilih aksi proses
Klik home menuju PR01
Klik data kategori menuju PR02 Klik data barang
menuju PR03 Klik pesanan menuju PR04 Klik penjualan
menuju PR05 Klik ongkos kirim
menuju PR08 Klik komentar menuju PR09 Klik ganti password menuju PR11
Klik logout menuju PR12
Klik proses menuju PR09
10. Perancangan antar muka ganti password
Gambar pada 3.43 di bawah ini merupakan perancangan antar muka ganti password pada operator yang berfungsi sebagai halaman untuk mengganti password operator.
PR11
Nama Layar : PR11 Ukuran Layar : 1024 X 768
Font : arial
Warna Background : putih
header
footer Logo dan nama toko
Akses operator
Halaman >> ganti password
Form ganti password
Ganti Password : Password baru : Home Ongkos kirim Penjualan Pesanan Data barang Data kategori Log out Ganti password Komentar Ulangi password :
Klik home menuju PR01
Klik data kategori menuju PR02 Klik data barang
menuju PR03 Klik pesanan menuju PR04 Klik penjualan
menuju PR05 Klik ongkos kirim
menuju PR08 Klik komentar menuju PR09 Klik ganti password menuju PR11
Klik logout menuju PR12
Klik ganti menuju PR11