T0 562013033 BAB III
BAB III
PERANCANGAN SISTEM
3.1 Ruang Lingkup
Berdasarkan untuk memenui dan memudahkan kebutuhan penjualan dan
pembelian, pembuatan web ini ditujukan untuk memudahkan pembeli dan
penjual, dari berbagai macam kalangan untuk melakukan jual beli diseluruh daerah di indonesia.
3.2 Flowchart
Flowchart adalah bagan atau chart yang menunjukkan alir atau
flow di dalam program atau prosedur sistem secara logika. Berikut adalah
gambaran Flowchart “Website Sebagai Media Penjualan Buku Dengan
PHP” :
WEBSITE
Menu Mulai
Request Sign up Pencarian Cara Pembelian
Profil Home
Admin Page
Users
Data Penerbit Data Kategori Data Member Data Buku Data Request Buku Data Pesanan LogOut Informasi Terkini Daftar Login
Login ? No
Keranjang
Yes Lihat Buku
Check Out
(2)
Keterangan :
Website memiliki dual login yaitu login admin dan
user.
Ketika user memasuki website pertama kali user akan
masuk kedalam menu home.
Dalam website terapat menu-menu yang memiliki
fungsi tersendiri.
Home berfungsi sebagai menu utama atau halaman
utama.
Profil merupakan isi dari beberapa data informasi dari
website ini
Cara pembelian merupakan panduan untuk user dalam
melakukan pembelian.
Request Book, user dapat memasukan keterangan buku
untuk dicarikan jika users tidak menemukannya dalam website ini.
Sign Up merupakan menu untuk mendaftar, jika sudah
mendaftar sebelumnya dapat langsung melakukan
login.
Pencarian Buku berguna untuk membantu user mencari
buku dengan mudah.
Keranjang berfungsi untuk, menampilkan daftar buku
yang telah dipilih.
Lihat buku berfungsi untuk mengembalikan user pada
(3)
Check Out berfungsi untuk mentransfer buku yang telah dipilih kedalam database pesanan untuk diproses
oleh admin.
Admin Page merupakan halaman admin terdiri dari sub
menu informasi terkini dan keluar.
Informasi Terkini berisi, pesanan dari user hari ini.
Log Out, admin dapat keluar dari website.
Data Penerbit, berisi seputar Tambah, Daftar dan
Pencarian Penerbit.
Data Kategori, berisi seputar Tambah, Daftar dan
Pencarian Kategori.
Data Member, berisi seputar Tambah, Daftar dan
Pencarian Member.
Data Buku, berisi seputar Tambah, Daftar dan
Pencarian Buku.
Data Request, bersisi seputar Daftar dan Pencarian
Request.
Data Pesanan, berisi seputar Daftar Pesanan dan Daftar
(4)
3.3 Lembar Kerja Tampilan (LKT)
Perancangan antarmuka “Website Penjualan Buku”digambarkan seperti
ini :
1. Lembar Kerja Tampilan Website
MENU
HEADER
FOOTER CONTENT
KATEGORI DAN PENERBIT MAMBER DAN BUKU
Gambar 3.2 LKT Tampilan Website
2. Lembar Kerja Tampilan Admin
HEADER
ADMIN PAGE
DATA PENERBIT
DATA KATEGORI
DATA MEMBER
DATA BUKU
DATA REQUEST BUKU
HEADER
ADMIN PAGE
DATA PENERBIT
DATA KATEGORI
DATA MEMBER
DATA BUKU
DATA PESANAN
FOOTER
CONTENT
(5)
3. Lembar Kerja Tampilan Profil
Header
Footer
Kategori dan Penerbit Keterangan Profil Mamber dan Buku
Menu
Gambar 3.4 LKT Tampilan Profil
4. Lembar Kerja Tampilan Cara Pembelian
Header
Footer
Kategori dan Penerbit Cara Pembelian Mamber dan Buku
Menu
(6)
5. Lembar Kerja Tampilan Request
Header
Footer
Kateg ori dan Penerbit Menu Request Mamber dan Buku
Menu
Nama
Penerbit
Penulis
Deskripsi
Request
Gambar 3.6 LKT Tampilan Request
6. Lembar Kerja Tampilan Sign Up
Header
Footer
Kategori dan Penerbit Menu Sign Up Mamber dan Buku Menu
Nama
Login Daftar
(7)
7. Lembar Kerja Tampilan Pencarian
Header
Footer
Kategori dan Penerbit Menu Pencarian Mamber dan Buku Menu
Pencarian Berdasarkan
Cari
Gambar 3.8 LKT Tampilan Pencarian
8. Lembar Kerja Tampilan Admin Login
Username
Password
Login
(8)
9. Lembar Kerja Tampilan Informasi Terkini
Header
Footer
Menu Admin Menu Stok Buku Dan Pesanan Buk u
Gambar 3.10 LKT Tampilan Informasi Terkini
10.Lembar Kerja Tampilan Tambah Penerbit
Header
Footer
Menu Admin Tambah Penerbit
Nama Alamat Email Kota No Telepo n
Simpan Ris et
(9)
11.Lembar Kerja Tampilan View Penerbit
Header
Footer
Menu Admin View Data Penerbit
Gambar 3.12 LKT Tampilan View Penerbit
12.Lembar Kerja Tampilan Pencarian Penerbit
Header
Footer
Menu Admin Pencarian Penerbi t
Pencarian Data Penerbit
(10)
13.Lembar Kerja Tampilan Tambah Kategori
Header
Footer
Menu Admin Penambah Kategori
Nama
Deskripsi
Tambah Hapus
Gambar 3.14 LKT Tampilan Tambah Penerbit
14.Lembar Kerja Tampilan View Kategori
Header
Footer
Menu Admin View Data Kategori
(11)
15.Lembar Kerja Tampilan Pencarian Kategori
Header
Footer
Menu Admin Pencarian Kategori
Pencarian Data Kategori
Gambar 3.16 LKT Tampilan Pencarian Kategori
16.Lembar Kerja Tampilan Tambah Member
Header
Footer
Menu Admin Pencarian Kategori
Pencarian Data Kategori Header
Footer
Menu Admin Tambah Data M ember
Email Telepon
Alamat Kota Nama
Pass word
Tambah Hapus
(12)
17.Lembar Kerja Tampilan View Data Member
Header
Footer
Menu Admin Pencarian Kategori
Pencarian Data Kategori Header
Footer
Menu Admin View Data M ember
Gambar 3.18 LKT Tampilan View Data Member
18.Lembar Kerja Tampilan Tambah Buku
Header
Footer
Menu Admin Pencarian Kategori Header
Footer Menu Admin
Pilih Kategori Judul Buku Nomor ISBN
Harga Pilih Penerbit
Penulis
Tambah Hapus Jumlah Halaman
Tahun Penerbit Stock Disk on Disk ripsi
(13)
19.Lembar Kerja Tampilan View Buku
Header
Footer
Menu Admin View buku
Header
Footer Menu Admin
Gambar 3.20 LKT Tampilan View Buku
20.Lembar Kerja Tampilan Pencarian Buku
Header
Footer
Menu Admin View buku
Header
Footer Menu Admin
Pencarian Data Buku
(14)
21.Lembar Kerja Tampilan View Request
Header
Footer
Menu Admin View Reques t
Header
Footer Menu Admin
Gambar 3.22 LKT Tampilan View Request
22.Lembar Kerja Tampilan Pencarian Request Buku
Header
Footer
Menu Admin View Reques t
Header
Footer Menu Admin
Pencarian Request Buku
(15)
23.Lembar Kerja Tampilan View Pesanan
Header
Footer
Menu Admin View Pes anan
Header
Footer Menu Admin
Gambar 3.24 LKT Tampilan View Pesanan
24.Lembar Kerja Tampilan Pencarian Pesanan
Header
Footer
Menu Admin View Pesanan Header
Footer Menu Admin
Pencarian Pesanan buku
(16)
Lembar Kerja Tampilan Keranjang
Header
Footer
Menu Admin Tampilan Keranjang
Header
Footer Menu Admin
Gambar 3.25 LKT Tampilan View Pesanan
4.1Jaring Semantik Tampilan (JST)
Untuk mengetahui hubungan antar tampilan maka dibuat jaringan semantik tampilan seperti berikut :
T1 T8 Masuk T3 T4 T5 T7 T6 Perkenalan Cara Beli Request Dafta r/Login Pencarian T2 Data T9 T10 T11 T12 Terhubung Terhubung T13 T14 T15 Terhubung T16 T17 Terhubung T18 T19 T20 Terhubung T21 T22 T24 T25 Terhubung T23 Terhubung Keranjang
(17)
5.1 Data Flow Diagram (DFD)
Data Flow Diagram adalah suatu diagram yang menggunakan notasi-notasi untuk menggambarkan arus dari data sistem.
User
Proses Mendaftar Menu Sign Up
Login User Email Dan Password
Buku Mencari Atau Request
Check Out
Mengirim Database
Mengirim Data Admin
Mengambil Data
Sesuai
Mengirim Data
Proses Verifikasi Login Admin
Website
Pengiriman Buku
Pembayaran Transaksi
(1)
17.Lembar Kerja Tampilan View Data Member
Header
Footer
Menu Admin Pencarian Kategori
Pencarian Data Kategori Header
Footer
Menu Admin View Data M ember
Gambar 3.18 LKT Tampilan View Data Member
18.Lembar Kerja Tampilan Tambah Buku
Header
Footer
Menu Admin Pencarian Kategori
Header
Footer Menu Admin
Pilih Kategori Judul Buku Nomor ISBN
Harga Pilih Penerbit
Penulis
Tambah Hapus
Jumlah Halaman Tahun Penerbit
Stock Disk on Disk ripsi
(2)
19.Lembar Kerja Tampilan View Buku
Header
Footer
Menu Admin View buku
Header
Footer Menu Admin
Gambar 3.20 LKT Tampilan View Buku
20.Lembar Kerja Tampilan Pencarian Buku
Header
Footer
Menu Admin View buku
Header
Footer Menu Admin
Pencarian Data Buku
(3)
21.Lembar Kerja Tampilan View Request
Header
Footer
Menu Admin View Reques t
Header
Footer Menu Admin
Gambar 3.22 LKT Tampilan View Request
22.Lembar Kerja Tampilan Pencarian Request Buku
Header
Footer
Menu Admin View Reques t
Header
Footer Menu Admin
Pencarian Request Buku
(4)
23.Lembar Kerja Tampilan View Pesanan
Header
Footer
Menu Admin View Pes anan
Header
Footer Menu Admin
Gambar 3.24 LKT Tampilan View Pesanan
24.Lembar Kerja Tampilan Pencarian Pesanan
Header
Footer
Menu Admin View Pesanan
Header
Footer Menu Admin
Pencarian Pesanan buku
(5)
Lembar Kerja Tampilan Keranjang
Header
Footer
Menu Admin Tampilan Keranjang
Header
Footer Menu Admin
Gambar 3.25 LKT Tampilan View Pesanan
4.1Jaring Semantik Tampilan (JST)
Untuk mengetahui hubungan antar tampilan maka dibuat jaringan semantik tampilan seperti berikut :
T1 T8 Masuk T3 T4 T5 T7 T6 Perkenalan Cara Beli Request Dafta r/Login Pencarian T2 Data T9 T10 T11 T12 Terhubung Terhubung T13 T14 T15 Terhubung T16 T17 Terhubung T18 T19 T20 Terhubung T21 T22 T24 T25 Terhubung T23 Terhubung Keranjang
(6)
5.1 Data Flow Diagram (DFD)
Data Flow Diagram adalah suatu diagram yang menggunakan notasi-notasi untuk menggambarkan arus dari data sistem.
User
Proses Mendaftar
Menu Sign Up
Login User
Email Dan Password
Buku
Mencari Atau Request
Check Out
Mengirim Database
Mengirim Data
Admin
Mengambil Data
Sesuai
Mengirim Data
Proses Verifikasi Login Admin
Website
Pengiriman Buku
Pembayaran
Transaksi