Perancangan Input Perancangan Antar Muka

Menu Admin Kelola Data Laporan Login Logout Data Admin Data Customer Data Supplier Data Produk Data Penjualan Data Pembelian Data Retur Data Kota Laporan Penjualan Laporan Pembelian Gambar 4.26. Struktur Menu Admin

4.2.2 Perancangan Input

Perancangan input merupakan suatu alat pemasukan data yang dibutuhkan dalam pemrosesan pembuatan-pembuatan laporan yang diinginkan. Input yang dimaksud disini adalah input data yang langsung dihubungkan ke proses komputer melalui entry dengan keyboard. Adapun perancangan input tersebut adalah sebagai berikut. 1. Desain Login dan Register konsumen Tampilan login dan register berfungsi untuk pelanggan login sebagai konsumen dan register atau daftar untuk menjadi konsumen dimana pelanggan memasukan data sebagai mana gambar di bawah. FOOTER Copyright 2014 By SB Store SB STORE Home | Produk | Tentang Kami | Informasi | Kontak Selamat Datang, Pelanggan | Login dan Register | Shoping Cart LOGIN Email Password LOGIN CUSTOMER Gambar 4.27. Perancangan Input Login 2. Desain Daftar Customer Tampilan register berfungsi untuk register atau daftar untuk menjadi konsumen dimana pelanggan memasukan data sebagai mana gambar di bawah. FOOTER Copyright 2014 By SB Store SB STORE DAFTAR CUSTOMER Home | Produk | Tentang Kami | Informasi | Kontak Selamat Datang, Pelanggan | Login dan Register | Shoping Cart SIGN UP ID Customer Email Password Nama Pria Wanita Gender Alamat Telepon Kode Pos Provinsi Kota Gambar 4.28. Perancangan Input Register 3. Desain Login Admin HEADER LOGO SUBMIT Username Password Gambar 4.29. Perancangan Input Login Admin 4. Desain Tambah Data Admin Tampilan tambah data admin berfungsi untuk menambah data admin dengan memasukan data – data sebagai mana gambar di bawah. GAMBAR HEADER TAMBAH Username Password TAMBAH DATA ADMIN Nama HALAMAN ADMIN DATA ADMIN DATA CUSTOMER LOG OUT DATA PEMBELIAN DATA PENJUALAN KOTA DATA MERK DATA KATEGORI DATA PRODUK DATA SUPPLIER DATA RETUR LAPORAN PENJUALAN LAPORAN PEMBELIAN Gambar 4.30. Perancangan Input Tambah Data Admin 5. Desain Tambah Data Supplier Tampilan tambah data supplier berfungsi untuk menambahkat data supplier dengan memasukan data – data sebagai mana gambar di bawah. GAMBAR HEADER SIMPAN ID Supplier Nama Toko TAMBAH DATA SUPPLIER Nama Pemilik HALAMAN ADMIN DATA ADMIN DATA CUSTOMER LOG OUT DATA PEMBELIAN DATA PENJUALAN KOTA DATA MERK DATA KATEGORI DATA PRODUK DATA SUPPLIER Alamat No Telepon RESET DATA RETUR LAPORAN PENJUALAN LAPORAN PEMBELIAN Gambar 4.31. Perancangan Input Tambah Data Supplier 6. Desain Tambah Data Produk Tampilan tambah data produk berfungsi untuk menambah data produk sepatu dengan memasukan data – data sebagai mana gambar di bawah. GAMBAR HEADER SIMPAN ID Sepatu Nama Produk TAMBAH PRODUK Kategori HALAMAN ADMIN DATA ADMIN DATA CUSTOMER LOG OUT DATA PEMBELIAN DATA PENJUALAN KOTA DATA MERK DATA KATEGORI DATA PRODUK DATA SUPPLIER Merk Ukuran RESET Warna Harga Harga Beli Stok Keterangan Choose File Image DATA RETUR Berat Stok Maksimal Stok Minimal LAPORAN PENJUALAN LAPORAN PEMBELIAN Gambar 4.32. Perancangan Input Tambah Data Produk 7. Desain Tambah Kategori Sepatu Tampilan tambah kategori sepatu berfungsi untuk menambah data kategori sepatu dengan memasukan data – data sebagai mana gambar di bawah. GAMBAR HEADER SIMPAN ID Kategori Nama TAMBAH KATEGORI SEPATU HALAMAN ADMIN DATA ADMIN DATA CUSTOMER LOG OUT DATA PEMBELIAN DATA PENJUALAN KOTA DATA MERK DATA KATEGORI DATA PRODUK DATA SUPPLIER RESET DATA RETUR LAPORAN PENJUALAN LAPORAN PEMBELIAN Gambar 4.33. Perancangan Input Tambah Kategori Sepatu 8. Desain Tambah Merk Sepatu Tampilan tambah merk sepatu berfungsi untuk menambah data merk sepatu dengan memasukan data – data sebagai mana gambar di bawah. GAMBAR HEADER SIMPAN ID Merk Nama TAMBAH MERK SEPATU HALAMAN ADMIN DATA ADMIN DATA CUSTOMER LOG OUT DATA PEMBELIAN DATA PENJUALAN KOTA DATA MERK DATA KATEGORI DATA PRODUK DATA SUPPLIER RESET DATA RETUR LAPORAN PENJUALAN LAPORAN PEMBELIAN Gambar 4.34. Perancangan Input Tambah Merk Sepatu 9. Desain Tambah Kota Tampilan tambah kota berfungsi untuk menambah data kota dengan memasukan data – data sebagai mana gambar di bawah. GAMBAR HEADER SIMPAN ID Kota Nama TAMBAH KOTA HALAMAN ADMIN DATA ADMIN DATA CUSTOMER LOG OUT DATA PEMBELIAN DATA PENJUALAN KOTA DATA MERK DATA KATEGORI DATA PRODUK DATA SUPPLIER RESET DATA RETUR LAPORAN PENJUALAN LAPORAN PEMBELIAN Gambar 4.35. Perancangan Input Tambah Kota 9. Desain Keranjang Belanja Tampilan ini berfungsi untuk menampilkan produk apa saja yang dibeli oleh konsumen pada tampilan ini pun konsumen dapat menambah berapa produk yang akan dibeli atau menghapus produk yang tidak jadi dibeli. FOOTER Copyright 2014 By SB Store SB STORE SHOPPING CART Home | Produk | Tentang Kami | Informasi | Kontak Selamat Datang, Pelanggan | Login dan Register | Shoping Cart Add Cart Clear Cart Serial Nama Produk Harga Jumlah Subtotal Opsi GRAND TOTAL : LANJUT BELANJA SELESAI BELANJA HAPUS Gambar 4.36. Perancangan Input Shopping Cart 10. Desain Data Pengiriman Tampilan ini berfungsi untuk peng-input-an data pengiriman barang setelah konsumen selesai belanja. FOOTER Copyright 2014 By SB Store SB STORE DATA PENGIRIMAN Home | Produk | Tentang Kami | Informasi | Kontak Selamat Datang, Pelanggan | Login dan Register | Shoping Cart ID Penjualan Nama Penerima Alamat Email Provinsi SELESAI Kota Gambar 4.37. Perancangan Input Data Pengiriman

4.2.3 Perancangan Output