BAB III PEMBAHASAN - repository.bsi.ac.id · rancangan tampilan yang ada pada website Toko Buku...

24

BAB III

PEMBAHASAN

3.1 Analisa Kebutuhan

Analisis kebutuhan sistem yang baru perlu dilakukan agar ketika perancangan sistem

baru dibuat dalam Penjualan Buku online ini tidak terjadi kesalahan dan kekurangan yang

dapat menyebabkan error pada sebuah sistem web. Analisis kebutuhan sistem ini ditekankan

dalam suatu penyusunan sistem baru agar semua syntax yang ada pada web ini dapat

mencapai target-target yang sesuai dengan yang dibutuhkan.

Dalam pembuatan website penulis menggunakan bahasa pemograman PHP dengan

menggunakan software Adobe Dreamweaver CS8 dan manajemen database MySQL dan

PhpMyAdmin.

A. Admin

1. Administrator sistem dapat melakukan login.

2. Administrator sistem dapat melakukan ganti password admin.

3. Administrator sistem dapat mengelola data kategori.

4. Administrator sistem dapat mengelola data provinsi.

5. Administrator sistem dapat mengelola data buku.

6. Administrator sistem dapat mengelola pemesanan buku.

7. Administrator sistem dapat mengelola konfirmasi transfer.

8. Administrator sistem dapat mengelola laporan.

25

B. Pengunjung

1. Pengunjung dapat melihat produk

2. Pengunjung dapat melihat kategori produk.

3. Pengunjung dapat melihat panduan pembelian dan melakukan

pendaftaran baru sebagai member.

C. Member/ Pelanggan

1. Member dapat melakukan login dan memilih jenis produk yang akan

dibeli dan ditambahkan ke keranjang belanja.

2. Member dapat melakukan update jumlah produk di keranjang belanja

dan menampilkan total pembelian.

3. Member dapat melihat data pesanan barang yang dipesan.

4. Member dapat melihat produk berdasarkan kategori.

5. Member dapat melakukan konfirmasi pembayaran.

6. Member juga dapat melihat panduan pembelian, daftar pemesanan,

keranjang belanja dan konfirmasi pembayaran.

3.2 Perancangan Perangkat Lunak

Adapun perancangan perangkat lunak yang penulis gunakan dalam pembuatan

website ini adalah sebagai berikut :

3.2.1. Rancangan Antar Muka

Pada rancangan antar muka (interface) ini penulis akan menggambarkan

rancangan tampilan yang ada pada website Toko Buku Online

26

A. Rancangan Antar Muka Login Admin

Login admin

logo

userrname

password

login

Gambar III.1.

Rancangan Antar Muka Login Admin

B. Rancangan Antar Muka Ruang Admin

Home

Password Admin

Data Kategori

Data Buku

Data Pelanggan

Data Provinsi

Pemesanan Buku

Logout

Laporan

Konfirmasi Transfer

Selamat datang ……!

Anda Login Sebagai Administrator

Gambar III.2.

Rancangan Antar Muka Ruang Admin

27

C. Rancangan Antar Muka Data Kategori Admin

Home

Password Admin

Data Kategori

Data Buku

Data Pelanggan

Data Provinsi

Pemesanan Buku

Logout

Laporan

Konfirmasi Transfer

Data KategoriTAMBAH BUKU

No Nama Tools

XXX XXX Edit Delete

Gambar III.3.

Rancangan Antar Muka Tambah Data Kategori Admin

28

D. Rancangan Antar Muka Ganti Password Admin

Ganti Password Admin

Menu

userrname AdminPassword

Lama

SIMPAN

Password Baru

Gambar III.4.

Rancangan Antar Muka Ganti Password Admin

E. Rancangan Antar Muka Menu Pemesanan admin

Home

Password Admin

Data Kategori

Data Buku

Data Pelanggan

Data Provinsi

Pemesanan Buku

Logout

Laporan

Konfirmasi Transfer

Daftar PemesananFilter Data

No No Pesan Tanggal

XXX XXX XXX Edit Delete

Periode Dd/mm/yyyy s/d Dd/mm/yyyy Tampilkan

Nama Pelanggan

XXX

Total Transfer

XXX

Status

XXX

Set bayar Tools

Lihatstatus

Gambar III.5.

Rancangan Antar Muka Menu Pemesanan Admin

29

F. Rancangan Antar Muka Menu Konfirmasi admin

Home

Password Admin

Data Kategori

Data Buku

Data Pelanggan

Data Provinsi

Pemesanan Buku

Logout

Laporan

Konfirmasi Transfer

Konfirmasi Transfer

No Tanggal No Pesan

XXX XXX XXX Edit Delete

Nama Pelanggan

XXX

Transfer (Rp)

XXX

Keterangan

XXX

Tools

Delete

Jumlah Data

Gambar III.6.

Rancangan Antar Muka Menu Konfirmasi Admin

30

G. Rancangan Antar Muka Menu Tambah Buku Admin

Home

Password Admin

Data Kategori

Data Buku

Data Pelanggan

Data Provinsi

Pemesanan Buku

Logout

Laporan

Konfirmasi Transfer

Tambah Buku

Kode

Nama Buku

Penerbit

Penulis

Tahun

Harga Modal (Rp)

Harga Jual (Rp)

Jumlah Stok

File Gambar

Keterangan

Kategori

SIMPAN DATA

Penomoran Otomatis

Choose File

Gambar III.7.

Rancangan Antar Muka Menu Tambah Buku Admin

31

H. Rancangan Antar Muka Daftar Pelanggan

Pendaftaran Pelanggan

Nama Pelanggan

Kelamin

Email

No Telepon

DATA LOGIN

Username

Password

Password (lagi)

DAFTAR

Gambar III.8.

Rancangan Antar Muka Daftar Pelanggan

I. Rancangan Antar Muka Pengunjung

Tulisan Berjalan

Banner

Menu

Search

Login

Isi

Kategori Buku

Halaman

Footer

Gambar III.9.

Rancangan Antar Muka Pengunjung

32

J. Rancangan Antar Muka Pelanggan

[Status : Login| ID User: XXXXX][Logout]

Banner

Menu

Search

Login

Isi

Kategori Buku

Halaman

Footer

Gambar III.10.

Rancangan Antar Muka Pelanggan

K. Rancangan Antar Muka Kontak Kami

WWW.Belibuku.com

Toko Buku Online Lengkap dan Murah

Emailxxxxxxx@gmail.

com

Pin

Telepon

Email

BCDEF99

021XXXXXX

098XXXXXXXX

Gambar III.11.

Rancangan Antar Muka Kontak Kami

33

L. Rancangan Antar Muka User Konfirmasi

Konfirmasi Pembayaran

No Pemesanan

Nama Pelanggan

Jumlah Transfer (Rp)

Keterangan

KIRIM

Gambar III.12.

Rancangan Antar Muka User Konfirmasi

34

3.2.2. Basis Data

Dalam pembuatan website, penulis menggunakan perancangan basis data

sebagai berikut :

A. Entity Relationship Diagram (ERD)

konfimasi

Pemesanan

_item

Tmp_keranjangprovinsi

kategori

bukupemesananpelanggan

tanggal

pemesanan

Id_pelanggan Jumlah_transfer

keterangan

Id_konfirmasi

melakukan

melakukan

memiliki

memiliki

memiliki memiliki

memiliki

memilikiNo_pelanggan

Tgl_daftar

Id_pelanggan

password

username

No_telpon

email

kelamin

Kd_provinsi Biaya_kirim

Nm_provinsi

Id_pemesananStatus_biaya

No_telpon

Kode_pos

kota

Kd_provinsi

Alamat_lengkap

Nama_penerima

Tgl_pemesanan

Id_pelanggan

Id_pesan

No_pemesanan

Kd_buku

harga

jumlah

Id_kategori Nm_kategori

Nm_penerbit

Kd_buku

Kd_kategori

File_gambar

keterangan

stok

Harga_jual

Harga_modal

thn

penulis

penerbit

Id_temp_keranjang

Kd_buku

harga

jumlah

tgl

Id_pelanggan

1

1

1

1

M1 1 1 1

M

1

1

1

Gambar III.13.

Entity Relationship Diagram (ERD)

35

B. Logical Relation Structure (LRS)

konfirmasi

*id_konfirmasi

**no_pemesanan

Nm_pelanggan

Jumlah_transfer

Keterangan

tanggal

Temp_keranjang

*Id_temp_keranjang

**kd_buku

Tanggal

Jumlah

Harga

Kd_pelanggan

kategori

*kd_kategori

Nm_kategori

Buku

*kd_buku

Nm_buku

Penerbit

Penulis

Thn

Harga_modal

Harga_jual

Stok

Keterangan

File_gambar

**id_kategori

Pemesanan_item

*id_pesan

**no_pemesanan

Kd_buku

Harga

Jumlah

provinsi

*kd_provinsi

Nm_provinsi

Biaya_kirim

pemesanan

*no_pemesanan

**Kd_pelanggan

Tgl_pemesanan

Nama_penerima

Alamat_lengkap

Kd_provinsi

Kode_pos

Qty

No_telepon

Status_bayar

pelanggan

*kd_pelanggan

**nm_pelanggan

Kelamin

Email

No_telepon

Username

Password

Tgl_daftar

1

1

1

1

1

1

1 1

1 1

1

M1

1

M

1

1

1

*Primary Key

**Forigen Key

Gambar III.14.

Logical Relation Structure

36

C. Spesifikasi File

Spesifikasi file menjelaskan tentang file-file yang akan digunakan dalam

rancangan website yang diajukan dan sebagai media penyimpanan data dari proses

yang terjadi pada rancangan website.

1. Spesifikasi Tabel Admin

Nama Database : db_toko_buku

Akronim File : admin

Fungsi File : Untuk menyimpan data admin

Tipe File : File Master

Organisasi File : Index Sequential

Akses File : Sequential

Media File : Hardisk

Panjang Record : 82 karakter

Kunci Field : id_admin

Software : MySQL XAMPP

Tabel III.1 Spesifikasi Tabel Admin

No. Elemen Data Akronim Tipe Panjang Ket

1 Id_admin Id_admin Int 2 Primary Key

2 Username Username Varchar 30

3 Password Password Varchar 50

37

2. Spesifikasi Tabel Buku


Akronim File : buku

Fungsi File : Untuk menyimpan data buku






Kunci Field : kd_buku


Tabel III.2 Spesifikasi Tabel Buku


1 Kode buku Kd_buku Char 5 Primary Key

2 Nama buku Nm_buku Varchar 100

3 Penerbit Penerbit Varchar 100

4 Penulis Penulis Varchar 100

5 Tahun Thn Varchar 5

6 Harga modal Harga_modal Int 12

7 Harga jual Harga_jual Int 12

8 Stok Stok Int 4

9 Keterangan Keterangan Text

10 File gambar File_gambar Varchar 100

11 Kode kategori Kd_kategori Varchar 4 Forigen key

38

3. Spesifikasi Tabel Kategori


Akronim File : Kategori

Fungsi File : Untuk menyimpan data Kategori



Akses File : Random



Kunci Field : id_kategori


Tabel III.3 Spesifikasi Tabel Kategori

No Elemen Data Akronim Tipe Panjang Ket

1 Kode kategori Id_ Kategori Char 4 Primary Key

2 Nama Kategori Nm_ Kategori Varchar 100

4. Spesifikasi Tabel Konfirmasi


Akronim File : konfirmasi

Fungsi File : Untuk menyimpan data konfirmasi Pelanggan


39





Kunci Field : id_onfirmasi


Tabel III.4 Spesifikasi Tabel Konfirmasi


1 Id Konfirmasi Id_konfirmasi Int 4 Primary Key

2 No pemesanan No_pemesanan Varchar 8 Forigen key

3 Nm pelanggan Nm_pelanggan Varchar 100

4 Jumlah transfer Jumlah_transfer Int 12

5 Keterangan Keterangan Text

6 Tanggal Tanggal Date

5. Spesifikasi Tabel Pelanggan


Akronim File : Pelanggan

Fungsi File : Untuk menyimpan data Pelanggan






40

Kunci Field : kd_ pelanggan


Tabel III.5 Spesifikasi Tabel Pelanggan


1 Kode

pelanggan Kd_pelanggan Char 6 Primary Key

2 Nama

pelanggan Nm_pelanggan Varchar 100

3 Kelamin Kelamin Enum

Perempuan/Laki-

Laki

4 Email Email Varchar 100

5 Nomor telepon No_telepon Varchar 20

6 Username Username Varchar 20

7 Password Passweod Varchar 100

8 Tanggal daftar Tgl_daftar date

6. Spesifikasi Tabel Pemesanan


Akronim File : Pemesanan

Fungsi File : Untuk menyimpan data Pemesanan

Tipe File : File Transaksi


Akses File : Random


41


Kunci Field : no_ Pemesanan


Table III.6 Spesifikasi Tabel Pemesanan

No

. Elemen Data Akronim Tipe Panjang Ket

1 No Pemesanan No_ Pemesanan char 8 Primary Key

2 Kode pelanggan Kd_pelanggan Char 6 Forigen key

3 Tgl pemesanan Tgl_pemesanan Date

4 Nama penerima Nama_penerima Varchar 60

5 Alamat_lengkap Alamat_lengkap Varchar 100

6 Kd provinsi Kd_provinsi Char 3 Foreign key

7 Kota Kota Varchar 100

8 Kode pos Kode_pos Varchar 6

9 No_telepon No_telepon Varchar 20

10 Status bayar Status_bayar enum Lunas/pesan

7. Spesifikasi Tabel pemesanan item


Akronim File : pemesanan_item

Fungsi File : Untuk menyimpan data pemesanan

Tipe File : File Transaksi




42


Kunci Field : id_pesan


Table III.7 Spesifikasi Tabel pemesanan item


1 Id pesan Id_pesan Int 4 Primary Key

2 No pemesanan No_pemesanan Char 8 Foreign key

3 Kode buku Kd_buku Char 5 Forigen key

4 Harga Harga Int 12

5 Jumlah Jumlah Int 3

8. Spesifikasi Tabel Provinsi


Akronim File : provinsi

Fungsi File : Untuk menyimpan data provinesi






Kunci Field : kd_provinsi


43

Tabel III.8 Spesifikasi Tabel Provinsi


1 Kode provinsi Kd_provinsi Char 3 Primary Key

2 Nama provinsi Nama_provinsi Varchar 100

3 Biaya kirim Biaya_kirim Int 12

9. Spesifikasi Tabel Tempat Keranjang


Akronim File : temp_keranjang

Fungsi File : Untuk menyimpan datasementara transaksi






Kunci Field : id_temp_keranjang

Software : MySQL XAMP

44

Tabel III.9 Spesifikasi Tabel Tempat Keranjang


1 Id temp

keranjang Id_temp_keranjang Int 5 Primary Key

2 Kode buku Kd_buku Char 5 Foreign key

3 Harga Harga Int 15

4 Jumlah Jumlah Int 3

5 Tanggal Tanggal Date

6 kode pelanggan Kd_pelanggan Char 6

3.2.3. Struktur Navigasi

Dalam pembuatan website ini, penulis menggunakan struktur navigasi

campuran, berikut adalah struktur navigasnya:

45

A. Navigasi User

Gambar III.11.

Struktur Navigasi User

index

Pendaftaran

barulogin

Home Profil PanduanBuku

kategori Profil Log OutPanduanBukuhome

beli detail

lanjutkan simpan Ubah data

Simpan dan

lanjutkan

transaksi

46

B. Navigasi Admin

login

Password

adminhome Log OutLaporan

Konfirmasi

Transfer

Pembelian

Buku

Data

PelangganData Buku

Data

kategori

Data

provinsi

deletebayar

batalkan

cari

delete

Tambah delete Edit simpansimpan

Gambar III.12.

Struktur Navigasi Admin

47

1.3 Implementasi dan Pengujian Unit

3.3.1 Implementasi

A. Implementasi Rancangan Antar Muka

Implementasi rancangan antar muka pada web E-commerce berdasarkan hasil

rancangan antar muka.

1. Halaman Login Member

Gambar III.18

Implementasi Antar Muka Login Member

48

2. Halaman Beranda Pelanggan

Gambar III.19

Implementasi Antar Muka Beranda Pelanggan

49

3. Halaman Rangkaian Produk

Gambar III.20

Implementasi Antar Muka Rangkaian Produk

50

4. Halaman Kontak Kami

Gambar III.21

Implementasi Antar Muka Kontak Kami

51

5. Halaman Konfirmasi Pembayaran / Konfirmasi

Gambar III.22

Implementasi Antar Muka Pembayaran/ Konfirmasi

52

6. Halaman Panduan

Gambar III.23

Implementasi Antar Muka Panduan

53

7. Halaman Login Admin

Gambar III.24

Implementasi Antar Muka Login Admin

8. Halaman Beranda Admin

Gambar III.25

Implementasi Antar Muka Beranda Admin

54

9. Halaman Data Daftar Buku Admin

Gambar III.27

Implementasi Antar Muka Daftar Buku Admin

55

10. Halaman Data Pelanggan

Gambar III.28

Implementasi Antar Muka Data Pelanggan

11. Halaman Data Konfirmasi Pembayaran

Gambar III.29

Implementasi Antar Muka Data Konfirmasi Pembayaran

56

12. Halaman Data Pemesanan Buku

Gambar III. 31

Implementasi Antar Data Pemesanan Buku

57

B. Spesifikasi Sistem Komputer

Berikut ini adalah spesifikasi perangkat keras dan perangkat lunak minimum yang

dibutuhkan untuk mengimplementasikan web e-commerce.

Spesifikasi System Komputer :

1. Spesifikasi Perangkat Keras

A. Server

1. CPU

a. Processor (R) Atom(TM) CPU N570 @ 1.66 GHz 1,67 GHz

b. RAM : 2 GB

c. Hard Disk : 200 GB

2. Mouse

3. Keyboard

4. Monitor dengan resolusi layar minimum 1024x768

5. Koneksi internet dengan kecepatan 2 Mbps

B. Client

1. CPU

a. Processor (R) Atom(TM) CPU N570 @ 1.66 GHz 1,67 GHz

b. RAM : 2 GB

c. Hard Disk : 200 GB

2. Mouse

3. Keyboard

4. Monitor dengan resolusi layar minimum 1024x768

58

5. Koneksi internet dengan kecepatan 2 Mbps

2. Spesifikasi Perangkat Lunak

1. Server

a. Sistem operasi menggunakan Microsoft Windows

b. Aplikasi bundle web server menggunakan Apache2Triad yang terdiri

dari beberapa komponen, diantaranya:

- Aplikasi Apache2Triad

- Aplikasi PHP MyAdmin

c. Aplikasi web untuk melihat hasil yaitu Mozilla firefox, Google

Chrome.

2. Client

a. Sistem operasi menggunakan Microsoft Windows

b. Aplikasi Web Browser seperti Mozilla firefox, Google

Chrome.

3.3.2 Pengujian Unit

Pengujian terhadap program yang dibuat menggunakan Blackbox Testing yang fokus

terhadap proses masukan dan keluaran program

59

A. Pengujian Terhadap Form Login

Tabel III.13

Hasil Pengujian Black Box Testing Halaman Login admin

No Skenario Pengujian Test case Hasil yang

diharapkan

Hasil

pengujian

Kesimpulan

1.

Username dan

password tidak diisi

kemudian klik

tombol login

Username:

(kosong)

Password:

(kosong)

Sistem akan

menolak akses

dan muncul

peringatan

“data username

tidak boleh

kosong, data

password tidak

boleh kosong”

Sesuai

harapan Valid

2

Username diisi dan

Password tidak diisi

kemudian klik login

Username:

admin

(benar)

Password:

(kosong)

Sistem akan

menolak akses

dan muncul

peringatan

“password tidak

boleh kosong”

Sesuai

harapan Valid

3

Username tidak diisi

dan password diisi

kemudian klik login

Username:

(kosong)

Password:

admin(benar

)

Sistem akan

menolak akses

dan muncul

peringatan

“Username

tidak boleh

kosong”

Sesuai

Harapan Valid

4

Username dan

password terisi

namun salah satu

ada yang salah

Username:

admin(salah

)

Password:

123(salah)

Sistem akan

menolak dan

kembali ke

halaman login

admin

Sesuai

harapan Valid

5

Username dan

password terisi

dengan benar dan

klik login

Username:

admin(benar

)

Password:

admin(benar

)

Sistem akan

menerima,

muncul pesan

“selamat dating

dihalaman

administrator”

Sesuai

harapan Valid

60

B. Pengujian Terhadap Form Daftar Pelanggan

Tabel III.14

Hasil Pengujian Black Box Testing Form Daftar Pelanggan

No Skenario Pengujian Test case Hasil yang

diharapkan

Hasil

pengujian

Kesimpulan

1.

Semua field tidak

terisi kemudian klik

daftar

Field:

(kosong)

Muncul

peringatan

“data tidak

boleha da yang

kosong”

Sesuai

harapan Valid

2

Salah satu field

belum terisi

,misalnya username

belum

terisikemudian klik

daftar

telepon:

(kosong)

Field lain :

terisi

Muncul

peringatan

“data username

masih kosong”

Sesuai

harapan Valid

3

Semua field terisi

namun format email

salah kemudian

Field : terisi

Email : terisi

(salah)

Muncul

peringatan “isi

email dengan

lengkap ” dan

kursor

mengarah ke

kolom email

Sesuai

harapan Valid

4

Semua field terisi

dan format email

benar namun

username sudah ada

di dalam database

kemudian klik daftar

Email terisi

dengan

format yang

benar,semua

field juga

terisi namun

usernae

sudah

pernah

digunakan

Muncul

peringatan”erro

rr!! Username

sudah ada yang

menggunakan

Sesuai

harapan Valid

5

Semua field terisi

dan format email

benar kemudian klik

daftar

Field : terisi

(benar)

Email : terisi

(benar)

Tersimpan

kedalam

database dan

muncul pesan

“Data Telah

Tersimpan,

silahkan login”

Sesuai

harapan Valid

BAB III PEMBAHASAN - repository.bsi.ac.id · rancangan tampilan yang ada pada website Toko Buku...

Documents

Transcript of BAB III PEMBAHASAN - repository.bsi.ac.id · rancangan tampilan yang ada pada website Toko Buku...