BANNER
AKUN ANGGOTA
INFORMASI MENU PILIHAN
FOOTER BERITA TERKINI
KALENDER
KONTAK KAMI POLLING
STATISTIK
IKLAN
Gambar 4.32 Perancangan Antar Muka
4.2.4.1 Perancangan Input
Rancangan input merupakan gambaran dalam pembuatan antarmuka untuk memasukkan data yang terdiri dari perancangan input pengunjung, input user dan
perancangan input petugas. 1. Input pengunjung
a. Perancangan input pendaftaran anggota Berikut adalah perancangan form pendaftaran anggota yang akan
diisi oleh pengunjung yang akan menjadi anggota.
Biodata
Nama Lengkap
Alamat Kota
Kode Pos
Keamanan
Email Password
Min. 6 karakter
Ulangi Password
XXXXX
Telepon
XXXX XXXX
XXXXXXXX XXXXXXX
XXXXXXX
Pendaftaran Akun Anggota
Daftar Batal
XXXXXX
Provinsi
XXXXXXXX
Format :email_andanamaportal.com
XXXXXXXX
Gambar 4.33 Perancangan Input Pendaftaran Anggota
2. Input Anggota a. Perancangan input login anggota.
Form untuk anggota yang bertujuan ingin masuk kehalaman utama anggota.
AKUN ANGGOTA
XXXXXXX Masuk
batal
Gambar 4.34 Perancangan Input Login Anggota
b. Perancangan input pemesanan produk. Form perancangan input pemesanan yang dilakukan anggota
dimana anggota melakukan transaksi pemesanan setelah melakukan pemilihan produk.
Faktur Kode
Nama Ukuran
Warna Jumlah
keterangan
Pemesanan Produk
XXXXX XXXXX
XXXXX
XXXX XXXX
XXX
Kodi
Pesan Batal
XXXXXXXXX
Foto Ukuran
Warna Stock
Harga
foto
XXXX XXXX
XXXX XXXX
Pemberitahuan
· Pemesanan untuk pulau jawa Min. 250 Kodi untuk setiap produk · Pemesanan untuk luar pulau jawa Min. 350 Kodi untuk setiap produk
isi ket. dgn nama pabrik dan ket. lain
mengenai produk
Gambar 4.35 Perancangan Input Pemesanan produk
c. Perancangan input pemesanan produk desain sendiri Form perancangan input pemesanan dengan pemilihan desain
sendiri, masukan foto desain sendiri dan berilah keterangan untuk memperjelaskan keterangan pada desain.
Pemesanan Produk
Faktur XXXXX
Kode Nama
Ukuran Warna
Jumlah XXXXX
XXXXX
XXXX XXXX
XXX
Kodi
Pesan Batal
Foto Keterangan
XXXXXXX Browse...
XXXXXXXXXX
Pemberitahuan
· Pemesanan untuk pulau jawa Min. 250 Kodi untuk setiap produk · Pemesanan untuk luar pulau jawa Min. 350 Kodi untuk setiap
produk
isi ket. dgn nama pabrik dan ket. lain mengenai produk
Gambar 4.36 Perancangan Input Pemesanan Produk dengan Desain sendiri
d. Perancangan input tujuan pengiriman Form input ini menginformasikan untuk penginputan kota dan
alamat lengkap tujuan pengiriman produk yang telah dipesan.
Tujuan Pengiriman
Nama Produk Ukuran
Warna Harga
Jumlah XXXX
XXXX XXXX
XXXX
Pemberitahuan ·
Pemesanan untuk pulau jawa Min. 250 Kodi untuk setiap produk
·
Pemesanan untuk luar pulau jawa Min. 350 Kodi untuk setiap produk
Total XXXX
XXXX Rp
Rp
Nama Anggota Nama Tujuan
Provinsi Tujuan Kota Tujuan
Alamat Tujuan Kode Pos Tujuan
Telepon Tujuan
XXXX XXX
Setuju XXXXXXXXX
XXX
XXX XXX
XXXX
Belum Termasuk Ongkos Kirim
Gambar 4.37 Perancangan Input Tujuan Pengiriman
e. Perancangan input konfirmasi pembayaran Halaman konfirmasi pada anggota harus menginputkan konfirmasi
pembayaran untuk nantinya di setujui oleh petugas.
Konfirmasi Pembayaran
Nama Anggota Tanggal Pembayaran
No. Pesanan No. Transfer
Atas Nama Total Pembayaran
XXXXXXX XX
XXXXXX XXXX
XXXX XXXXXXX
XXXXXXX
Rp
XXXXXXX
,-
Konfirmasi Batal
Gambar 4.38 Perancangan Input Konfirmasi Pembayaran
3. Input Petugas a. Perancangan input login petugas
Pada halaman ini petugas diminta untuk mengisikan username dan password yang benar untuk dapat melakukan proses pengolahan data. Jika
username atau password tidak diisi atau salah maka petugas tidak dapat melakukan proses pengolahan data.
Akun Petugas
Usename Pasword
XXXXXXX XXXXXXX
Masuk Daftar
Gambar 4.39 Perancangan Input Login Petugas
b. Perancangan input tambah produk Pada halaman tambah produk, digunakan petugas untuk menambah
produk – produk yang akan dijual.
Tambah Produk
Kategori Kode Produk
Nama Produk Harga
Ukuran Warna
Stock Foto
XXXXX XXXXX
XXXXXX
Rp. ,-
XXXXX XXXX
XXXXX XXX
XXXXXXXX Browse...
Simpan Batal
Kodi Kodi
Gambar 4.40 Perancangan Input Tambah Produk
c. Perancangan input tambah kategori Pada halaman tambah katagori produk, digunakan petugas untuk
menambah katagori produk.
Tambah Kategori
Nama Kategori Kode Kategori
XXXXX XXXXX
Simpan Batal
Gambar 4.41 Perancangan Input Tambah Kategori
d. Perancangan input detil produk Pada halman input detil produk ini bertujuan untuk menambahkan
produk-produk yang akan ditampilkan ke halaman utama anggota.
Detil Produk
Ukuran Warna
Harga Stock
Simpan Batal
Foto Ukuran
Warna Harga
Stock
foto
XXXX XXXX
XXXX XXXX
+tambah produk+ Kategori Produk
Kode produk Nama Produk
: :
: XXXXXX
XXXXXX XXXXXX
Aksi Ubah | Hapus
XX
Tambah Produk
XXXXXX XXXXXX
Rp
XXXX
,- Kodi
XXXXX
Kodi Foto
XXXXXXXXXX Browse...
Gambar 4.42 Perancangan Input Detil Produk
e. Perancangan input tambah kota Pada halaman ini untuk penginputan kota yang bertujuan untuk
penambahan kota yang disediakan untuk menginputkan ongkos pengiriman berdasarkan provinsi.
Kota Harga
Tambah Kota
Provinsi
XXXXX XXXXX
Simpan Batal
XXXXX
Gambar 4.43 Perancangan Input Kota
4.2.4.2 Perancangan output
