3.4 Perancangan Sistem
Perancangan sistem ditujukan untuk memberikan gambaran umum mengenai sistem yang akan dibuat.
3.4.1 Perancangan Basis Data 3.4.1.1
Logical Design
Pada gambar di bawah ini dijelaskan mengenai relasi antar tabel yang ada di sistem :
id_memberPK username
password nama
alamat email
no_tlp Tabel Member
kode_barangPK id_kategoriFK
nama_barang warna
harga gambar
deskripsi Tabel Furniture
id_memberFK kode_barangFK
no_penjualanPK tgl_beli
jumlah harga_transaksi
harga_total pesanan
no_resi Tabel Penjualan
id_adminPK username
password Tabel Admin
Id_memberFK no_komentarPK
tgl_tulis isi_komentar
Tabel Komentar id_kategoriPK
kategori Tabel Kategori
Gambar 3.16 Logical Design
Keterangan : PK : Primary Key, merupakan kunci primer yang bersifat unik pada suatu
tabel.
FK : Foreign Key, merupakan kunci tamu pada suatu tabel dan kunci primer pada tabel lain.
3.4.1.2 Uji Normalisasi
Tahapan-tahapan normalisasi untuk mengecek masing-masing tabel pada tahap logical design tersebut adalah sebagai berikut :
Normalisasi I :
Setiap perpotongan baris dan kolom pada setiap tabel hanya terdapat satu harga data, sehingga setiap tabel telah memenuhi bentuk normalisasi I.
Normalisasi II :
Setiap tabel yang telah memenuhi bentuk normal I, masing-masing atribut bergantung penuh pada primary key, sehingga masing-masing tabel tersebut
telah memenuhi bentuk normalisasi II.
Normalisasi III :
Setiap tabel yang telah memenuhi bentuk normal II, pada masing-masing atribut yang bukan primary key tidak tergantung transitif terhadap atribut
lain yang juga bukan merupakan primary key.
Kesimpulan :
Setelah melewati Uji Normalisasi III, maka gambar logical design menjadi sebagai berikut :
id_memberPK username
password nama
alamat email
no_tlp Tabel Member
kode_barangPK id_kategoriFK
nama_barang warna
harga gambar
deskripsi Tabel Furniture
id_memberFK no_penjualanPK
tgl_beli harga_total
pesanan no_resi
Tabel Penjualan
id_adminPK username
password Tabel Admin
id_memberFK no_komentarPK
tgL_tulis isi_komentar
Tabel Komentar id_kategoriPK
kategori Tabel Kategori
no_penjualanFK kode_barangFK
jumlah harga_transaksi
Tabel Detail Penjualan
Gambar 3.17 Logical Design setelah uji normalisasi III.
Keterangan : PK : Primary Key, merupakan kunci primer yang bersifat unik pada suatu
tabel. FK : Foreign Key, merupakan kunci tamu pada suatu tabel dan kunci
primer pada tabel lain.
3.4.1.3 Physical Design
Rancangan fisik physical design dari tabel tersebut dapat dilihat pada tabel-tabel berikut ini :
Tabel 3.1 Tabel Member Nama Field
Tipe data Ukuran
field Keterangan
id_member Integer
50 Primary Key
username Varchar
50 password
Varchar 15
nama Varchar
50 alamat
Varchar 50
email Varchar
50 no_tlp
Varchar 25
Tabel 3.2 Tabel Admin Nama Field
Tipe data Ukuran
field Keterangan
id_admin Integer
50 Primary Key
username Varchar
50 password
Varchar 50
Tabel 3.3 Tabel Kategori Nama Field
Tipe data Ukuran
field Keterangan
id_kategori Varchar
50 Primary Key
kategori Varchar
100
Tabel 3.4 Tabel Furniture Nama Field
Tipe data Ukuran
field Keterangan
kode_barang Varchar
50 Primary Key
id_kategori Varchar
50 Foreign Key
nama_barang Varchar
100 warna
Varchar 20
harga Integer
50 gambar
Varchar 50
deskripsi Text
Tabel 3.5 Tabel Penjualan Nama Field
Tipe data Ukuran
field Keterangan
no_penjualan Integer
100 Primary Key
id_member Integer
50 Foreign Key
tgl_beli Date
harga_total Text
pesanan Text
no_resi Varchar
100
Tabel 3.6 Tabel Detail Penjualan Nama Field
Tipe data Ukuran
field Keterangan
no_penjualan Integer
100 Primary Key dan Foreignkey
kode_barang Varchar
50 Foreign Key
jumlah Text
harga_transaksi Text
Tabel 3.7 Tabel Komentar Nama Field
Tipe data Ukuran
field Keterangan
no_komentar Integer
100 Primary Key
id_member Integer
50 Foreign Key
tgl_tulis Date
isi_komentar Text
3.4.2 Perancangan Antar Muka
Pada bagian ini desain antar muka sistem dibagi menjadi dua bagian yaitu untuk User Member dan untuk Administrator.
1. UserMember Beberapa disain antar muka yang akan dirancang untuk Member adalah
sebagai berikut :
Halaman Home
Gambar 3.18 Disain halaman Home
Halaman Daftar Member
Gambar 3.19 Disain halaman Daftar Member
Halaman Produk
Gambar 3.20 Disain halaman Produk
Halaman Pesanan Khusus
Gambar 3.21 Disain halaman Pesanan
Halaman Cara Belanja
Gambar 3.22 Disain halaman Cara Belanja
Halaman Keranjang Belanja
Gambar 3.23 Disain halaman Keranjang Belanja
Halaman Buku Tamu
Gambar 3.24 Disain halaman Buku Tamu
Halaman Tentang Kami
Gambar 3.25 Disain halaman Tentang Kami
Halaman Kiriman Barang
Gambar 3.26 Disain halaman kiriman barang
2. Administrator Beberapa disain antar muka yang akan dirancang untuk Admin adalah
sebagai berikut : Halaman Login Admin
Gambar 3.27 Disain halaman Login Admin
Halaman Home Admin
Gambar 3.28 Disain halaman Home Admin
Halaman Kelola Barang
Gambar 3.29 Disain halaman Kelola Barang
Halaman Tambah Barang
Gambar 3.30 Disain halaman Tambah Barang
Halaman Kelola Order
Gambar 3.31 Disain halaman Kelola Pembelian
Halaman Kelola Komentar
Gambar 3.32 Disain halaman Kelola Komentar
Halaman Kelola Resi JNE
LOTUS FURNITURE | ADMINISTRATOR
Alamat Nama
Rai Made
Nomer Resi Jogja
Denpasar 143541354
4564654 Resi yang ditampilkan
Hapus Hapus
Tambah Resi
Gambar 3.33 Disain halaman Resi JNE
Halaman Tambah Resi JNE
Gambar 3.34 Disain halaman Tambah Resi JNE
Halaman Laporan Penjualan
Gambar 3.35 Disain halaman Laporan Penjualan
Halaman LogOut
Gambar 3.36 Disain halaman Logout
59
BAB IV IMPLEMENTASI SISTEM
4.1 Tampilan situs Lotus Furniture dan potongan listing program.
Tampilan situs pada Toko Lotus Furniture ini dibagi menjadi dua bagian yaitu bagian user dan bagian administrator.
4.1.1 Halaman User
Halaman Home Halaman ini disebut dengan index.php. Halaman ini yang akan
dilihat pertama kali oleh user ketika mengakses situs ini. Pada halaman ini user akan diminta untuk login dengan memasukkan username dan
password atau memilih menu daftar member. Halaman ini juga menampilkan gambar barang-barang yang dijual di Toko Lotus Furniture.
Gambar 4.1 Halaman Home