a. Nama Tabel : Tabel matauang
b. Primary Key : kode c. Jumlah Field : 2
d. Foreign Key :- e. Keterangan : Tabel berisi data kurs
Table III.28 Tabel Matauang
Nama Field Tipe Data
Ukuran Keterangan kode
varchar 3
Primary Key kurs
double -
Nilai kurs Id_admin
Int -
Foreign key reference ke tabel
admin field
id_admin
17. File Kategori
a. Nama Tabel : Tabel kategori
b. Primary Key : id_kategori c. Jumlah Field : 2
d. Foreign Key :- e. Keterangan : Tabel berisi data kategori
Table III.29 Tabel Kategori
Nama Field Tipe Data
Ukuran Keterangan Id_kategori
int -
Primary Key Nama_kategori
Varchar 50
Nama kategori Id_admin
Int -
Foreign key reference ke tabel
admin field
id_admin
III.5.2 Perancangan Arsitektur
Setelah melakukan perancangan data pada sistem yang dibangun, maka dilakukanlah perancangan arsitektur. Perancangan arsitektur yang telah dibuat
meliputi beberapa perancangan diantaranya perancangan struktur menu, spesifikasi antarmuka, perancangan keluaran dan jaringan semantik.
III.5.3 Perancangan Struktur Menu
Struktur menu dirancang sesuai dengan level pengguna sistem. Berikut ini
adalah struktur menu pada Toko Yella Perdana :
1. Struktur Menu Pengunjung
home
Registrasi member
profil Cara pemesanan,
pembayaran dan retur
Hubungi kami Semua
produk
Lupa password
merk
tracking
Gambar III.24 Struktur Menu Pengunjung
2. Struktur menu member
keranjang
history
logout Edit akun
home login
profil
Cara pemesanan dan pembayaran
Hubungi kami Semua
produk merk
Gambar III.25 Struktur Menu Member
3. Struktur Menu operator
login
Manajemen produk
Manajemen kota
Manajemen merk
Manajemen Orders
home
logout Manajemen
member
Manajemen hubungi
Manajemen kategori
pengiriman Manajemen
provinsi Manajemen
ongkir Manajemen
retur
Manajemen jasa
pengiriman
Gambar III.26 Struktur Menu Operator
4. Struktur Menu Admin
login
Manajemen admin
laporan home
logout
Gambar III.27 Struktur Menu Admin III.5.3.1 Perancangan Antar Muka
Spesifikasi antar muka merupakan suatu bentuk tampilan dari program yang akan dibuat untuk kebutuhan interface dengan user. Spesifikasi antarmuka
terdiri dari Perancangan tampilan menu, tampilan form, tampilan pesan, keluaran
dan jaringan semantik. III.5.3.2 Perancangan Antarmuka Pengunjung
1. Perancangan Antarmuka Menu Utama Beranda
Berikut dapat dilihat perancangan antar muka menu utama Beranda dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.28 dibawah ini :
A01 Klik link home menuju ke A01
Klik link semua produk menuju ke A02 Klik link cara pembelian, pembayaran dan
retur menuju ke A04 Klik link profil menuju ke A03
Klik link hubungi kami menuju ke A05 Klik link daftar baru menuju ke A 06
Klik link lupa password menuju ke A 07 Klik link view produk menuju ke A 08
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
Footer
2012 Yella Perdana Gambar
Nama barang
Ket: -
Selengkapnya..
View Produk
Harga Rp. Beli
Produk Terbaru Selamat Datang
Kami memberikan kenyamanan, kemudahan, dan keamanan.....
Stok:
Gambar Nama
barang Ket: -
Selengkapnya..
View Produk
Harga Rp. Beli
Stok:
Gambar Nama
barang Ket: -
Selengkapnya..
View Produk
Harga Rp. Beli
Stok:
Gambar Nama
barang Ket: -
Selengkapnya..
View Produk
Harga Rp. Beli
Stok:
Keranjang Belanja Banyak Dilihat
Nama Barang
Terlaku Social Network
0 item produk Gambar
Nama Barang
Facebook
Twitter
Gambar
Header Logo
Beranda Semua produk
Cara pembelian, Pembayaran Retur Profil
Hubungi Kami Cari
Login Username
Password Login
Jika belum menjadi member silakan
Registrasi Member Lupa Password
Customer Service Tracking JNE
No resi:
Cek status Yahoo
gambar
Merk Teks Merk
Teks Merk Kategori
Teks Kategori Teks Kategori
Gambar III.28 Perancangan Antarmuka Menu Utama Home
2.
Perancangan Antarmuka Menu Semua Produk
Berikut dapat dilihat perancangan antarmuka menu semua produk dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.29 dibawah
ini:
Klik link home menuju ke A01 Klik link semua produk menuju ke A02
Klik link cara pembelian, pembayaran dan retur menuju ke A04
Klik link profil menuju ke A03 Klik link hubungi kami menuju ke A05
Klik link daftar baru menuju ke A 06 Klik link lupa password menuju ke A 07
Klik link view produk menuju ke A 08
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
Footer
2012 Yella Perdana Gambar
Nama barang
Ket: -
Selengkapnya..
View Produk
Harga Rp. Beli
Produk Terbaru
Stok:
Gambar Nama
barang Ket: -
Selengkapnya..
View Produk
Harga Rp. Beli
Stok:
Gambar Nama
barang Ket: -
Selengkapnya..
View Produk
Harga Rp. Beli
Stok:
Gambar Nama
barang Ket: -
Selengkapnya..
View Produk
Harga Rp. Beli
Stok:
Keranjang Belanja Banyak Dilihat
Nama Barang
Terlaku Social Network
0 item produk Gambar
Nama Barang
Facebook
Twitter
Gambar
Header Logo
BerandaSemua produk Cara pembelian, Pembayaran Retur
Profil Hubungi Kami
Cari
First| Previous | 1 2 Next | Last
Total produk : A02
Login Username
Password Login
Jika belum menjadi member silakan
Registrasi Member Lupa Password
Customer Service Tracking JNE
No resi:
Cek status Yahoo
gambar
Merk Teks Merk
Teks Merk Kategori
Teks Kategori Teks Kategori
Gambar III.29 Perancangan Antarmuka Menu Semua Produk
3.
Perancangan Antarmuka Menu Profil. Berikut dapat dilihat perancangan antarmuka menu profil dari pembangunan
aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.30 dibawah ini:
Klik link home menuju ke A01 Klik link semua produk menuju ke A02
Klik link cara pembelian, pembayaran dan retur menuju ke A04
Klik link profil menuju ke A03 Klik link hubungi kami menuju ke A05
Klik link daftar baru menuju ke A 06 Klik link lupa password menuju ke A 07
Klik link view produk menuju ke A 08
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
A03
Footer
2012 Yella Perdana Profil Toko
Keranjang Belanja Banyak Dilihat
Nama Barang
Terlaku Social Network
0 item produk Gambar
Nama Barang
Facebook
Twitter
Gambar
Header Logo
Beranda Semua produk Cara pembelian, Pembayaran Retur
Profil Hubungi Kami
Cari
Haiii... Selamat datang di Profil Toko Yella Perdana
Login Username
Password Login
Jika belum menjadi member silakan
Registrasi Member Lupa Password
Customer Service Tracking JNE
No resi:
Cek status Yahoo
gambar
Merk Teks Merk
Teks Merk Kategori
Teks Kategori Teks Kategori
Gambar III.30 Perancangan Antarmuka Menu Profil
4.
Perancangan Antarmuka Menu Cara Pembelian, Pembayaran dan Retur. Berikut dapat dilihat perancangan antarmuka menu cara pembelian,
pembayaran dan retur dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.31 dibawah ini:
Klik link home menuju ke A01 Klik link semua produk menuju ke A02
Klik link cara pembelian, pembayaran dan retur menuju ke A04
Klik link profil menuju ke A03 Klik link hubungi kami menuju ke A05
Klik link daftar baru menuju ke A 06 Klik link lupa password menuju ke A 07
Klik link view produk menuju ke A 08
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
A04
Footer
2012 Yella Perdana Cara Pembelian
Keranjang Belanja Banyak Dilihat
Nama Barang
Terlaku Social Network
0 item produk Gambar
Nama Barang
Facebook
Twitter
Gambar Header
Logo BerandaSemua produk
Cara pembelian, Pembayaran Retur Profil
Hubungi Kami Cari
PROSEDUR PEMESANAN DI TOKO YELLA PERDANA
PROSEDUR RETUR DI TOKO YELLA PERDANA PENGEMBALIAN PENUKARAN BARANG
Untuk melakukan pemesanan,.... Login
Username Password
Login Jika belum menjadi member
silakan Registrasi Member
Lupa Password
Customer Service Tracking JNE
No resi: Cek status
Yahoo gambar
Merk Teks Merk
Teks Merk Kategori
Teks Kategori Teks Kategori
Gambar 3.31 Perancangan Antarmuka Menu Cara Pembelian, Pembayaran dan Retur
5.
Perancangan Antarmuka Menu Hubungi Kami Berikut dapat dilihat perancangan antarmuka menu about us dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.32 dibawah ini:
Klik link home menuju ke A01 Klik link semua produk menuju ke A02
Klik link cara pembelian, pembayaran dan retur menuju ke A04
Klik link profil menuju ke A03 Klik link hubungi kami menuju ke A05
Klik link daftar baru menuju ke A 06 Klik link lupa password menuju ke A 07
Klik link view produk menuju ke A 08
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
A05
Footer
2012 Yella Perdana Hubungi Kami
Keranjang Belanja Banyak Dilihat
Nama Barang
Terlaku Social Network
0 item produk Gambar
Nama Barang
Facebook
Twitter
Gambar Header
Logo Beranda Semua produk
Cara pembelian, Pembayaran Retur Profil
Hubungi Kami Cari
Untuk menanyakan mengenai pesanan atau mengenai produk Silahkan kirim pesan
Subjek : Nama :
Email : Pesan :
Masukan Pesan Batal
Login Username
Password Login
Jika belum menjadi member silakan
Registrasi Member Lupa Password
Customer Service Tracking JNE
No resi: Cek status
Yahoo gambar
Merk Teks Merk
Teks Merk Kategori
Teks Kategori Teks Kategori
Gambar III.32 Perancangan Antarmuka Menu Hubungi Kami
6.
Perancangan Antarmuka Lupa Password Berikut dapat dilihat perancangan antarmuka lupa password dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.33.
Klik link home menuju ke A01 Klik link semua produk menuju ke A02
Klik link cara pembelian, pembayaran dan retur menuju ke A04
Klik link profil menuju ke A03 Klik link hubungi kami menuju ke A05
Klik link daftar baru menuju ke A 06 Klik link lupa password menuju ke A 07
Klik link view produk menuju ke A 08
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
A07
Footer
2012 Yella Perdana Lupa Password
Keranjang Belanja Banyak Dilihat
Nama Barang
Terlaku Social Network
0 item produk Gambar
Nama Barang
Facebook
Twitter
Gambar
Header Logo
Beranda Semua produk Cara pembelian, Pembayaran Retur
Profil Hubungi Kami
Cari
Masukan Username Anda : Masukan Email Anda :
Proses Login
Username Password
Login
Jika belum menjadi member silakan
Registrasi Member Lupa Password
Customer Service Tracking JNE
No resi:
Cek status Yahoo
gambar
Merk Teks Merk
Teks Merk Kategori
Teks Kategori Teks Kategori
Gambar III.33 Perancangan Antarmuka Lupa Password
7.
Perancangan Antarmuka Detail Produk Berikut dapat dilihat perancangan antarmuka detail produk dari pembangunan
aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.34.
Klik link home menuju ke A01 Klik link semua produk menuju ke A02
Klik link cara pembelian, pembayaran dan retur menuju ke A04
Klik link profil menuju ke A03 Klik link hubungi kami menuju ke A05
Klik link daftar baru menuju ke A 06 Klik link lupa password menuju ke A 07
Klik link view produk menuju ke A 08
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
A08
Footer
2012 Yella Perdana Detail Produk
Keranjang Belanja Banyak Dilihat
Nama Barang
Terlaku Social Network
0 item produk Gambar
Nama Barang
Facebook
Twitter
Gambar
Header Logo
Beranda Semua produk Cara pembelian, Pembayaran Retur
Profil Hubungi Kami
Cari
Gambar
View Full Size Image
Nama Produk : Harga : Rp.0000
Deskripsi : Stok :
Beli Login
Username Password
Login
Jika belum menjadi member silakan
Registrasi Member Lupa Password
Customer Service Tracking JNE
No resi:
Cek status Yahoo
gambar
Merk Teks Merk
Teks Merk Kategori
Teks Kategori Teks Kategori
Gambar III.34 Perancangan Antarmuka Detail Produk
8. Perancangan Antarmuka Keranjang Berikut dapat dilihat perancangan antarmuka keranjang dari pembangunan
aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.35.
Klik link home menuju ke A01 Klik link semua produk menuju ke A02
Klik link cara pembelian, pembayaran dan retur menuju ke A04
Klik link profil menuju ke A03 Klik link hubungi kami menuju ke A05
Klik link daftar baru menuju ke A 06 Klik link lupa password menuju ke A 07
Klik link view produk menuju ke A 08
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
A09
Klik link Keranjang belanja menuju ke A 09
Footer
2012 Yella Perdana Keranjang Belanja
Keranjang Belanja Banyak Dilihat
Nama Barang
Terlaku Social Network
1 barang Gambar
Nama Barang
Facebook
Twitter
Gambar
Header Logo
BerandaSemua produk Cara pembelian, Pembayaran Retur
Profil Hubungi Kami
Cari
No Nama Produk
Jumlah Berat
Sub Total Harga
Satuan Hapus
Belanja Check Out
Hapus
Login Username
Password Login
Jika belum menjadi member silakan
Registrasi Member Lupa Password
Customer Service Tracking JNE
No resi:
Cek status Yahoo
gambar
Merk Teks Merk
Teks Merk Kategori
Teks Kategori Teks Kategori
Gambar III.35 Perancangan Antarmuka Keranjang
III.5.3.3 Perancangan Antarmuka Member 1. Perancangan Antarmuka Pendaftaran Member Baru
Berikut dapat dilihat perancangan antar pendaftaran member baru dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.36 dibawah ini :
Klik link home menuju ke A01 Klik link semua produk menuju ke A02
Klik link cara pembelian, pembayaran dan retur menuju ke A04
Klik link profil menuju ke A03 Klik link hubungi kami menuju ke A05
Klik link daftar baru menuju ke A 06 Klik link lupa password menuju ke A 07
Klik link view produk menuju ke A 08
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
A06
Footer
2012 Yella Perdana Pendaftaran Member Baru
Keranjang Belanja Banyak Dilihat
Nama Barang
Terlaku Social Network
0 item produk Gambar
Nama Barang
Facebook
Twitter
Gambar
Header Logo
Beranda Semua produk Cara pembelian, Pembayaran Retur
Profil Hubungi Kami
Cari
Username :
Email : Password :
Ulangi Password :
Nama : Alamat :
Telepon : Provinsi :
Kota : Kode Pos :
Daftar Batal
Login Username
Password Login
Jika belum menjadi member silakan
Registrasi Member Lupa Password
Customer Service Tracking JNE
No resi:
Cek status Yahoo
gambar
Merk Teks Merk
Teks Merk Kategori
Teks Kategori Teks Kategori
Gambar III.36 Perancangan Antarmuka Pendaftaran Member Baru
2. Perancangan Antarmuka Home sebelum Login Berikut dapat dilihat perancangan antarmuka home sebelum masuk login dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.37.
Klik link home menuju ke A01 Klik link semua produk menuju ke A02
Klik link cara pembelian, pembayaran dan retur menuju ke A04
Klik link profil menuju ke A03 Klik link hubungi kami menuju ke A05
Klik link daftar baru menuju ke A 06 Klik link lupa password menuju ke A 07
Klik link view produk menuju ke A 08
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
Footer
2012 Yella Perdana Gambar
Nama barang
Ket: -
Selengkapnya..
View Produk
Harga Rp. Beli
Produk Terbaru
Stok:
Gambar Nama
barang Ket: -
Selengkapnya..
View Produk
Harga Rp. Beli
Stok:
Gambar Nama
barang Ket: -
Selengkapnya..
View Produk
Harga Rp. Beli
Stok:
Gambar Nama
barang Ket: -
Selengkapnya..
View Produk
Harga Rp. Beli
Stok:
Keranjang Belanja Banyak Dilihat
Nama Barang
Terlaku Social Network
0 item produk Gambar
Nama Barang
Facebook
Twitter
Gambar
Header Logo
BerandaSemua produk
Cara pembelian, Pembayaran Retur Profil
Hubungi Kami Cari
First| Previous | 1 2 Next | Last
Total produk : A02
Login Username
Password Login
Jika belum menjadi member silakan
Registrasi Member Lupa Password
Customer Service Tracking JNE
No resi:
Cek status Yahoo
gambar
Merk Teks Merk
Teks Merk Kategori
Teks Kategori Teks Kategori
Gambar III.37 Perancangan Antarmuka Home sebelum Login
3. Perancangan Antarmuka Home sesudah Login Berikut dapat dilihat perancangan antarmuka home sesudah login dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.38.
Klik link home menuju ke A15 Klik link semua produk menuju ke A16
Klik link cara pembelian, pembayaran dan retur menuju ke A18
Klik link profil menuju ke A17 Klik link hubungi kami menuju ke A05
Klik link view produk menuju ke A19
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
A15
Footer
2012 Yella Perdana Gambar
Nama barang
Ket: - Selengkapnya..
View Produk
Harga Rp. Beli
Produk Terbaru Stok:
Gambar Nama
barang Ket: -
Selengkapnya..
View Produk
Harga Rp. Beli
Stok: Gambar
Nama barang
Ket: - Selengkapnya..
View Produk
Harga Rp. Beli
Stok: Gambar
Nama barang
Ket: - Selengkapnya..
View Produk
Harga Rp. Beli
Stok: Keranjang Belanja
Banyak Dilihat Nama
Barang Terlaku
Social Network 0 item produk
Gambar Nama
Barang Facebook
Twitter
Gambar Header
Logo
BerandaSemua produk Cara pembelian, Pembayaran Retur
Profil Hubungi Kami
Cari
First| Previous | 1 2 Next | Last
Total produk : Klik link beli menuju ke A20
Login
Kategori Customer Service
gambar Tracking JNE
No resi: Teks Kategori
Teks Kategori
Cek status Yahoo
Home Edit Account
Ganti Password
My Account My Order
Keranjang Belanja Lihat History Pemesanan
Log Out Merk
Teks Merk Teks Merk
Gambar III.38 Perancangan Antarmuka Home sesudah Login
4. Perancangan Antarmuka Menu Semua Produk Berikut dapat dilihat perancangan antarmuka memu semua produk dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.39.
Klik link home menuju ke A15 Klik link semua produk menuju ke A16
Klik link cara pembelian, pembayaran dan retur menuju ke A18
Klik link profil menuju ke A17 Klik link hubungi kami menuju ke A05
Klik link view produk menuju ke A19
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
A16
Klik link beli menuju ke A20
Footer
2012 Yella Perdana Gambar
Nama barang
Ket: - Selengkapnya..
View Produk
Harga Rp. Beli
Semua Produk Stok:
Gambar Nama
barang Ket: -
Selengkapnya..
View Produk
Harga Rp. Beli
Stok: Gambar
Nama barang
Ket: - Selengkapnya..
View Produk
Harga Rp. Beli
Stok: Gambar
Nama barang
Ket: - Selengkapnya..
View Produk
Harga Rp. Beli
Stok: Keranjang Belanja
Banyak Dilihat Nama
Barang Terlaku
Social Network 0 item produk
Gambar Nama
Barang Facebook
Twitter
Gambar Header
Logo
Beranda Semua produk Cara pembelian, Pembayaran Retur
Profil Hubungi Kami
Cari
First| Previous | 1 2 Next | Last
Total produk : Login
Kategori Customer Service
gambar Tracking JNE
No resi: Teks Kategori
Teks Kategori
Cek status Yahoo
Home Edit Account
Ganti Password
My Account My Order
Keranjang Belanja Lihat History Pemesanan
Log Out Merk
Teks Merk Teks Merk
Gambar III.39 Perancangan Antarmuka Menu Semua Produk
5. Perancangan Antarmuka Menu Cara Pembelian, Pembayaran dan Retur Berikut dapat dilihat perancangan antarmuka menu profil dari pembangunan
aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.40.
Klik link home menuju ke A15 Klik link semua produk menuju ke A16
Klik link cara pembelian, pembayaran dan retur menuju ke A18
Klik link profil menuju ke A17 Klik link hubungi kami menuju ke A05
Klik link view produk menuju ke A19
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
A18
Klik link beli menuju ke A20
Footer
2012 Yella Perdana Keranjang Belanja
Banyak Dilihat Nama
Barang Terlaku
Social Network 0 item produk
Gambar Nama
Barang Facebook
Twitter
Gambar Header
Logo Beranda Semua produk
Cara pembelian, Pembayaran Retur Profil
Hubungi Kami Cari
Cara Pembelian PROSEDUR PEMESANAN DI TOKO YELLA PERDANA
PROSEDUR RETUR DI TOKO YELLA PERDANA PENGEMBALIAN PENUKARAN BARANG
Untuk melakukan pemesanan,.... Login
Kategori Customer Service
gambar Tracking JNE
No resi: Teks Kategori
Teks Kategori
Cek status Yahoo
Home Edit Account
Ganti Password
My Account My Order
Keranjang Belanja Lihat History Pemesanan
Log Out Merk
Teks Merk Teks Merk
Gambar III.40 Perancangan Antarmuka Menu Cara Pembelian, Pembayaran dan retur
6. Perancanngan Antarmuka Profil Berikut dapat dilihat perancangan antarmuka profil dari pembangunan
aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.41.
Klik link home menuju ke A15 Klik link semua produk menuju ke A16
Klik link cara pembelian, pembayaran dan retur menuju ke A18
Klik link profil menuju ke A17 Klik link hubungi kami menuju ke A05
Klik link view produk menuju ke A19
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
A17
Klik link beli menuju ke A20
Footer
2012 Yella Perdana Keranjang Belanja
Banyak Dilihat Nama
Barang Terlaku
Social Network 0 item produk
Gambar Nama
Barang Facebook
Twitter
Gambar Header
Logo Beranda Semua produk
Cara pembelian, Pembayaran Retur
Profil
Hubungi Kami Cari
Profil Toko
Hai.... Selamat Datang...
Login
Kategori Customer Service
gambar Tracking JNE
No resi: Teks Kategori
Teks Kategori
Cek status Yahoo
Home Edit Account
Ganti Password
My Account My Order
Keranjang Belanja Lihat History Pemesanan
Log Out Merk
Teks Merk Teks Merk
Gambar III.41 Perancangan Antarmuka Profil
7. Perancangan Antarmuka Keranjang Berikut dapat dilihat perancangan antarmuka keranjang dari pembangunan
aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.42.
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
A20
Footer
2012 Yella Perdana Keranjang Belanja
Keranjang Belanja Banyak Dilihat
Nama Barang
Terlaku Social Network
1 barang Gambar
Nama Barang
Facebook
Twitter
Gambar
Header Logo
Beranda Semua produk Cara pembelian, Pembayaran Retur
Profil Hubungi Kami
Cari
No Nama Produk
Jumlah Berat
Sub Total Harga
Satuan Hapus
Belanja Check Out
Hapus
Klik link home menuju ke A15 Klik link semua produk menuju ke A16
Klik link cara pembelian, pembayaran dan retur menuju ke A18
Klik link profil menuju ke A17 Klik link view produk menuju ke A19
Klik link Keranjang belanja menuju ke A20 Klik link History pemesanan menuju ke A21
Login
Kategori Customer Service
gambar Tracking JNE
No resi: Teks Kategori
Teks Kategori
Cek status Yahoo
Home Edit Account
Ganti Password
My Account My Order
Keranjang Belanja Lihat History Pemesanan
Log Out
Merk Teks Merk
Teks Merk
Gambar III.42 Perancangan Antarmuka Keranjang
8. Perancangan History Pemesanan Berikut dapat dilihat perancangan antarmuka history pemesanan dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.43.
Keterangan :
Ukuran Layar : Dinamis Default 1366x 768
Type ukuran Font : Times New Roman 10px
A21
Klik link home menuju ke A15 Klik link semua produk menuju ke A16
Klik link cara pembelian, pembayaran dan retur menuju ke A18
Klik link profil menuju ke A17 Klik link view produk menuju ke A19
Klik link Keranjang belanja menuju ke A20 Klik link History pemesanan menuju ke A21
Footer
2012 Yella Perdana Keranjang Belanja
Keranjang Belanja Banyak Dilihat
Nama Barang
Terlaku Social Network
0 item produk Gambar
Nama Barang
Facebook
Twitter
Gambar Header
Logo Beranda Semua produk
Cara pembelian, Pembayaran Retur Profil
Hubungi Kami Cari
Detail Order
No Nama Produk
Jumlah Berat
Sub Total Harga
Satuan Kembali
Login
Kategori Customer Service
gambar Tracking JNE
No resi: Teks Kategori
Teks Kategori
Cek status Yahoo
Home Edit Account
Ganti Password
My Account My Order
Keranjang Belanja Lihat History Pemesanan
Log Out Merk
Teks Merk Teks Merk
Gambar III.43 Perancangan Antarmuka History Pemesanan Detail III.5.3.4 Perancangan Antarmuka Operator
1. Perancangan Antarmuka Login Berikut dapat dilihat perancangan antarmuka login operator dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.44.
Username Password
Login Lupa password
Header
Footer Silahkan Login Terlebih Dahulu
Klik link login menuju B02 Klik Lupa password menuju C09
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B01
Gambar
Gambar III.44 Perancangan Antarmuka Login
2. Perancangan Lupa Password Berikut dapat dilihat perancangan antarmuka lupa password dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.45.
Proses Header
Footer Masukan Username Anda
Klik proses akan mengirimkan password ke email
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px C09
Masukan Email Anda
Gambar III.45 Perancangan Antarmuka Lupa Password
3. Perancangan Antarmuka Home Operator Berikut dapat dilihat perancangan antarmuka home operator dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.46.
Footer operator, selamat datang
Apa yang akan anda lakukan hari ini? Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B02
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
10 Orde Terkahir Id Order
Nama Member Status Order
Tanggal Order Aksi
Detail Daftar ID Order
Daftar Nama Member Daftar Status Order
Daftar Tanggal Order Ubah Status
Gambar III.46 Perancangan Antarmuka Home Operator
4. Perancangan Antarmuka Home Aksi-Detail Berikut dapat dilihat perancangan antarmuka home aksi-detail dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.47.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B03
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
Detail Order No
Nama Produk Jumlah
Berat Harga Satuan
Sub Total
Gambar III.47 Perancangan Antarmuka Home Aksi-Detail
5. Perancangan Antarmuka Aksi Ubah-Status Berikut dapat dilihat perancangan antarmuka aksi ubah-status dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.48.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B04
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
Manajemen Pesanan Id Order
Nama Member Status Order
Tanggal Order Simpan
Kembali
Gambar III.48 Perancangan Antarmuka Transaksi
6. Perancangan Antarmuka Menu Managemen Produk Berikut dapat dilihat perancangan antarmuka Managemen Produk operator
dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.49.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B05
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
List Barang Cari Barang :
Cari
Tambah Kembali
No Gambar Nama
Harga Stok
Tanggal Last Update
Aksi
Gambar III.49 Perancangan Antarmuka Managemen Produk
7. Perancangan Antarmuka Tambah Produk Berikut dapat dilihat perancangan antarmuka tambah produk dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.50.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B06
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
Form Tambah Barang
Simpan Batal
Gambar : Nama Produk :
Harga : Kategori :
Merk : Deskripsi :
Berat : Kg
Stok : Proses
Gambar III.50 Perancangan Antarmuka Tambah Produk
8. Perancangan Antarmuka Edit Produk Berikut dapat dilihat perancangan antarmuka edit produk dari pembangunan
aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.51.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B06
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
Form Edit Barang
Simpan Batal
Gambar : Nama Produk :
Harga : Kategori :
Merk : Deskripsi :
Berat : Kg
Stok : Proses
Gambar III.51 Perancangan Antarmuka Edit Produk
9. Perancangan Antarmuka Menu Managemen Merk Berikut dapat dilihat perancangan antarmuka Managemen Merk dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.52.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B08
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
List Merk Cari Merk
Cari
Tambah Kembali
No Merk
Aksi
Total Merk : Buah
Gambar III.52 Perancangan Antarmuka Managemen Merk
10. Perancangan Antarmuka Tambah Merk Berikut dapat dilihat perancangan antarmuka tambah merkdari pembangunan
aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.53.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B06
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
Form Tambah Merk Simpan
Batal Nama Merk :
Gambar III.53 Perancangan Antarmuka Tambah Merk
11. Perancangan Antarmuka Edit Merk Berikut dapat dilihat perancangan antarmuka edit merk dari pembangunan
aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.54.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B10
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
Form Edit Merk Simpan
Batal Nama Merk :
Gambar III.54 Perancangan Antarmuka Edit Merk
12. Perancangan Antarmuka Manajemen Kategori Berikut dapat dilihat perancangan antarmuka manajemen kategori dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.55.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B46
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
List Kategori Cari Merk
Cari
Tambah Kembali
Total Kategori : Buah No
Kategori Aksi
Gambar III.55 Perancangan Antarmuka Managemen Kategori
13. Perancangan Antarmuka Tambah Kategori Berikut dapat dilihat perancangan antarmuka tambah kategori dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.56.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B47
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
Form Tambah Kategori Simpan
Batal Nama Kategori :
Gambar III.56 Perancangan Antarmuka Tambah Kategori
14. Perancangan Antarmuka Edit Kategori Berikut dapat dilihat perancangan antarmuka edit kategori dari pembangunan
aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.57.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B48
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
Form Edit Kategoi Simpan
Batal Nama Kategori :
Gambar III.57 Perancangan Antarmuka Edit Kategori
15. Perancangan Antarmuka Manajemen Bank Berikut dapat dilihat perancangan antarmuka manajemen bank dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.58.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B14
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
List Bank Cari Merk
Cari
Tambah Kembali
Total Bank : Buah
No Nama Bank
Aksi
Gambar III.58 Perancangan Antarmuka Manajemen Bank 16. Perancangan Antarmuka Tambah Bank
Berikut dapat dilihat perancangan antarmuka Tambah bank dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.59.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B15
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
Form Tambah Bank Simpan
Batal Nama Bank :
Gambar III.59 Perancangan Antarmuka Tamah Bank
17. Perancangan Antarmuka Edit Bank Berikut dapat dilihat perancangan antarmuka edit kategori dari pembangunan
aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.60.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B16
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
Form Edit Bank Simpan
Batal Nama Bank :
Gambar III.60 Perancangan Antarmuka Edit Bank 18. Perancangan Antarmuka Kurs
Berikut dapat dilihat perancangan antarmuka kurs dari pembangunan aplikasi e-commerce
di toko Yella Perdana yang tercantum pada gambar III.61.
header
footer Klik kembali menuju B02
Klik home menuju B02 Klik detail menuju B03
Klik masukan menuju B02 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen KP menuju B21 Klik manajemen member menuju B24
Klik manajemen kota menuju B27 Klik manajemen provinsi menuju B30
Klik manajemenongkir menuju B33 Klik manajemen hubungi menuju B36
Klik bakcup menuju B37 Klik restore menuju B38
Klik transaksi semua pesanan menuju B39 Klik dibayar menuju B40
Klik dikirm menuju B41 Klik diterima menuju B42
Klik manajemen retur menuju B43 Klik detail retur menuju B44
Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B17
Home Pengolahan Data Master
Logout Transaksi
Kurs yang sedang dipakai Form Tambah kurs
Rp. Masukan kurs saat ini
Rp. Http:www.bni.co.id
Masukan Kembali
Gambar III.61 Perancangan Antarmuka Kurs 19. Perancangan Antarmuka Manajemen Jasa Pengiriman
Berikut dapat dilihat perancangan antarmuka manajemen jasa pengiriman dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.62.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B18
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
List Jasa Pengiriman Cari Jasa
Pengiriman Cari
Tambah Kembali
Total Jasa Pengiriman : Buah No
Nama Jasa Pengiriman Aksi
Gambar III.62 Perancangan Antarmuka Manajemen Jasa Pengiriman
20. Perancangan Antarmuka Tambah Jasa Pengiriman
Berikut dapat dilihat perancangan antarmuka tambah jasa pengiriman dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.63.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B19
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
Form Tambah Jasa Pengiriman Simpan
Batal Nama Jasa Pengiriman :
Gambar III.63 Perancangan Antarmuka Tambah Jasa Pengiriman 21. Perancangan Antarmuka Edit Jasa Pengiriman
Berikut dapat dilihat perancangan antarmuka edit jasa pengiriman dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.64.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B20
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
Form Edit Jasa Pengiriman Simpan
Batal Nama Jasa Pengiriman :
Gambar III.64 Perancangan Antarmuka Edit Jasa Pengiriman 22. Perancangan Antarmuka Manajemen Kategori Pengiriman
Berikut dapat dilihat perancangan antarmuka manajemen kategori pengiriman dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum
pada gambar III.65.
Footer Klik home menuju B02
Klik detail menuju B03 Klik ubah status menuju B04
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B21
Header Anda login Sebagai Operator
Home Pengolahan Data Master
Transaksi Logout
List Jasa Kategori Pengiriman Cari
Tambah Kembali
Total Kategori Pengiriman : Buah
No Nama Jasa Pengiriman Nama Kategori Pengiriman
Aksi
Gambar III.65 Perancangan Antarmuka Manajemen Kategori Pengiriman
23. Perancangan Antarmuka Tambah Kategori Pengiriman
Berikut dapat dilihat perancangan antarmuka tambah kategori pengiriman dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum
pada gambar III.66.
Header
Footer Klik batal menuju B21
Klik home menuju B02 Klik detail menuju B03
Klik simpan menuju B21 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen KP menuju B21 Klik manajemen member menuju B24
Klik manajemen kota menuju B27 Klik manajemen provinsi menuju B30
Klik manajemenongkir menuju B33 Klik manajemen hubungi menuju B36
Klik bakcup menuju B37 Klik restore menuju B38
Klik transaksi semua pesanan menuju B39 Klik dibayar menuju B40
Klik dikirm menuju B41 Klik diterima menuju B42
Klik manajemen retur menuju B43 Klik detail retur menuju B44
Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B22
Home Pengolahan Data Master
Logout
Simpan Batal
Transaksi Nama jasa pengiriman
Form Tambah Kategori Pengiriman Nama kategori pengiriman
Gambar III.66 Perancangan Antarmuka Tambah Kategori Pengiriman 24. Perancangan Antarmuka Edit Kategori Pengiriman
Berikut dapat dilihat perancangan antarmuka edit kategori pengiriman dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.67.
Header
Footer Klik batal menuju B21
Klik home menuju B02 Klik detail menuju B03
Klik simpan menuju B21 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen KP menuju B21 Klik manajemen member menuju B24
Klik manajemen kota menuju B27 Klik manajemen provinsi menuju B30
Klik manajemenongkir menuju B33 Klik manajemen hubungi menuju B36
Klik bakcup menuju B37 Klik restore menuju B38
Klik transaksi semua pesanan menuju B39 Klik dibayar menuju B40
Klik dikirm menuju B41 Klik diterima menuju B42
Klik manajemen retur menuju B43 Klik detail retur menuju B44
Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B23
Home Pengolahan Data Master
Logout
Simpan Batal
Transaksi Nama Jasa Pengiriman
Form Edit Kategori Pengiriman Nama Kategori Pengiriman
Gambar III.67 Perancangan Antarmuka Edit Kategori Pengiriman 25. Perancangan Antarmuka Tampil Member
Berikut dapat dilihat perancangan antarmuka Tampil member dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.68.
header
footer Total member : buah
Klik kembali menuju B02 Klik home menuju B02
Klik detail menuju B03 Klik edit menuju B26
Klik tambah menuju B25 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen KP menuju B21 Klik manajemen member menuju B24
Klik manajemen kota menuju B27 Klik manajemen provinsi menuju B30
Klik manajemenongkir menuju B33 Klik manajemen hubungi menuju B36
Klik bakcup menuju B37 Klik restore menuju B38
Klik transaksi semua pesanan menuju B39 Klik dibayar menuju B40
Klik dikirm menuju B41 Klik diterima menuju B42
Klik manajemen retur menuju B43 Klik detail retur menuju B44
Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B24
Home Pengolahan Data Master
Logout
Tambah Cari
gambar
Kembali List Member
No Nama Member
Email Tgl reg
Aksi Status Blok
edit
Gambar III.68 Perancangan Antarmuka Tampil Member
26. Perancangan Antarmuka Manajemen Kota
Berikut dapat dilihat perancangan antarmuka manajemen kota dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.69.
header
footer Total kota: buah
Klik kembali menuju B02 Klik home menuju B02
Klik detail menuju B03 Klik ubah menuju B29
Klik tambah menuju B28 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen KP menuju B21 Klik manajemen member menuju B24
Klik manajemen kota menuju B27 Klik manajemen provinsi menuju B30
Klik manajemenongkir menuju B33 Klik manajemen hubungi menuju B36
Klik bakcup menuju B37 Klik restore menuju B38
Klik transaksi semua pesanan menuju B39 Klik dibayar menuju B40
Klik dikirm menuju B41 Klik diterima menuju B42
Klik manajemen retur menuju B43 Klik detail retur menuju B44
Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B27
Home Pengolahan Data Master
Logout
Tambah Cari
gambar
Kembali List kota
No Nama kota
Aksi Transaksi
Ubah Hapus
Gambar III.69 Perancangan Antarmuka Manajemen Kota 27. Perancangan Antarmuka Tambah Kota
Berikut dapat dilihat perancangan antarmuka tambah kota dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.70.
header
footer Klik batal menuju B27
Klik home menuju B02 Klik detail menuju B03
Klik simpan menuju B27 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen KP menuju B21 Klik manajemen member menuju B24
Klik manajemen kota menuju B27 Klik manajemen provinsi menuju B30
Klik manajemenongkir menuju B33 Klik manajemen hubungi menuju B36
Klik bakcup menuju B37 Klik restore menuju B38
Klik transaksi semua pesanan menuju B39 Klik dibayar menuju B40
Klik dikirm menuju B41 Klik diterima menuju B42
Klik manajemen retur menuju B43 Klik detail retur menuju B44
Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B28
Home Pengolahan Data Master
Logout
Simpan Batal
Transaksi Nama kota
Form Tambah kota Pilih Provinsi
Gambar III.70 Perancangan Antarmuka Tambah Kota 28. Perancangan Antarmuka Edit Kota
Berikut dapat dilihat perancangan antarmuka edit kota dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.71.
header
footer Klik batal menuju B27
Klik home menuju B02 Klik detail menuju B03
Klik simpan menuju B27 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen KP menuju B21 Klik manajemen member menuju B24
Klik manajemen kota menuju B27 Klik manajemen provinsi menuju B30
Klik manajemenongkir menuju B33 Klik manajemen hubungi menuju B36
Klik bakcup menuju B37 Klik restore menuju B38
Klik transaksi semua pesanan menuju B39 Klik dibayar menuju B40
Klik dikirm menuju B41 Klik diterima menuju B42
Klik manajemen retur menuju B43 Klik detail retur menuju B44
Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B29
Home Pengolahan Data Master
Logout
Simpan Batal
Transaksi Nama kota
Form edit kota
Gambar III.71 Perancangan Antarmuka Edit Kota
29. Perancangan Antarmuka Manajemen Provinsi
Berikut dapat dilihat perancangan antarmuka manajemen provinsi dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.72.
header
footer Total provinsi: buah
Klik kembali menuju B02 Klik home menuju B02
Klik detail menuju B03 Klik ubah menuju B32
Klik tambah menuju B31 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen KP menuju B21 Klik manajemen member menuju B24
Klik manajemen kota menuju B27 Klik manajemen provinsi menuju B30
Klik manajemenongkir menuju B33 Klik manajemen hubungi menuju B36
Klik bakcup menuju B37 Klik restore menuju B38
Klik transaksi semua pesanan menuju B39 Klik dibayar menuju B40
Klik dikirm menuju B41 Klik diterima menuju B42
Klik manajemen retur menuju B43 Klik detail retur menuju B44
Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B30
Home Pengolahan Data Master
Logout
Tambah Cari
gambar
Kembali List provinsi
No Nama provinsi
Aksi Transaksi
Ubah Hapus
Gambar III.72 Perancangan Antarmuka Manajemen Provinsi 30. Perancangan Antarmuka Tambah Provinsi
Berikut dapat dilihat perancangan antarmuka tambah provinsi dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.73.
header
footer Klik batal menuju B30
Klik home menuju B02 Klik detail menuju B03
Klik simpan menuju B30 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen KP menuju B21 Klik manajemen member menuju B24
Klik manajemen kota menuju B27 Klik manajemen provinsi menuju B30
Klik manajemenongkir menuju B33 Klik manajemen hubungi menuju B36
Klik bakcup menuju B37 Klik restore menuju B38
Klik transaksi semua pesanan menuju B39 Klik dibayar menuju B40
Klik dikirm menuju B41 Klik diterima menuju B42
Klik manajemen retur menuju B43 Klik detail retur menuju B44
Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B31
Home Pengolahan Data Master
Logout
Simpan Batal
Transaksi Nama provinsi
Form Tambah provinsi
Gambar III.73 Perancangan Antarmuka Tambah Provinsi 31. Perancangan Antarmuka Edit Provinsi
Berikut dapat dilihat perancangan antarmuka edit provinsi dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.74.
header
footer Klik batal menuju B30
Klik home menuju B02 Klik detail menuju B03
Klik simpan menuju B30 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen KP menuju B21 Klik manajemen member menuju B24
Klik manajemen kota menuju B27 Klik manajemen provinsi menuju B30
Klik manajemenongkir menuju B33 Klik manajemen hubungi menuju B36
Klik bakcup menuju B37 Klik restore menuju B38
Klik transaksi semua pesanan menuju B39 Klik dibayar menuju B40
Klik dikirm menuju B41 Klik diterima menuju B42
Klik manajemen retur menuju B43 Klik detail retur menuju B44
Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B32
Home Pengolahan Data Master
Logout
Simpan Batal
Transaksi Nama provinsi
Form Tambah provinsi
Gambar III.74 Perancangan Antarmuka Edit Provinsi
32. Perancangan Antarmuka Manajemen Ongkos Kirim
Berikut dapat dilihat perancangan antarmuka manajemen ongkos kirim dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.75.
header
footer Total ongkir : buah
Klik kembali menuju B02 Klik home menuju B02
Klik detail menuju B03 Klik ubah menuju B35
Klik tambah menuju B34 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen KP menuju B21 Klik manajemen member menuju B24
Klik manajemen kota menuju B27 Klik manajemen provinsi menuju B30
Klik manajemenongkir menuju B33 Klik manajemen hubungi menuju B36
Klik bakcup menuju B37 Klik restore menuju B38
Klik transaksi semua pesanan menuju B39 Klik dibayar menuju B40
Klik dikirm menuju B41 Klik diterima menuju B42
Klik manajemen retur menuju B43 Klik detail retur menuju B44
Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B33
Home Pengolahan Data Master
Logout
Tambah Cari
gambar
Kembali List ongkos kirim
No Kategori pengiriman
Aksi Transaksi
Ubah Hapus
Kota Tujuan tarif
Gambar III.75. Perancangan Antarmuka Manajemen Ongkos Kirim 33. Perancangan Antarmuka Tambah Ongkos Kirim
Berikut dapat dilihat perancangan antarmuka tambah ongkos kirim dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.76.
header
footer Klik batal menuju B33
Klik home menuju B02 Klik detail menuju B03
Klik simpan menuju B33 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen KP menuju B21 Klik manajemen member menuju B24
Klik manajemen kota menuju B27 Klik manajemen provinsi menuju B30
Klik manajemenongkir menuju B33 Klik manajemen hubungi menuju B36
Klik bakcup menuju B37 Klik restore menuju B38
Klik transaksi semua pesanan menuju B39 Klik dibayar menuju B40
Klik dikirm menuju B41 Klik diterima menuju B42
Klik manajemen retur menuju B43 Klik detail retur menuju B44
Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B34
Home Pengolahan Data Master
Logout
Simpan Batal
Transaksi Kategori pengiriman
Form Tambah ongkir provinsi
Kota Tarif
Gambar III.76 Perancangan Antarmuka Tambah Ongkos Kirim 34. Perancangan Antarmuka Edit Ongkos Kirim
Berikut dapat dilihat perancangan antarmuka edit ongkos kirim dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.77
header
footer Klik batal menuju B33
Klik home menuju B02 Klik detail menuju B03
Klik simpan menuju B33 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen KP menuju B21 Klik manajemen member menuju B24
Klik manajemen kota menuju B27 Klik manajemen provinsi menuju B30
Klik manajemenongkir menuju B33 Klik manajemen hubungi menuju B36
Klik bakcup menuju B37 Klik restore menuju B38
Klik transaksi semua pesanan menuju B39 Klik dibayar menuju B40
Klik dikirm menuju B41 Klik diterima menuju B42
Klik manajemen retur menuju B43 Klik detail retur menuju B44
Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B35
Home Pengolahan Data Master
Logout
Simpan Batal
Transaksi Kategori pengiriman
Form edit ongkir Kota
Tarif
Gambar III.77 Perancangan Antarmuka Edit Ongkos Kirim
35. Perancangan Antarmuka Manajemen Hubungi
Berikut dapat dilihat perancangan antarmuka manajemen hubungi dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.78.
header
footer Total hubungi : buah
Klik kembali menuju B02 Klik home menuju B02
Klik detail menuju B03 Klik ubah menuju B35
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B36
Home Pengolahan Data Master
Logout Cari
gambar
Kembali List pesan
No email
Aksi Transaksi
Hapus subjek
pesan nama
Tgl
Gambar III.78 Perancangan Antarmuka Manajemen Hubungi 36. Perancangan Antarmuka Backup
Berikut dapat dilihat perancangan antarmuka backup dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.79.
header
footer Klik home menuju B02
Klik ubah menuju B35 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen Kategori Pengiriman menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B37
Home Pengolahan Data Master
Logout Cari
gambar Backup database
Transaksi
Proses bakcup database
Gambar III.79 Perancangan Antarmuka Backup 37. Perancangan Antarmuka Restore
Berikut dapat dilihat perancangan antarmuka restore dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.83.
header
footer Klik home menuju B02
Klik ubah menuju B35 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen Kategori Pengiriman menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B38
Home Pengolahan Data Master
Logout Cari
gambar restore database
Transaksi
restore database File backup
database .sql browse
Gambar III.80 Perancangan Antarmuka Restore
38. Perancangan Antarmuka Manajemen Orders-Semua Pesanan
Berikut dapat dilihat perancangan antarmuka manajemen orders-semua pesanan dari pembangunan aplikasi e-commerce di toko Yella Perdana yang
tercantum pada gambar III.81.
header
footer Total order : buah
Klik home menuju B02 Klik ubah status menuju B35
Klik detail menuju B35 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen Kategori Pengiriman menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B39
Home Pengolahan Data Master
Logout Cari
gambar
Kembali Manajemen pesanan
No Status order
Aksi Transaksi
detail Ubah status
Tgl order tarif
Id order Nama member
Cari order berdasarkan
Gambar III.81 Perancangan Manajemen Orders-Semua Pesanan 39. Perancangan Antarmuka Manajemen Orders-Semua Dibayar
Berikut dapat dilihat perancangan antarmuka manajemen orders-semua dibayar dari pembangunan aplikasi e-commerce di toko Yella Perdana yang
tercantum pada gambar III.82.
header
footer Total order : buah
Klik home menuju B02 Klik ubah status menuju B35
Klik detail menuju B35 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen Kategori Pengiriman menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B40
Home Pengolahan Data Master
Logout
Tambah Cari
gambar
Kembali Manajemen pesanan
No Status order
Aksi Transaksi
detail Ubah status
Tgl order tarif
Id order Nama member
Cari order berdasarkan
Gambar III.82 Perancangan Manajemen Orders-Semua Dibayar 40. Perancangan Antarmuka Manajemen Orders-Semua Dikirim
Berikut dapat dilihat perancangan antarmuka manajemen orders-semua dikirim dari pembangunan aplikasi e-commerce di toko Yella Perdana yang
tercantum pada gambar III.83.
header
footer Total order : buah
Klik home menuju B02 Klik ubah status menuju B35
Klik detail menuju B35 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen Kategori Pengiriman menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B41
Home Pengolahan Data Master
Logout
Tambah Cari
gambar
Kembali Manajemen pesanan
No Status order
Aksi Transaksi
detail Ubah status
Tgl order tarif
Id order Nama member
Cari order berdasarkan
Gambar III.83 Perancangan Manajemen Orders-Semua Dikirim
41. Perancangan Antarmuka Manajemen Orders-Pesanan Diterima
Berikut dapat dilihat perancangan antarmuka manajemen orders-pesanan diterima dari pembangunan aplikasi e-commerce di toko Yella Perdana yang
tercantum pada gambar III.84.
header
footer Total order : buah
Klik home menuju B02 Klik ubah status menuju B35
Klik detail menuju B35 Klik Logout menuju B01
Klik Manajemen Produk menuju B05 Klik manajemen merk menuju B08
Klik warna menuju B11 Klik manahemen bank menuju B14
Klik kurs menuju B17 Klik manajemen jasa pengiriman menuju B18
Klik manajemen Kategori Pengiriman menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B41
Home Pengolahan Data Master
Logout
Tambah Cari
gambar
Kembali Manajemen pesanan
No Status order
Aksi Transaksi
detail Ubah status
Tgl order tarif
Id order Nama member
Cari order berdasarkan
Gambar III.84 Perancangan Manajemen Orders-Pesanan Diterima 42. Perancangan Antarmuka Manajemen Retur
Berikut dapat dilihat perancangan antarmuka manajemen retur dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada
gambar III.85
header
footer Total retur : buah
Klik kembali menuju B02 Klik home menuju B02
Klik detail menuju B44 Klik ubah status menuju B45
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B43
Home Pengolahan Data Master
Logout
Tambah Cari
gambar
Kembali Manajemen pesanan
No Aksi
Transaksi
detail Ubah status
Tgl retur No resi
Id order Status retur
Cari order berdasarkan
Gambar III.85 Perancangan Manajemen Retur 43. Perancangan Antarmuka Detail Retur
Berikut dapat dilihat perancangan antarmuka detail retur dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.86.
header
footer Klik kembali menuju B44
Klik home menuju B02 Klik detail menuju B44
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B44
Home Pengolahan Data Master
Logout Cari
gambar
Kembali Manajemen pesanan
No Transaksi
alasan Nama produk
jumlah Cari order berdasarkan
Gambar III.86 Perancangan Antarmuka Detail Retur
44. Perancangan Antarmuka Ubah Status
Berikut dapat dilihat perancangan antarmuka ubah status dari pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.87.
header
footer Klik kembali menuju B43
Klik simpan menuju B43 Klik home menuju B02
Klik Logout menuju B01 Klik Manajemen Produk menuju B05
Klik manajemen merk menuju B08 Klik warna menuju B11
Klik manahemen bank menuju B14 Klik kurs menuju B17
Klik manajemen jasa pengiriman menuju B18 Klik manajemen KP menuju B21
Klik manajemen member menuju B24 Klik manajemen kota menuju B27
Klik manajemen provinsi menuju B30 Klik manajemenongkir menuju B33
Klik manajemen hubungi menuju B36 Klik bakcup menuju B37
Klik restore menuju B38 Klik transaksi semua pesanan menuju B39
Klik dibayar menuju B40 Klik dikirm menuju B41
Klik diterima menuju B42 Klik manajemen retur menuju B43
Klik detail retur menuju B44 Klik ubah status menuju B45
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px B45
Home Pengolahan Data Master
Logout
Simpan kembali
Transaksi Id retur
Ubah Status Retur Status retur
Tgl retur No res pengiriman
Gambar III.87 Perancangan Antarmuka Ubah Status III.5.3.5 Perancangan Antarmuka Admin
1. Perancangan Antarmuka Login Berikut dapat dilihat perancangan antarmuka login admin dari pembangunan
aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.88.
username password
login Lupa password
header
gambar
footer Silahkan Login Terlebih Dahulu
Klik link login menuju C02 Klik Lupa password menuju C09
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px C01
Gambar III.88 Perancangan Antarmuka Login
2. Perancangan Antarmuka Home Admin Berikut dapat dilihat perancangan antarmuka home admin dari pembangunan
aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.89.
header
footer Superadmin, selamat datang
Apa yang akan anda lakukan hari ini? Klik home menuju C02
Klik home aksi-detail menuju C03 Klik Manajemen User menuju C04
Klik Laporan Stok menuju C05 Klik Laporan Stok-Proses menuju C06
Klik Laporan Penjualan menuju C07 Klik Laporan Penjualan-Proses menuju C08
Klik logout menuju C02
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px C02
Home Pengolahan Data Master
Logout 10 Orde Terkahir
Id Order Nama Member
Status Order Tanggal Order
Aksi Detail
Daftar ID Order Daftar Nama Member
Daftar Status Order Daftar Tanggal Order
Gambar III.89 Perancangan Antarmuka Home Admin
3. Perancangan Antarmuka Aksi-Detail Berikut dapat dilihat perancangan antarmuka aksi-detail dari pembangunan
aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.90.
header
Isi Detail Order
footer Detail Order
Klik home menuju C02 Klik home aksi-detail menuju C03
Klik Manajemen User menuju C04 Klik Laporan Stok menuju C05
Klik Laporan Stok-Proses menuju C06 Klik Laporan Penjualan menuju C07
Klik Laporan Penjualan-Proses menuju C08 Klik kembali menuju C02
Klik logout menuju C02
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px C03
Home Pengolahan Data Master
Logout
Kembali
Gambar III.90 Perancangan Antarmuka Aksi-Detail
4. Perancangan Antarmuka Manajemen Operator Berikut dapat dilihat perancangan antarmuka manajemen operator dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.91.
header
footer Total admin : buah
Klik home menuju C02 Klik home aksi-detail menuju C03
Klik Manajemen User menuju C04 Klik Laporan Stok menuju C05
Klik Laporan Stok-Proses menuju C06 Klik Laporan Penjualan menuju C07
Klik Laporan Penjualan-Proses menuju C08 Klik kembali menuju C02
Klik logout menuju C02
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px C04
Home Pengolahan Data Master
Logout
Tambah Cari
gambar
Kembali List Admin
No Nama Admin
Username Email
Level Aksi
Password ubah
hapus
Gambar III.91 Perancangan Antarmuka Manajemen Operator
5. Perancangan Antarmuka Laporan Stok Berikut dapat dilihat perancangan antarmuka laporan stok dari pembangunan
aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.92.
header
footer Klik home menuju C02
Klik home aksi-detail menuju C03 Klik Manajemen User menuju C04
Klik Laporan Stok menuju C05 Klik Laporan Stok-Proses menuju C06
Klik Laporan Penjualan menuju C07 Klik Laporan Penjualan-Proses menuju C08
Klik Proses menuju C06 Klik logout menuju C02
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px C05
Home Pengolahan Data Master
Logout Laporan Stok Barang
Dari Tanggal Sampai
Proses
Gambar III.92 Perancangan Antarmuka Laporan Stok
6. Perancangan Antarmuka Laporan Stok-proses Berikut dapat dilihat perancangan antarmuka laporan stok-proses dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.93.
header
footer Klik home menuju C02
Klik home aksi-detail menuju C03 Klik Manajemen User menuju C04
Klik Laporan Stok menuju C05 Klik Laporan Stok-Proses menuju C06
Klik Laporan Penjualan menuju C07 Klik Laporan Penjualan-Proses menuju C08
Klik Proses menuju C06 Klik logout menuju C02
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px C06
Home Pengolahan Data Master
Logout Laporan Stok Barang
No Nama
ID Stok
Tanggal Masuk Harga
Total Produk = buah Total Stok = buah
Gambar III.93 Perancangan Antarmuka Laporan Stok-proses
7. Perancangan Antarmuka Laporan Penjualan Berikut dapat dilihat perancangan antarmuka laporan penjualan dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.94.
header
footer Klik home menuju C02
Klik home aksi-detail menuju C03 Klik Manajemen User menuju C04
Klik Laporan Stok menuju C05 Klik Laporan Stok-Proses menuju C06
Klik Laporan Penjualan menuju C07 Klik Laporan Penjualan-Proses menuju C08
Klik Proses menuju C08 Klik logout menuju C02
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px C07
Home Pengolahan Data Master
Logout Laporan Penjualan
Dari Tanggal Sampai
Proses Status Order :
--Pilih status --
Gambar III.94 Perancangan Antarmuka Laporan Penjualan
8. Perancangan Antarmuka Laporan Penjualan Proses Berikut dapat dilihat perancangan antarmuka laporan penjualan proses dari
pembangunan aplikasi e-commerce di toko Yella Perdana yang tercantum pada gambar III.95.
header
footer Klik home menuju C02
Klik home aksi-detail menuju C03 Klik Manajemen User menuju C04
Klik Laporan Stok menuju C05 Klik Laporan Stok-Proses menuju C06
Klik Laporan Penjualan menuju C07 Klik Laporan Penjualan-Proses menuju C08
Klik Proses menuju C08 Klik logout menuju C02
Keterangan : Ukuran Layar : Dinamis Default 1366x768
Type ukuran Font : Times New Roman 10px C08
Home Pengolahan Data Master
Logout Laporan Penjualan
No Faktur
Nama Produk Total Bayar
Tanggal Order Jumlah
Jumlah Pesanan yang : Buah
Gambar III.95 Perancangan Antarmuka Laporan Penjualan
III.5.3.6 Perancangan Pesan
Perancangan pesan merupakan pesan-pesan yang akan ditampilkan di sistem ketika sistem digunakan. Pesan yang ada di aplikasi ini adalah sebagai
berikut :
OK Username atau password
salah, silahkan coba lagi M01
OK Maaf, Username Telah
Digunakan M02
OK Maaf, Username Telah
Digunakan M03
OK Aktivasi account telah
dikirim kan ke email Anda, Silahkan cek email Anda
M04 OK
Anda tidak punya akses terhadap halaman ini
M05 OK
Maaf, admin yang Anda coba masukan sudah ada
di sistem M06
OK admin sudah tersimpan
M07 OK
Apakah Anda benar-benar akan menghapus ?
M08 OK
bank sudah tersimpan M09
OK Barang Sudah Tersimpan
M10 OK
Jasa pengiriman sudah tersimpan
M11 OK
Kategori pengiriman sudah tersimpan
M12
OK Maaf, jasa pengiriman
yang Anda coba masukan sudah ada di sistem
M13 OK
Maaf, kota yang Anda coba masukan sudah ada
di sistem M14
OK kota sudah tersimpan
M15
OK Maaf, member yang Anda
coba masukan sudah ada di sistem
M16 OK
Member Sudah Tersimpan M17
OK Maaf, merk yang Anda
coba masukan sudah ada di sistem
M18
OK merk sudah tersimpan
M19 OK
Maaf, ongkir yang Anda coba masukan sudah ada
di sistem M20
OK ongkir Sudah Tersimpan
M21
Gambar III.96 Perancangan Pesan
III.5.3.7 Jaringan Sismatik
1. Jaringan semantik pengunjung
A01 A02
A03
A04 A05
A06 A07
A08
M01,M04,M09
M01, M02,M03,M04,M05,M06,M07
,M08,M09,M10.M11 ,M12,M13,M14
M04,M09
Gambar III.97 Semantik Pengunjung
2. Jaringan semantic member
A01 A06
A11
A02 A03
A04
A09 A12
A13 A14
M01, M02,M03,M04,M05,M06,M07
,M08,M09,M10.M11 ,M12,M13,M14
A05 M04,M09
Gambar III.98 semantik member
3. Jaringan semantic operator
B01
B02 B03
B18 B05
B08 B17
B27
B11 B14
B21 B24
B19 B06
B09 B12
B15 B22
B25 B30
B33 B37
B38
B07 B10
B13 B16
B20 B23
B26 B29
B28 B32
B31 B35
B34 M01
M03,M04
M03,M04 M05,M06
M07,M08 M09,M10
M10,M11 M10,M11
M12,M13 M14,M15
M19,M20 M14,M16
M06,M07 M06,M07
M06,M07 M06,M07
M06,M07 M06,M07
M06,M07 M02,M05
M14,13 M05,M15
Gambar III.99 semantik operator
4. Jaringan semantic pemilik Admin
C01
C02
C04 C05
C03
M01, M02,M03,M04,M05,M09,M10
.M11
Gambar III.100 semantik Admin
III.5.3.8 Perancangan Prosedural Algoritma
Sebagai langkah terakhir dalam perancangan yaitu merancang prosedural yang akan diimplementasikan ke dalam sistem. Prosedur ini akan digunakan
sebagai algoritma dasar dalam mengkodekan prosedur yang ada. Adapun perancangan prosedural untuk pembangunan aplikasi e-commerce yang akan
dibangun adalah sebagai berikut :
a. Prosedur Login