BAB III PEMBAHASAN. lingkungan sistem yaitu front-end untuk kebutuhan pengunjung dan back-end untuk

(1)

23 3.1. Analisa Kebutuhan

1. Kebutuhan Pengguna

Pada aplikasi e-commerce terdapat pengguna yang dapat saling berinteraksi dalam lingkungan sistem yaitu front-end untuk kebutuhan pengunjung dan back-end untuk kebutuhan admin. Setiap pengguna mempunyai kebutuhan informasi yang berbeda-beda, yaitu:

a. Skenario Kebutuhan Pengunjung

1) Melihat seputar beranda, produk, cara pemesanan, tentang kami, kontak kami.

2) Mengisi atau mendaftar menjadi pelanggan. b. Skenario Kebutuhan Pelanggan

1) Mengisi keranjang belanja. 2) Melakukan transaksi pembelian. 3) Mencetak bukti pemesanan. c. Skenario Kebutuhan Admin

1) Mengelola data produk. 2) Mengelola data admin. 3) Mengelola data pemesanan. 4) Mengelola data laporan.

(2)

2. Kebutuhan Sistem

Pada aplikasi e-commerce terdapat sistem operasi yang digunakan untuk mengendalikan program. Setiap sistem operasi mempunyai kegunaan masing-masing, yaitu:

a. Pengunjung sebelum melakukan transaksi harus melakukan pendaftaran menjadi pelanggan terlebih dahulu.

b. Setiap pelanggan dan admin harus login untuk mengakses halaman pelanggan dan halaman admin, dan logout untuk keluar.

c. Sistem harus dapat menambah, menghapus, dan mengubah data yang terdapat pada menu admin.

3.2. Perancangan Perangkat Lunak

Suatu struktur yang diterapkan pada pengembangan produk perangkat lunak yang bertujuan untuk mengembangkan sistem dan memberikan panduan yang bertujuan untuk mensukseskan proses pengembangan sistem melalui tahap demi tahap. Berikut adalah tahap dalam pengembangan perncangan perangkat lunak:

3.2.1. Rancangan Antar Muka

Berikut adalah tampilan rancangan antar muka (interface) yang terdapat pada aplikasi e-commerce penjualan kemeja:

(3)

1. Rancangan Antar Muka Login Admin

Gambar III.1

(4)

2. Rancangan Antar Muka Halaman Admin

Gambar III.2

(5)

3. Rancangan Antar Muka Data Kategori

Gambar III.3

(6)

4. Rancangan Antar Muka Data Pelanggan

Gambar III.4

(7)

5. Rancangan Antar Muka Data Kota

Gambar III.5

(8)

6. Rancangan Antar Muka Tambah Kategori

Gambar III.6

(9)

7. Rancangan Antar Muka Tambah Kota

Gambar III.7

(10)

8. Rancangan Antar Muka Data Pemesanan

Gambar III.8

(11)

9. Rancangan Antar Muka Data Konfirmasi

Gambar III.9

(12)

10. Rancangan Antar Muka Data Slider

Gambar III.10

(13)

11. Rancangan Antar Muka Tambah Slider

Gambar III.11

(14)

12. Rancangan Antar Muka Beranda Pelanggan

Gambar III.12

(15)

13. Rancangan Antar Muka Daftar Pelanggan

Gambar III.13

(16)

14. Rancangan Antar Muka Produk

Gambar III.14

(17)

15. Rancangan Antar Muka Cara Pemesanan

Gambar III.15

(18)

16. Rancangan Antar Muka Pesan

Gambar III.16

(19)

17. Rancangan Antar Muka Konfirmasi

Gambar III.17

(20)

3.2.2. Rancangan Basis Data

1. ERD (Entity Relationship Diagram)

Gambar III.18 Entity Relationship Diagram

(21)

2. LRS (Logical Record Structure)

Gambar III.19 Logical Record Structure

(22)

3. Spesifikasi File

Spesifikasi file merupakan dokumen yang menguraikan organisasi data di dalam file. Adapun spesifikasi file pada web ini adalah sebagai berikut:

a. Spesifikasi File Admin Nama Tabel : admin

Akronim : admin

Fungsi : untuk menyimpan data admin Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Panjang Record : 83 Kunci Field : id_admin Software : Mysql

Tabel III.1 Spesifikasi File Admin

No. Elemen Data Nama Field Tipe Panjang Keterangan

1. Id Admin id_admin Int 3 Primary Key

2. Username username Varchar 25

3. Password password Varchar 20

(23)

b. Spesifikasi File Pelanggan Nama Tabel : pelanggan

Akronim : pelanggan

Fungsi : untuk menyimpan data pelanggan Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Panjang Record : 108

Kunci Field : id_pelanggan

Software : Mysql

Tabel III.2

Spesifikasi File Pelanggan

No. Elemen Data Nama Field Tipe Panjang Keterangan

1. Id Pelanggan id_pelanggan Int 3 Primary Key

2. Nama nama Varchar 35

3. Alamat alamat Text

4. Email email Varchar 25

5. Telepon telepon Double

(24)

c. Spesifikasi File Barang Nama Tabel : barang

Akronim : barang

Fungsi : untuk menyimpan data barang Tipe File : File Master

Akses File : Random

Panjang Record : 156 Kunci Field : id_produk

Software : Mysql

Tabel III.3 Spesifikasi File Barang

No. Element Data Nama Field Tipe Panjang Keterangan

1. Id Produk id_produk Int 3 Primary Key

2. Nama Produk nama_produk Varchar 35

3. Kategori kategori Varchar 20

4. Warna warna Varchar 25

5. Ukuran ukuran Varchar 15

6. Keterangan keterangan Text

7. Harga harga Double

8. Stok stok Int 3

9. Gambar gambar Varchar 50

(25)

d. Spesifikasi File kategori Nama Tabel : kategori

Akronim : kategori

Fungsi : untuk menyimpan data kategori Tipe File : File Master

Akses File : Random

Panjang Record : 23

Kunci Field : id_kategori

Software : Mysql

Tabel III.4

Spesifikasi File Kategori

No. Elemen data Nama Field Tipe Panjang Keterangan

1. Id Kategori id_kategori Int 3 Primary Key

(26)

e. Spesifikasi File kota Nama Tabel : kota

Akronim : kota

Fungsi : untuk menyimpan data kota Tipe File : File Master

Akses File : Random

Panjang Record : 53 Kunci Field : id_kota

Software : Mysql

Tabel III.5 Spesifikasi File Kota

1. Id Kota id_kota Int 3 Primary Key

2. Nama Kota kota Varchar 50

(27)

f. Spesifikasi File slider Nama Tabel : slider

Akronim : slider

Fungsi : untuk menyimpan data slider Tipe File : File Master

Akses File : Random

Panjang Record : 53

Kunci Field : id

Software : Mysql

Tabel III.6

Spesifikasi File Kategori

1. Id Slider id Int 3 Primary Key

2. Gambar gambar Varchar 50

(28)

g. Spesifikasi File Keranjang Nama Tabel : keranjang

Akronim : keranjang

Fungsi : untuk menyimpan data keranjang Tipe File : File Master

Akses File : Random

Panjang Record : 69

Kunci Field : notransaksi

Software : Mysql

Tabel III.7

Spesifikasi File Keranjang

1. No. transaksi notransaksi Int 3 Primary Key

2. Id Produk id_produk Int 3

3. Nama Produk nama_produk Varchar 35

5. Jumlah jumlah Int 3

6. Tanggal tanggal Date

(29)

h. Spesifikasi File Pemesanan Nama Tabel : pemesanan

Akronim : pemesanan

Fungsi : untuk menyimpan data pemesanan Tipe File : File Master

Akses File : Random

Panjang Record : 116

Kunci Field : no_pemesanan

Software : Mysql

Tabel III.8

Spesifikasi File Pemesanan

1. No. pemesanan no_pemesanan Char 6 Primary

Key

3. Tanggal pemesanan

tgl_pemesanan Date

5. Alamat alamat Text

6. Kota kota Varchar 50

7. Kode pos kode_pos Double

8. No. telepon no_telepon Double

9. Status bayar status_bayar Enum ‘Pesan’, ’Lunas’, ’Batal’, ’Kirim’

(30)

i. Spesifikasi File Pemesanan Item Nama Tabel : pemesanan_item

Akronim : pemesanan item

Fungsi : untuk menyimpan data pemesanan item Tipe File : File Master

Akses File : Random

Panjang Record : 50

Kunci Field : id

Software : Mysql

Tabel III.9

Spesifikasi File Pemesanan Item

1. Id id Int 3 Primary Key

2. No. pemesanan no_pemesanan Char 6 3. Nama produk nama_produk Varchar 35

5. Jumlah jumlah Int 3

(31)

j. Spesifikasi File Konfirmasi Nama Tabel : konfirmasi

Akronim : Konfirmasi Pembayaran

Fungsi : untuk menyimpan data konfirmasi pembayaran Tipe File : File Master

Akses File : Random

Panjang Record :146

Kunci Field : id

Software : Mysql

Tabel III.10

Spesifikasi File Konfirmasi

1. Ide Ide Int 3 Primary Key

2. No. pemesanan no_pemesanan Varchar 8

3. Bank tujuan bank_tujuan Varchar 20

4. Bank pengirim Bank Varchar 20

5. Rekening atas nama rek_nama Varchar 50 6. Metode transfer metode_trf Varchar 20

8. Jumlah transfer jumlah_transfer Double

9. Keterangan Keterangan Text

(32)

k. Spesifikasi File Buku Tamu Nama Tabel : buku_tamu

Akronim : Buku Tamu

Fungsi : untuk menyimpan data buku tamu Tipe File : File Master

Akses File : Random

Panjang Record : 83

Kunci Field : id

Software : Mysql

Tabel III.11

Spesifikasi File Buku Tamu

1. Id id Int 3 Primary Key

3. Email email Varchar 50

4. Pesan pesan Text

5. Tanggal tanggal Datetime

6. Status status Enum ‘Yes’,

(33)

3.2.3. Rancangan Struktur Navigasi

Struktur navigasi yang digunakan untuk pembuatan website ini adalah stuktur navigasi campuran. Melalui struktur navigasi website ini, terlihat bagaimana isi dan susunan dari sebuah website secara menyeluruh. Diagram struktur navigasi website dapat dilihat pada gambar dibawah ini.

1. Struktur Navigasi Pengunjung

Gambar III.20

(34)

2. Struktur Navigasi Pelanggan

Gambar III.21

(35)

3. Struktur Navigasi Admin

Gambar III.22 Struktur Navigasi Admin

(36)

3.3. Implementasi dan Pengujian Unit 3.3.1. Implementasi

A. Implementasi Rancangan Antar Muka

Implementasi rancangan antar muka yang terdapat pada website adalah sebagai berikut:

1. Halaman Pengunjung a. Halaman Beranda

Gambar III.23 Halaman Beranda

(37)

b. Halaman Produk

Gambar III.24 Halaman Produk

(38)

c. Halaman Daftar

Gambar III.25 Halaman Daftar

(39)

d. Halaman Tampil Transaksi

Gambar III.26 Halaman Tampil Transaksi

(40)

e. Halaman Konfirmasi

Gambar III.27 Halaman Konfirmasi

(41)

f. Halaman Pesan

Gambar III.28 Halaman Pesan

(42)

g. Halaman Login Admin

Gambar III.29 Halaman Login Admin

(43)

h. Halaman Beranda Admin

Gambar III.30 Halaman Beranda Admin

(44)

i. Halaman Data Kategori

Gambar III.31 Halaman Data Kategori

(45)

j. Halaman Data Pelanggan

Gambar III.32 Halaman Data Pelanggan

(46)

k. Halaman Data Pemesanan

Gambar III.33 Halaman Data Pemesanan

(47)

l. Halaman Data Konfirmasi

Gambar III.34 Halaman Data Konfirmasi

(48)

B. Spesifikasi Sistem Komputer 1. Spesifikasi Perangkat Keras

a. Server 1) CPU

(a) Prosesor Intel Inside. (b) RAM DDR3 4 GB. (c) Hard disk 320 GB. 2) Mouse.

3) Keyboard.

4) Monitor dengan resolusi layar 1366 x 768 5) Koneksi internet dengan kecepatan 1 Mbps b. Client

1) CPU

(a) Prosesor Intel Inside (b) RAM DDR3 4 GB. (c) Hard disk 320 GB. 2) Mouse.

3) Keyboard.

4) Monitor dengan resolusi layar 1366 x 768. 5) Koneksi internet dengan kecepatan 1 Mbps.

(49)

2. Spesifikasi Perangkat Lunak a. Server

1) Sistem operasi yang umum digunakan seperti: Microsoft Windows atau Linux (Ubuntu, Fedora, dan lain-lain).

2) Aplikasi web server seperti: Xampp.

3) Aplikasi web browser seperti Mozilla Firefox, Opera, Safari, Internet Explorer, Google Chrome.

b. Client

1) Sistem operasi yang umum digunakan seperti: Microsoft Windows atau Linux (Ubuntu, Fedora, dan lain-lain).

2) Aplikasi web browser seperti Mozilla Firefox, Opera, Safari, Internet Explorer, Google Chrome.

(50)

3.3.2. Pengujian Unit

Dalam pengujian program yang telah dibuat penulis menggunakan black box testing yang meliputi testing input dan testing output, sebagai berikut:

A. Pengujian Terhadap Form Login Admin Tabel III.12

Hasil Pengujian Black Box Testing Login Admin

No. Skenario pengujian Test case

Hasil yang diharapkan

Hasil

pengujian Kesimpulan

1

Mengosongkan semua isi data pada login lalu langsung mengklik ‘Login’ Username (kosong) password (kosong)

Sistem akan menolak akses login dan akan menampilkan pesan

“Username Atau Password tidak boleh

kosong”

Sesuai yang

diharapkan Valid

2.

Hanya mengisi data username dan mengosongkan data password, lalu langsung

mengklik ‘Login’

Username admin password

(kosong)

kosong”

Sesuai yang

diharapkan Valid

3.

Hanya mengisi data password dan mengosongkan username, lalu langsung

mengklik ‘Login

Username (kosong) password

***

kosong”

Sesuai yang

diharapkan Valid

4.

Menginputkan dengan kondisi username benar dan password salah, lalu

mengklik ‘Login’ Username admin (benar) password (***) (salah)

kosong”

Sesuai yang

diharapkan Valid

5.

Menginputkan username dan password dengan

data yang benar, lalu mengklik ‘Login Username admin (benar) password (***) (benar) Sitem menerima akses login dan kemudian langsung

menampilkan Halaman Utama

Sesuai yang

(51)

B. Pengujian Terhadap Halaman Admin (Tambah Data Produk) Tabel III.13

Hasil Pengujian Black Box Testing Halaman Admin (Tambah Data Produk) No.

Skenario Pengujian Test Case Hasil yang Diinginkan Hasil yang diharapkan Kesimpulan 1 Mengosongkan isi nama produk Nama produk (kosong) Ketika di klik “Simpan” sistem akan menolak dan

menampilkan pesan “Data tidak

boleh ada yang kosong” Sesuai yang diharapkan Valid 2

Tidak memilih isi kategori

Kategori tidak dipilih (kosong)

Ketika di klik “Simpan” sistem akan menolak dan

boleh ada yang kosong” Sesuai yang diharapkan Valid 3

Tidak memilih isi ukuran

Ukuran tidak dipilih (kosong)

Ketika di klik “Simpan” sistem akan menolak dan

boleh ada yang kosong” Sesuai yang diharapkan Valid 4 Mengosongkan isi keterangan

Keterangan (kosong) Ketika di klik “Simpan” sistem akan menolak dan

boleh ada yang kosong” Sesuai yang diharapkan Valid 5 Mengosongkan isi warna

Warna (kosong) Ketika di klik “Simpan” sistem akan menolak dan

boleh ada yang kosong” Sesuai yang diharapkan Valid 6 Mengosongkan isi harga

Harga (kosong) Ketika di klik “Simpan” sistem akan menolak dan

Sesuai yang diharapkan

(52)

boleh ada yang kosong”

7

Mengosongkan isi stok

Stok (kosong) Ketika di klik “Simpan” sistem akan menolak dan

boleh ada yang kosong” Sesuai yang diharapkan Valid 8 Tidak memilih gambar produk

Gambar (kosong) Ketika di klik “Simpan” sistem akan menolak dan

boleh ada yang kosong” Sesuai yang diharapkan Valid 9 Mengisikan nama, kategori, ukuran, keterangan, warna,

harga, stok dan memilih gambar lalu

klik “simpan” Nama(***),harga(***) stok(***),warna(***) keterangan(***) gambar, ukuran, kategori. Ketika di klik “Simpan” sistem akan menerima dan menampilkan pesan “Tambah produk berhasil” Sesuai yang diharapkan Valid

C. Pengujian Terhadap Halaman Admin (Tambah Data Kategori) Tabel III.14

Hasil Pengujian Black Box Testing Halaman Admin (Tambah Data Kategori)

Skenario Pengujian Test Case Hasil yang Diinginkan

Hasil yang

diharapkan Kesimpulan

1

Mengosongkan isi nama kategori Nama kategori (kosong) Ketika di klik “Simpan” sistem akan menolak dan menampilkan pesan “Data tidak boleh ada

yang kosong”

Valid

2

Mengisikan data nama kategori yang sudah ada

lalu langsung mengklik ‘Simpan’

Nama kategori

(***)

Sistem akan menolak dan menampilkan pesan “Kategori sudah ada " Sesuai yang diharapkan Valid 3

Mengisi data nama kategori lalu langsung

mengklik ‘Simpan’ Nama kategori (***) Ketika di klik “Simpan” akan menampilkan pesan “Tambah Kategori Berhasil” Sesuai yang diharapkan Valid

(53)

D. Pengujian Terhadap Halaman Admin (Tambah Data Kota) Tabel III.15

Hasil Pengujian Black Box Testing Halaman Admin (Tambah Data Kota)

No. Skenario Pengujian Test Case Hasil yang Diinginkan

Hasil yang

1 Mengosongkan isi nama kota dan biaya kirim

Nama kota (kosong) biaya (kosong) Ketika di klik “Simpan” sistem akan menolak dan menampilkan pesan “Data tidak boleh ada

yang kosong”

Sesuai yang

diharapkan Valid 2 Hanya mengisi data

nama kota dan mengosongkan data biaya, lalu langsung mengklik ‘Simpan’ Nama kota (***) biaya kirim (kosong) Ketika di klik “Simpan” sistem akan menolak dan menampilkan pesan “Data tidak boleh ada

yang kosong”

Sesuai yang

diharapkan Valid

3 Mengosongkan data nama kota dan mengisi data biaya, lalu langsung

mengklik ‘Simpan’ Nama kota (kosong) biaya kirim (***) Ketika di klik “Simpan” sistem akan menolak dan menampilkan pesan “Data tidak boleh ada

yang kosong”

Sesuai yang

diharapkan Valid

4 Mengisikan data nama kota yang sudah ada dan

mengisi data biaya, lalu langsung mengklik

‘Simpan’

Nama kota (***) biaya kirim (***)

Sistem akan menolak dan menampilkan pesan “Kota sudah

ada "

Sesuai yang

diharapkan Valid 5 Mengisi data nama kota

dan data biaya, lalu langsung mengklik ‘Simpan’ Nama kota (***) biaya kirim (***) Ketika di klik “Simpan” akan menampilkan pesan “Tambah Kota Berhasil” Sesuai yang diharapkan Valid

(54)

E. Pengujian Terhadap Halaman Admin (Tambah Data Slider) Tabel III.16

Hasil Pengujian Black Box Testing Halaman Admin (Tambah Data Slider)

No. Skenario Pengujian Test Case Hasil yang Diinginkan

Hasil yang

1 Mengosongkan isi gambar dan keterangan

Gambar (kosong) keterangan (kosong) Ketika di klik “Simpan” sistem akan menolak dan menampilkan pesan “Data tidak boleh ada

yang kosong”

Sesuai yang

diharapkan Valid 2 Hanya mengisi data

gambar dan mengosongkan data keterangan, lalu langsung

mengklik ‘Simpan’ Gambar keterangan (kosong) Ketika di klik “Simpan” sistem akan menolak dan menampilkan pesan “Data tidak boleh ada

yang kosong”

Sesuai yang

diharapkan Valid

3 Mengosongkan data gambar dan mengisi data keterangan, lalu langsung

mengklik ‘Simpan’ Gambar (kosong) keterangan (***) Ketika di klik “Simpan” sistem akan menolak dan menampilkan pesan “Data tidak boleh ada

yang kosong”

Sesuai yang

diharapkan Valid

4 Mengisikan data gambar yang sudah ada dan mengisi data keterangan,

lalu langsung mengklik ‘Simpan’

Gambar keterangan

(***)

Sistem akan menolak dan menampilkan

pesan “Gambar sudah ada "

Sesuai yang

diharapkan Valid 5 Mengisi data gambar dan

data keterangan, lalu langsung mengklik ‘Simpan’ Gambar keterangan (***) Ketika di klik “Simpan” akan menampilkan pesan “Tambah Slider Berhasil” Sesuai yang diharapkan Valid

(55)

F. Pengujian Terhadap Form Login Pelanggan Tabel III.17

Hasil Pengujian Black Box Testing Login Pelanggan

No. Scenario Pengujian Test case Hasil yang diharapkan Hasil

Pengujian Kesimpulan

1

Mengosongkan semua isi data pada login pelanggan lalu langsung mengklik

‘Login’

Username (kosong) password (kosong)

Sistem akan menolak akses login dan menampilkan pesan

“username kosong, silahkan isi dengan

benar” Sesuai yang diharapkan Valid 2

Hanya mengisi data username dan mengosongkan data password lalu langsung

mengklik ‘Login’

Username Password (kosong)

“password kosong, silahkan isi dengan

benar” Sesuai yang diharapkan Valid 3

Hanya mengisi data password dan mengosongkan data username lalu mengklik

‘Login’

Username (kosong) password (***)

“username kosong, silahkan isi dengan

benar” Sesuai yang diharapkan Valid 4 Menginputkan dengan benar kondisi username dan password salah, lalu

langsung mengklik ‘Login’ Username (benar) password (***) (salah)

“username dan password yang anda

masukkan belum benar” Sesuai yang diharapkan Valid 5 Menginputkan dengan kondisi username salah dan password benar, lalu

langsung mengklik ‘Login’ Username (salah) password (***) (benar)

“username dan password yang anda

masukkan belum benar” Sesuai yang diharapkan Valid 6 Menginputkan data username dan password

dengan benar, lalu langsung mengklik login

Username (benar) password

(benar)

Sistem akan menerima akses login dan kemudian pelanggan bisa memulai transaksi

pembelian produk

(56)

G. Pengujian Terhadap Halaman Pelanggan Keranjang Belanja Tabel III.18

Hasil Pengujian Black Box Testing Keranjang Belanja

No. Scenario Pengujian Text case Hasil yang diharapkan Hasil

Pengujian Kesimpulan 1. Pelanggan tidak memilih produk - Sistem akan menampilkan keranjang belanja kosong Sesuai yang diharapkan Valid 2. Pelanggan memilih produk Nama produk, harga beli, gambar produk, dan jumlah diisi Sistem akan menghasilkan output berupa data pemesanan

Valid

H. Pengujian Terhadap Halaman Pelanggan Proses Pencarian Produk Tabel III.19

Hasil Pengujian Black Box Testing Proses Pencarian Produk

NO. Sekenario Pengujian Test Case Hasil Yang Diharapkan

Hasil

Pengujian Kesimpulan 1 Mengosongkan keyword Keywords

(kosong)

Sistem akan menolak dan memberi pesan “Masukkan nama /jenis kemeja” Sesuai yang diharapkan Valid 2 Mengisikan keyword nama/jenis produk Keywords (***) Sistem akan

menerima dan masuk ke hasil pencarian

Sesuai yang

diharapkan Valid 3

Mengisikan keyword nama/jenis produk yang tidak ada Keywords (salah) Sistem akan menampilkan pesan “Nama/jenis tidak ada” Sesuai yang diharapkan Valid