bab iv rancangan sistem dan program usulan · 37 deskripsi use case diagram penjualan online...

78
34 BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN 4.1. Analisa Kebutuhan Software Pada banyak proyek sistem informasi, proses analisa desain sering bejalan bersama-sama, hal ini dilakukan karena pada banyak kasus, user sering kesulitan untuk mensefinisikan kebutuhan mereka, oleh karena itu penulis membuatkan analisa kebutuhan software agar mengetahui keinginan user yang ada di toko Toko Batik 10s yaitu : A. Tahapan Analisis Sistem penjualan secara online berbasis web dimana penjual dan user tidak bertatap muka secara langsung. Calon user melakukan pembelian melalui media browser. Berikut ini spesifikasi kebutuhan (system requirement) dari sistem e-commerce. Berikut ini spesifikasi kebutuhan (system requirement) dari sistem e- commerce yang ada di toko Toko Batik 10s : Halaman frontpage : A1. User member yang sudah registrasi pendaftaran dapat memilih barang yang akan di beli dan ditambahkan ke keranjang belanja A2. User member dapat menyaring barang berdasarkan kategori. A3. User member dapat melakukan checkout. A4. User non member dapat melakukan registrasi. A5. Sistem memfasilitasi metode pembayaran . A6. User member dapat login dengan account yang telah dibuat apabila belanja di hari lain.

Upload: doandiep

Post on 22-Jul-2019

225 views

Category:

Documents


1 download

TRANSCRIPT

Page 1: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

34

BAB IV

RANCANGAN SISTEM DAN PROGRAM USULAN

4.1. Analisa Kebutuhan Software

Pada banyak proyek sistem informasi, proses analisa desain sering bejalan

bersama-sama, hal ini dilakukan karena pada banyak kasus, user sering kesulitan

untuk mensefinisikan kebutuhan mereka, oleh karena itu penulis membuatkan

analisa kebutuhan software agar mengetahui keinginan user yang ada di toko

Toko Batik 10s yaitu :

A. Tahapan Analisis

Sistem penjualan secara online berbasis web dimana penjual dan user

tidak bertatap muka secara langsung. Calon user melakukan pembelian melalui

media browser. Berikut ini spesifikasi kebutuhan (system requirement) dari sistem

e-commerce. Berikut ini spesifikasi kebutuhan (system requirement) dari sistem e-

commerce yang ada di toko Toko Batik 10s :

Halaman frontpage :

A1. User member yang sudah registrasi pendaftaran dapat memilih barang yang

akan di beli dan ditambahkan ke keranjang belanja

A2. User member dapat menyaring barang berdasarkan kategori.

A3. User member dapat melakukan checkout.

A4. User non member dapat melakukan registrasi.

A5. Sistem memfasilitasi metode pembayaran .

A6. User member dapat login dengan account yang telah dibuat apabila belanja di

hari lain.

Page 2: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

35

A7. User member dapat melakukan konfirmasi pembayaran.

Halaman administrasi :

B1. Admin dapat mengelola data produk

B2. Admin dapat mengelola data transaksi penjualan.

B3. Admin dapat mengelola data ongkos kirim.

B4. Admin dapat mengelola data testimonial.

B5. Admin dapat mengelola data customer.

B6. Admin dapat mengelola data laporan.

B7. Admin dapat mengelola data admin.

B. Use Case Diagram

Use case mendeskripsikan sebuah interaksi antara satu atau lebih aktor

dengan sistem informasi yang akan dibuat. Berikut merupakan use case diagram

sistem usulan pada Toko Batik 10s :

Page 3: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

36

1. Use Case Diagram Belanja Online Halaman User Member

Gambar IV.1

Use Case Diagram Belanja Online Halaman User Member

uc Use Case Diagram Belanja Online Halaman Us...

User Member

Pilih BarangTampilkan Detail

Barang Tambah ke Keranjang

Belanja

Pilih Kategori Tampilkan Barang

Berdasarkan Kategori

Belanja

Memilih Jenis

Pembayaran

Mengisi Data

Pengiriman

Tampilkan Total

Belanja

Konfirmasi

Pembayaran

Melihat Transaksi

Masukkan Data

Pembayaran

«extend»

«include»

«include»

«include»

«extend»

«extend»

«extend»

«extend»

Page 4: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

37

Deskripsi Use Case Diagram Penjualan Online Halaman User.Member

Tabel IV.1

Deskripsi Use Case Diagram Penjualan Online Halaman User Member

Use Case Name Penjualan Online Halaman User Member

Requirments A3, A4, A5.

Goal User member dapat melakukan pembelian

secara online via web.

Pre-conditions User member telah memilih barang.

Post-Conditions Sistem menampilkan detail transaksi dan

memproses penjualan.

Failed end conditions User member membatalkan belanja.

Kemungkinan user member ingin menambah

barang atau membatalkan pembelian.

Primary Actors User Member

Main Flow/ Basic Path 1. User member memilih icon belanja.

2. Sistem menampilkan rincian belanja.

3. User member melakukan order sekarang.

4. Sistem akan menampilkan rincian belanja

dan metode pembayaran.

5. User member memilih metode

pembayaran.

6. Sistem menampilkan cara melakukan

pembayaran

7. User member memasukkan alamat lokasi

8. Sistem menampilkan detail transaksi dan

memproses penjualan.

Invariant A A4. User member memilih metode pembayaran

dengan transfer.

A5. Sistem akan menampilkan pilihan

jenis bank, pilihan kota dan

halaman alamat pengiriman.

user harus memasukkan alamat

pengiriman

A6. User member memilih pilihan kota dan

memasukkan alamat

pengiriman dan melanjutkan.

A7. Sistem menampilkan detail

transaksi dan form konfirmasi

pembayaran.

A8. User member memasukkan data di form

konfirmasi pembayaran.

A9. Sistem akan memproses penjualan.

Page 5: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

38

2. Use Case Diagram Penjualan Online Halaman Admin

Untuk di halaman admin ada beberapa use case yaitu :

a. Use Case Mengelola Produk

uc Mengelola Prod...

Admin

Mengelola Produk

Menambah

Mengupdate

Mendelete

Login

«extend»

«extend»

«extend»

«extend»

Gambar IV.3

Use Case Diagram Mengelola Produk

Page 6: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

39

Deskripsi Use Case Mengelola Data Produk

Tabel IV.3.

Deskripsi Use Case Diagram Mengelola Produk.

Use Case Name Mengelola Produk

Requirments B1.

Goal Admin dapat menambah, mengupdate dan

menghapus produk.

Pre-conditions Admin telah login.

Post-conditions Produk tersimpan, terupdate dan terhapus.

Failed end condition Gagal tersimpan, terupdate dan terhapus.

Primary actor Admin

Main flow/ Basic Path 1. Admin melihat daftar produk.

2. Admin memilih tombol “Tambah”.

3. Sistem menampilkan form produk.

4. Admin menginput data produk baru.

5. Admin memilih tombol “Simpan”.

6. Sistem menyimpan produk.

7. Sistem menutup form produk.

Alternate Flow/ Incariant A A2. Admin mengetikkan nama

produk.

A3. Admin memilih tombol

“Search”.

A4. Sistem menampilkan

produk yang dicari.

A5. Admin memilih tombol “Edit”.

A6. Sistem menampilkan form

produk.

A7. Admin menampilkan form

produk.

Kembali ke nomor 5.

Invariant B B2. Admin memilih produk.

B3. Admin memilih icon

“Hapus”.

B4. Sistem menampilkan dialog

konfirmasi penghapusan.

B5. Admin memilih tombol “Ok”.

B6. Sistem menghapus produk.

Page 7: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

40

b. Use Case Diagram Mengelola Transaksi

uc Mengelola Transaksi

Admin

Mengelola Transaksi

Mengupdate

Login

«extend»

«extend»

Gambar IV.4

Use Case Diagram Mengelola Transaksi

Deskripsi Use Case Mengelola Transaksi

Tabel IV.4.

Deskripsi Use Case Diagram Mengelola Transaksi.

Use Case Name Mengelola Transaksi

Requirments B2.

Goal Admin dapat mengupdate transaksi.

Pre-conditions Admin telah login.

Post-conditions Transaksi terupdate.

Failed end condition Gagal mengupdate transaksi.

Primary actor Admin

Main flow/ Basic Path 1. Admin melihat transaksi.

2. Admin memilih pilihan “Lihat”.

3. Sistem menampilkan detail transaksi.

4. Admin memilih icon “Edit”.

5. Sistem menampilkan form edit

transaksi.

6. Admin mengedit transaksi.

7. Admin memilih tombol “Simpan”.

8. Sistem menyimpan transaksi

Alternate Flow/ Incariant A A2. Admin mengetikkan kode

transaksi.

A3. Admin memilih tombol

“Search”.

A4. Sistem menampilkan

transaksi yang dicari.

A5. Admin memilih pilihan “Lihat”.

Kembali ke nomor 3

Page 8: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

41

c. Use Case Mengelola Ongkos Kirim

uc Mengelola Ogkos Kir...

Admin

Mengelola Ongkos

Kirim

Menambah

Mengupdate

Menghapus

Login

«extend»

«extend»

«extend»

«extend»

Gambar IV.5

Use Case Diagram Mengelola Ongkos Kirim

Page 9: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

42

Deskripsi Use Case Mengelola Ongkos Kirim

Tabel IV.5.

Deskripsi Use Case Diagram Mengelola Ongkos Kirim.

Use Case Name Mengelola Ongkos Kirim

Requirments B3.

Goal Admin dapat menambah, mengupdate, dan

menghapus ongkos kirim.

Pre-conditions Admin telah login.

Post-conditions Ongkos kirim tersimpan, teredit dan

terhapus.

Failed end condition Gagal menyimpan, mengupdate dan

menghapus.

Primary actor Admin

Main flow/ Basic Path 1. Admin dapat melihat daftar ongkos

kirim

2. Admin memilih tombol “Tambah”.

3. Sistem menampilkan form ongkos

kirim.

4. Admin menginput ongkos kirim baru.

5. Admin memilih tombol “Simpan”.

6. Sistem menyimpan ongkos kirim.

7. Sistem menutup form ongkos kirim.

Alternate Flow/ Incariant A A2. Admin mengetikkan nama kota.

A3. Admin memilih tombol

“Search”.

A4. Sistem menampilkan

ongkos kirim yang dicari.

A5. Admin memilih icon “Edit”.

A6. Sistem menampilkan form

ongkos kirim.

A7. Admin mengedit

ongkos kirim.

Kembali ke nomor 5.

Invariant B B2. Admin memilih ongkos kirim.

B3. Admin memilih icon

“Hapus”.

B4. Sistem menampilkan dialog

konfirmasi penghapusan.

B5. Admin memilih tombol “Ok”.

B6. Sistem menghapus data ongkos kirim.

Page 10: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

43

d. Use Case Mengelola Testimonial

uc Mengelola Testimonial

Admin

Mengelola Testimonial

Menghapus

Login

«extend»

«extend»

Gambar IV.6

Use Case Diagram Mengelola Testimonial

Deskripsi Use Case Mengelola Testimonial

Tabel IV.7.

Deskripsi Use Case Diagram Mengelola Testimonial.

Use Case Name Mengelola Testimonial.

Requirments B5.

Goal Admin dapat menghapus testimonial.

Pre-conditions Admin telah login.

Post-conditions Testimonial terhapus.

Failed end condition Gagal menghapus testimonial.

Primary actor Admin

Main flow/ Basic Path 1. Admin melihat testimonial.

2. Admin memilih icon “Hapus”.

3. Sistem menampilkan dialog

konfirmasi penghapusan.

4. Admin memilih tombol “Ok”.

5. Sistem menghapus data testimonial.

Alternate Flow/ Incariant A A1. Admin mengetikkan alamat

email.

A3. Admin memilih tombol

“Search”.

A4. Sistem menampilkan

testimonial yang dicari.

Page 11: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

44

A5. Admin memilih tombol

“Hapus”.

Kembali ke nomor 3.

f. Use Case Mengelola Customer.

uc Mengelola Custom...

Admin

Mengelola Customer

Menghapus

Login

«extend»

«extend»

Gambar IV.8

Use Case Diagram Mengelola Customer

Deskripsi Use Case Mengelola Customer.

Tabel IV.8.

Deskripsi Use Case Diagram Customer.

Use Case Name Mengelola Customer.

Requirments B6.

Goal Admin dapat menghapus customer.

Pre-conditions Admin telah login.

Post-conditions Data customer terhapus.

Failed end condition Gagal menghapus customer.

Primary actor Admin

Main flow/ Basic Path 1. Admin melihat customer.

2. Admin memilih pilihan “Hapus”.

3. Sistem menampilkan dialog

konfirmasi penghapusan.

4. Admin memilih tombol “Ok”.

5. Sistem menghapus customer.

Alternate Flow/ Incariant A A1. Admin mengetikkan nama

customer.

A3. Admin memilih tombol

“Search”.

A4. Sistem menampilkan

customer yang dicari.

Page 12: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

45

A5. Admin memilih tombol

“Hapus”.

Kembali ke nomor 3.

g. Use Case Mengelola Laporan.

uc Mengelola Lapor...

Admin

Mengelola Laporan

Mencetak

Login

«extend»

«extend»

Gambar IV.9

Use Case Diagram Mengelola Laporan

Deskripsi Use Case Mengelola Laporan.

Tabel IV.9.

Deskripsi Use Case Diagram Laporan.

Use Case Name Mengelola Laporan.

Requirments B7.

Goal Admin dapat mencetak laporan.

Pre-conditions Admin telah login.

Post-conditions Laporan tercetak.

Failed end condition Gagal mencetak laporan.

Primary actor Admin

Main flow/ Basic Path 1. Admin melihat laporan.

2.Admin memilih laporan

3.Admin memilih tombol “Cetak”.

4.S 4.Sistem menampilkan cetak laporan.

Page 13: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

46

h. Use Case Mengelola Admin.

uc Mengelola Ad...

Admin

Mengelola Admin

Mengupdate

Login

«extend»

«extend»

Gambar IV.10

Use Case Diagram Mengelola Admin

Deskripsi Use Case Mengelola Admin.

Tabel IV.10.

Deskripsi Use Case Diagram Mengelola Admin.

Use Case Name Mengelola Admin

Requirments B8.

Goal Admin dapat mengupdate admin.

Pre-conditions Admin telah login.

Post-conditions Admin terupdate.

Failed end condition Gagal mengedit admin.

Primary actor Admin

Main flow/ Basic Path 1. Admin melihat admin.

2. Sistem menampilkan form edit admin.

3. Admin mengedit admin.

4. Admin memilih tombol “Simpan”.

5. Sistem menyimpan admin

Page 14: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

47

C. Activity Diagram

Diagram ini terutama penting dalam pemodelan fungsi-fungsi suatu sistem dan

memberi tekanan pada aliran kendali antar objek.

1. Activity Diagram Belanja Online Halaman Front Page

act Halaman Front Page

Memilih Kategori

Start

Memilih Barang

Decision

Simpan ke Keranjang

Belanja

Checkout

Menampilkan Rincian

BelanjaIsi Data Registrasi Memilih Metode

Pembayaran

Menyelesaikan Transaksi Melakukan Konfirmasi

Pembayaran

End

YT

Y

T

Decision

Gambar IV.11.

Activity Diagram Belanja Online Halaman Front Page

2. Activity Diagram Admin Mengelola Produk

Page 15: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

48

act Admin Mengelola Data Lapor...

Start

Browse ProdukDecision

Memilih ProdukMerge

Simpan Produk

End

Update Produk

Hapus Produk

Decision

Tambah

Edit

Hapus

Gambar IV.12.

Activity Diagram Admin Mengelola Produk

3. Activity Diagram Mengelola Transaksi

act Admin Mengelola Transaksi

Start

Browse Transaksi Update Transaksi Simpan Transaksi

End

Gambar IV.13.

Activity Diagram Admin Mengelola Transaksi

Page 16: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

49

4. Activity Diagram Admin Mengelola Ongkos Kirim

act Admin Mengelola Ongkos Kir...

Start

Browse Ongkos KirimDecision

Input Ongkos KirimMerge

Simpan Ongkos Kirim

End

Update Ongkos Kirim

Hapus Ongkos Kirim

Decision

Tambah

Edit

Hapus

Gambar IV.14.

Activity Diagram Admin Mengelola Ongkos KirimActivity Diagram

Admin Mengelola Testimonial

act Admin Mengelola Testimonial

Start

Browse Testimonial Input Testimonial Simpan Testimonial

End

Gambar IV.15.

Activity Diagram Admin Mengelola Testimonial

5. Activity Diagram Admin Mengelola Customer

Page 17: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

50

act Admin Mengelola Testimonial

Start

Browse Customer Input Customer Simpan Customer

End

Gambar IV.17.

Activity Diagram Admin Mengelola Customer

6. Activity Diagram Admin Mengelola Data Laporan

act Admin Mengelola Lapor...

Start

Browse Laporan Memilih Laporan Mencetak Laporan

End

Gambar IV.18.

Activity Diagram Admin Mengelola Data Laporan

7. Activity Diagram Admin Mengelola Admin

act Admin Mengelola Ad...

Start

Browse Admin Update Admin Simpan Admin

End

Gambar IV.19.

Activity Diagram Admin Mengelola Admin

Page 18: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

51

4.2. Desain

Pada tahapan ini akan menjelaskan tentang desain database, desain

software architecture dan desain interface dari sistem yang ada di toko Toko

Batik 10s.

4.2.1. Database

Untuk desain database menjelaskan tentang hubungan antar tabel yang

ada di Toko Toko Batik 10s yang meliputi Entity Relationship Diagram, Logical

Record Structure dan spesifikasi file.

1. Entity Relationship Diagram

Gambar IV.20.

Entity Relationship Diagram Penjualan Online

kd_pelanggan

Pelanggan Melakukan

nm_pelanggan

kelamin password

no_telepon

email

username

tgl_daftar

Pemesanan Memiliki Konfirmasi

kota

kode_posno_telepon

no_pemesanan

tgl_pemesanan

nama_penerima

Alamat_lengkapkd_provinsi

Status_bayar

kd_pelanggan

no_pemesanan

no_pemesananid

Pemesanan_detail

keterangan

jumlah_transfer

no_rekening

nm_rekening

id

tanggal

nm_pelanggan

kd_barang

harga

id

jumlah

Barang

nm_barang

stok

harga_modal

harga_jual

kd_barang

file_gambar

keterangan

Memiliki Kategori

kd_kategori nm_kategori

kd_kategori kd_barang

1 M 1 1

M

M

M

1

no_pemesanan

Memiliki Pengiriman

tgl_kirim

jam_kirimno_pemesanan

id_kirim

id_kirim

1

1

Page 19: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

52

2. Logical Record Strcture

Pelanggan

kd_pelanggan*

nm_pelanggan

kelamin

email

no_telepon

username

password

tgl_daftar

Pemesanan

no_pemesanan*

kd_pelanggan**

tgl_pemesanan

nama_penerima

alamat_lengkap

kd_provinsi

kota

kode_pos

no_telepon

status_bayar

Konfirmasi

id*

no_pemesanan**

nm_pelanggan

nm_rekening

no_rekening

jumlah_transfer

keterangan

tanggal

Pemesanan_detail

id*

no_pemesanan**

kd_barang**

harga

jumlah

Barang

kd_barang*

nm_barang

harga_modal

harga_jual

stok

keterangan

file_gambar

kd_kategori**

Kategori

kd_kategori*

nm_kategori

1

M

1

1

M

1

1

M

M

1

Pengiriman

id_kirim*

tgl_kirim

jam_kirim

no_pemesanan**

1

1

Gambar IV.21.

Logical Record Strcture Penjualan Online

Page 20: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

53

3. Spesifikasi File

Spesifikasi file yang ada di Toko Toko Batik 10s meliputi :

a. Spesifikasi File Tabel Admin

Nama Database : DbTokoBatik

Nama File : admin

Akronim : admin

Fungsi : Untuk mengetahui data login admin.

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 230 karakter

Kunci Field : username

Software : Mysql

Tabel IV. 11. Spesifikasi File Tabel Admin

No. Elemen Data Nama Field Tipe Data Panjang Keterangan

1. Username Username Varchar 30 Primary Key

2. Password Password Varchar 30 -

b. Spesifikasi File Tabel Barang

Nama Database : DbTokoBatik

Nama File : barang

Page 21: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

54

Akronim : barang

Fungsi : Untuk mengetahui data barang yang tersedia di

website.

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 509 karakter

Kunci Field : kd_barang

Software : Mysql

Tabel IV. 12. Spesifikasi File Tabel Barang

No Elemen Data Nama Field Tipe Data Panjang Keterangan

1. Kode Barang kd_barang Char 5 Primary Key

2. Nama Barang nm_barang Varchar 100 -

3. Harga Modal harga_modal Int 12 -

4. Harga Jual harga_jual Int 12 -

5. Stok Stok Enum (‘Ready

Stok’,’Sold Out’)

- -

6. Keterangan Keterangan Text 255 -

7. File Gambar file_gambar Varchar 100 -

Page 22: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

55

8. Kode Kategori kd_kategori Char 4 -

c. Spesifikasi File Tabel Kategori

Nama Database : DbTokoBatik

Nama File : kategori

Akronim : kategori

Fungsi : Untuk mengetahui data kategori barang yang

tersedia

di website.

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Hardisk

Panjang Record : 104 karakter

Kunci Field : kd_kategori

Sofware : Mysql

Tabel IV. 13. Spesifikasi File Tabel Kategori

No Elemen Data Nama Field Tipe Data Panjang Keterangan

1. Kode Kategori kd_kategori Char 4 Primary Key

2. Nama Kategori nm_kategori Varchar 100 -

d. Spesifikasi File Tabel Konfirmasi

Nama Database : DbTokoBatik

Page 23: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

56

Nama File : konfirmasi

Akronim : konfirmasi

Fungsi : Untuk mengetahui data konfirmasi pembayaran

dari

pelanggan.

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 489 karakter

Kunci Field : id

Software : Mysql

Tabel IV. 14. Spesifikasi File Tabel Konfirmasi

No Elemen Data Nama Field Tipe Data Panjang Keterangan

1. Id Id Int 4 Primary Key

2. No Pemesanan no_pemesanan Varchar 8 -

3. Nama Pelanggan nm_pelanggan Varchar 100 -

4. Nama Rekening nm_rekening Varchar 50 -

5. No Rekening no_rekening Varchar 50

6. Jumlah Transfer jumlah_transfer Int 12 -

Page 24: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

57

7. Keterangan Keterangan Text 255 -

8. Tanggal Tanggal Date 10 -

e. Spesifikasi File Tabel Pelanggan

Nama Database : DbTokoBatik

Nama File : pelanggan

Akronim : pelanggan

Fungsi : Untuk mengetahui data pelanggan yang sudah

mendaftar menjadi pelanggan.

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 379 karakter

Kunci Field : kd_pelanggan

Software : Mysql

Tabel IV. 15. Spesifikasi File Tabel Pelanggan

No Elemen Data Nama Field Tipe Data Panjang Keterangan

1. Kode Pelanggan kd_pelanggan Char 6 Primary Key

2. Nama Pelanggan nm_pelanggan Varchar 100 -

Page 25: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

58

3. Jenis Kelamin Kelamin Enum

(‘Laki-

laki’,’Pere

mpuan’)

- -

4. Email Email Varchar 100 -

5. No Telepon no_telepon Varchar 20 -

6. Username Username Varchar 20 -

7. Password Password Varchar 20 -

8. Tanggal Daftar tgl_daftar Date 10 -

f. Spesifikasi File Tabel Pemesanan

Nama Database : DbTokoBatik

Nama File : pemesanan

Akronim : pemesanan

Fungsi : Untuk mengetahui data pemesanan barang yang

sudah

di pesan oleh pelanggan.

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 513 karakter

Page 26: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

59

Kunci Field : no_pemesanan

Software : Mysql

Tabel IV. 16. Spesifikasi File Tabel Pemesanan

No Elemen Data Nama Field Tipe Data Panjang Keterangan

1. No Pemesanan no_pemesanan Char 8 Primary Key

2. Kode Pelanggan kd_pelanggan Char 6 -

3. Tanggal

Pemesanan

tgl_pemesanan Date 10 -

4. Nama Penerima nama_penerima Varchar 60 -

5. Alamat Lengkap alamat_lengkap Varchar 200 -

6. Kode Provinsi kd_provinsi Char 3 -

7. Kota Kota Varchar 100 -

8. Kode Pos kode_pos Varchar 6 -

9. No Telepon no_telepon Varchar 20 -

10. Status Bayar status_bayar Varchar 100

g. Spesifikasi File Tabel Pemesanan Detail

Nama Database : DbTokoBatik

Nama File : pemesanan_detail

Page 27: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

60

Akronim : pemesanan_detail

Fungsi : Untuk mengetahui data pemesanan detail barang.

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 32 karakter

Kunci Field : id

Software : Mysql

Tabel IV. 17. Spesifikasi File Tabel Pemesanan Detail

No Elemen Data Nama Field Tipe Data Panjang Keteranagn

1. Id Id Int 4 Primary Key

2. No Pemesanan no_pemesanan Char 8 -

3. Kode Barang kd_barang Char 5 -

4. Harga Harga Int 12 -

5. Jumlah Jumlah Int 3 -

h. Spesifikasi File Tabel Pengiriman

Nama Database : DbTokoBatik

Nama File : pengiriman

Page 28: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

61

Akronim : pengiriman

Fungsi : Untuk mengetahui data pengiriman barang.

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 31 karakter

Kunci Field : id_kirim

Software : Mysql

Tabel IV.18. Spesifikasi File Tabel Pengiriman

No Elemen Data Nama Field Tipe Data Panjang Keterangan

1. Id Kirim id_kirim Int 5 Primary Key

2. Tanggal Kirim tgl_kirim Date 10 -

3. Jam Kirim jam_kirim Time 8 -

4. No Pemesanan no_pemesanan Char 8 -

i. Spesifikasi File Tabel Provinsi

Nama Database : DbTokoBatik

Nama File : provinsi

Akronim : provinsi

Fungsi : Untuk mengetahui biaya kirim pada setiap daerah.

Tipe File : File Master

Page 29: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

62

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 115 karakter

Kunci Field : kd_provinsi

Software : Mysql

Tabel IV. 19. Spesifikasi File Tabel Provinsi

No Elemen Data Nama Field Tipe Data Panjang Keterangan

1. Kode Provinsi kd_provinsi Char 3 Primary Key

2. Nama Provinsi nm_provinsi Varchar 100 -

3. Biaya Kirim biaya_kirim Int 12 -

j. Spesifikasi File Tabel Testimonial

Nama Database : DbTokoBatik

Nama File : testimonial

Akronim : testimonial

Fungsi : Untuk mengetahui kesan-kesan atau komentar dari

pelanggan yang sudah berbelanja di website.

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 355 karakter

Page 30: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

63

Kunci Field : nama

Software : Mysql

Tabel IV. 20. Spesifikasi File Tabel Testimonial

No Elemen Data Nama Field Tipe Data Panjang Keterangan

1. Nama Nama Varchar 50 Primary Key

2. Email Email Varchar 50 -

3. Komentar Komentar Text 255 -

k. Spesifikasi File Tabel Buku Tamu

Nama Database : DbTokoBatik

Nama File : buku_tamu

Akronim : buku_tamu

Fungsi : Untuk mengetahui komentar dari pelanggan

maupun

pengunjung yang sudah mengunjungi website.

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 355 karakter

Kunci Field : nama

Software : Mysql

Page 31: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

64

Tabel IV. 21. Spesifikasi File Tabel Buku Tamu

No Elemen Data Nama Field Tipe Data Panjang Keterangan

1. Nama Nama Varchar 50 Primary Key

2. Email Email Varchar 50 -

3. Pesan Pesan Text 255 -

l. Spesifikasi File Tabel Tempat Keranjang

Nama Database : DbTokoBatik

Nama File : tmp_keranjang

Akronim : tmp_keranjang

Fungsi : Untuk mengetahui tempat keranjang belanja

pelanggan.

Tipe File : File Master

Organisasi File : Indexed Sequential

Akses File : Random

Media : Harddisk

Panjang Record : 41 karakter

Kunci Field : id

Software : Mysql

Page 32: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

65

Tabel IV. 22. Spesifikasi File Tabel Tempat Keranjang

No Elemen Data Nama Field Tipe Data Panjang Keterangan

1. Id Id Integer 5 Primary Key

2. Kode Barang kd_barang Char 5 -

3. Harga Harga Int 12 -

4. Jumlah Jumlah Int 3 -

5. Tanggal Tanggal Date 10 -

6. Kode Pelanggan kd_pelanggan Char 6 -

4.2.2. Software Architecture

Untuk penggambaran software architecture yang ada di toko Toko Batik

10s meliputi beberapa duagram-diagram, diantaranya meliputi class diagram,

sequence diagram, component diagram dan deployment diagram.

A. Component Diagram

Diagram ini berhubungan dengan diagram kelas dimana komponen secara

tipikal dipetakan kedalam satu atau lebih kelas-kelas, antarmuka-antarmuka serta

kolaborasi-kolaborasi.

Page 33: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

66

cmp Sistem Penj Onli...

FrontPageApplication

Apllication

Database

Jquery.js

style.css

Apache2 Serv er

MySQL Database

Admin Application

Gambar IV.22.

Compnent Diagram Sistem Penjualan Online

B. Deployment Diagram

Memuat simpul-simpul beserta komponen-komponen yang ada didalamnya.

Diagram deployment berhubungan erat dengan diagram komponen dimana

diagram ini memuat satu atau lebih komponen-komponen. Diagram ini sangat

berguna saat aplikasi kita berlaku sebagai aplikasi yang dijalankan pada banyak

mesin (distributed computing).

Page 34: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

67

deployment Sistem Penj Onli...

Web Serv er

FrontPageApplication

Jquery.js

style.css

Apache2 Serv er

Admin Application

Client PC

Browser

Database Serv er

Apllication

Database

MySQL Database

Port 80

Port 3306

Gambar IV.23.

Deployment Diagram Sistem Penjualan Online

Page 35: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

68

4.2.3. User Interface

User interface yang ada pada website Batik 10s yaitu :

1. Halaman Beranda

Halaman beranda adalah halaman yang pertama kali dilihat oleh pengunjung.

Pada halaman ini konsumen bisa melihat produk yang dijual.

Gambar IV.24.

Tampilan Halaman Beranda

Page 36: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

69

2. Halaman Produk

Pada halaman produk konsumen bisa melihat semua model baju dan tas sesuai

dengan keinginan.

Gambar IV.25.

Tampilan Halaman Produk

4. Halaman Tentang Kami

Halaman profil ini berisi tentang profil, visi dan misi dari toko Batik 10s.

Gambar IV.27.

Tampilan Halaman Tentang

Page 37: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

70

5. Halaman Panduan Belanja

Halaman ini berisi Panduan belanja di Batik 10s.

Gambar IV.28.

Tampilan Halaman Panduan Belanja

6. Halaman Kontak Kami

Pada halaman ini berisi informasi alamat toko.

Gambar IV.29.

Tampilan Halaman Kontak Kami

Page 38: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

71

8. Halaman Daftar

Halaman akun saya berisi tentang form data diri yang pernah diisi pada saat daftar

menjadi member.

Gambar IV.31.

Tampilan Halaman Daftar

9. Halaman Testimonial

Halaman ini berisi form testimonial yang apabila member ingin memberikan

komentar atau pesan kepada website ini.

Gambar IV.32.

Tampilan Halaman Testimonia

Page 39: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

72

11.Halaman Keranjang Belanja

Pada halaman keranjang belanja konsumen bisa melihat barang yang sudah

dimasukkan ke dalam keranjang belanja. Konsumen bisa menambah , mengurangi

dan menghapus produk yang hendak dibeli.

Gambar IV.34.

Tampilan Halaman Keranjang Belanja

12.Form Konfirmasi Pembayaran

Halaman ini berisi konfirmasi pembayaran dari member.

Gambar IV.35.

Tampilan Halaman Konfirmasi Pembayaran

Page 40: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

73

13.Halaman Login Admin

Halaman ini berisi Login Admin.

Gambar IV.36.

Tampilan Halaman Login Admin

14.Halaman Beranda Admin

Halaman yang pertama kali dibuka pada saat login ke halaman admin.

Gambar IV.37.

Tampilan Halaman Beranda Admin

Page 41: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

74

4.3. Code Generation

Menurut Rosa dan Salahuddin (2013:29) “tahap code generation adalah

desain harus ditranslasikan ke dalam program perangkat lunak”. Code generation

disini menampilkan listing program hasil generate dari class-class yang telah

dibuat. Code generation yang ada pada website toko Batik 10s yaitu :

A. Form Pelanggan <?php

include_once "library/inc.connection.php";

include_once "library/inc.library.php";

# KONFIRMASI JIKA PENYIMPANAN SUKSES

if(isset($_POST['btnDaftar'])){

}

# TOMBOL DAFTAR DIKLIK

if(isset($_POST['btnDaftar'])){

// Baca Variabel Form

$txtNama = $_POST['txtNama'];

$txtNama = str_replace("'","&acute;",$txtNama);

$kelamin = $_POST['kelamin'];

$txtEmail = $_POST['txtEmail'];

$txtNoTelepon = $_POST['txtNoTelepon'];

$txtUsername = $_POST['txtUsername'];

$txtPassword_1 = $_POST['txtPassword_1'];

$txtPassword_2 = $_POST['txtPassword_2'];

// Validasi, jika data kosong kirimkan pesan error

$pesanError = array();

if (trim($txtNama) =="") {

$pesanError[] = " <center>Data <b>Nama Pelanggan</b> belum di isi !";

}

if (trim($kelamin) =="") {

$pesanError[] = "Data <b>Jenis Kelamin</b> belum di pilih !";

}

if (trim($txtEmail) =="") {

$pesanError[] = "Data <b>Alamat Email</b> belum di isi !";

}

if (trim($txtNoTelepon) =="") {

$pesanError[] = "Data <b>No. Telepon</b> belum di isi !";

}

if (trim($txtNoTelepon) =="" or ! is_numeric(trim($txtNoTelepon))) {

$pesanError[] = "Data <b>No. Telepon</b> harus di isi dengan angka !";

}

if (trim($txtUsername) =="") {

$pesanError[] = "Data <b>Username</b> belum di isi !";

}

if (trim($txtPassword_1) =="") {

$pesanError[] = "Data <b>Password</b> belum di isi !";

Page 42: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

75

}

if (trim($txtPassword_2) =="") {

$pesanError[] = "Data <b>Password (lagi)</b> belum di isi !";

}

if (trim($txtPassword_1) != trim($txtPassword_2)) {

$pesanError[] = "Data <b>Password Ke 2</b> tidak sama dengan konfirmasi data

password pertama !";

}

// Valiasii Username, tidak boleh ada yang kembar

$sqlCek = "SELECT * FROM pelanggan WHERE username='$txtUsername'";

$qryCek = mysql_query($sqlCek, $koneksidb) or die ("Gagal Cek");

$adaCek = mysql_num_rows($qryCek);

if($adaCek >= 1) {

$pesanError[] = " <center>EROR !!! User <b> $txtUsername </b> sudah ada

yang menggunakan !";

}

# JIKA ADA PESAN ERROR DARI VALIDASI

if (count($pesanError)>=1 ){

echo "<div class='pesanError' align='center'>";

echo "<img src='images/attention.png'> <br><hr>";

$noPesan=0;

foreach ($pesanError as $indeks=>$pesan_tampil) {

$noPesan++;

echo "&nbsp;&nbsp; $noPesan. $pesan_tampil<br>";

}

echo "<br>";

}

else {

# SIMPAN DATA KE DATABASE. Jika tidak menemukan pesan error, simpan data ke

database

$kodeBaru = buatKode("pelanggan","P");

$tanggal = date('Y-m-d');

$mySql = "INSERT INTO pelanggan ( kd_pelanggan, nm_pelanggan, kelamin, email,

no_telepon,

username, password, tgl_daftar)

VALUES ('$kodeBaru', '$txtNama', '$kelamin', '$txtEmail',

'$txtNoTelepon',

'$txtUsername', MD5('$txtPassword_1'), '$tanggal')";

echo "<script>alert('Anda Berhasil Mendaftar Sebagai Pelanggan, Silahkan Login

!')</script>";

echo "<script>location='index.php'</script>";

$myQry = mysql_query($mySql, $koneksidb) or die ("Gagal query".mysql_error());

if($myQry){

echo "<meta http-equiv='refresh' content='0; url='?open=Pelanggan-

Baru&Aksi=Sukses'>";

}

exit;

}

} // End if($_POST)

# BACA VARIABEL FORM

$dataNama = isset($_POST['txtNama']) ? $_POST['txtNama'] : '';

Page 43: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

76

$dataKelamin = isset($_POST['kelamin']) ? $_POST['kelamin'] : '';

$dataEmail = isset($_POST['txtEmail']) ? $_POST['txtEmail'] : '';

$dataNoTelepon = isset($_POST['txtNoTelepon']) ? $_POST['txtNoTelepon'] : '';

$dataUsername = isset($_POST['txtUsername']) ? $_POST['txtUsername'] : '';

?>

<style type="text/css">

<!--

.style6 {font-family: "Times New Roman", Times, serif; font-weight: bold; font-size: 16px; color: #FFFFFF;

}

.style8 {

font-family: "Times New Roman", Times, serif;

font-size: 16;color: #FFFFFF;

}

.style11 {color: #FFFFFF; font-weight: bold; font-family: "Times New Roman", Times, serif; font-size:

18px; }

.style12 {color: #FFFFFF;

font-family: "Times New Roman", Times, serif;

font-size: 14px;

}

-->

</style>

<title>Pendaftaran Baru</title>

<form action="<?php $_SERVER['PHP_SELF']; ?>" method="post" name="form1" target="_self">

<center>

<table width="564" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td width="1091" height="48" bgcolor="#333333"><div align="center"

class="style6"><strong>Silahkan isi data diri Anda dengan benar : </strong></div></td>

</tr>

</table>

<table width="531" height="334" border="0" align="center" cellpadding="3" cellspacing="0">

<tr bgcolor="#555555">

<td height="43" colspan="3"><div align="center"><span class="style11"> FORM PENDAFTARAN

PELANGGAN</span></div></td>

</tr>

<tr bordercolor="#555555" bgcolor="#555555">

<td width="30%" bordercolor="#FFFFFF"><span class="style6">Nama Pelanggan </span></td>

<td width="3%" bordercolor="#FFFFFF"><b>:</b></td>

<td width="67%" bordercolor="#FFFFFF"><input name="txtNama" type="text" value="<?php echo

$dataNama; ?>" size="50" maxlength="60"></td>

</tr>

<tr bordercolor="#555555" bgcolor="#555555">

<td bordercolor="#FFFFFF"><span class="style6"> Jenis Kelamin</span></td>

<td bordercolor="#FFFFFF"><b>:</b></td>

<td bordercolor="#FFFFFF">

<span class="style8">

<input type="radio" name='kelamin' value='Laki-laki'>Laki-laki

<input type="radio" name='kelamin' value="Perempuan">Perempuan

</span> </td>

</tr>

<tr bordercolor="#555555" bgcolor="#555555">

<td bordercolor="#FFFFFF"><span class="style6">Email</span></td>

<td bordercolor="#FFFFFF"><b>:</b></td>

<td bordercolor="#FFFFFF"><input name="txtEmail" type="text" value="<?php echo $dataEmail; ?>"

size="50" maxlength="40" /></td>

Page 44: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

77

</tr>

<tr bordercolor="#555555" bgcolor="#555555">

<td bordercolor="#FFFFFF"><span class="style6">No. Telepon</span></td>

<td bordercolor="#FFFFFF"><b>:</b></td>

<td bordercolor="#FFFFFF"><input name="txtNoTelepon" type="text" value="<?php echo

$dataNoTelepon; ?>" size="30" maxlength="20" /></td>

</tr>

<tr>

<td height="34" colspan="3" bgcolor="#555555"><div align="center"><span class="style11">DATA

LOGIN </span></div></td>

</tr>

<tr bordercolor="#FFFFFF" bgcolor="#555555">

<td><span class="style6">Username</span></td>

<td><b>:</b></td>

<td><input name="txtUsername" type="text" value="<?php echo $dataUsername; ?>" size="25"

maxlength="40"></td>

</tr>

<tr bordercolor="#FFFFFF" bgcolor="#555555">

<td><span class="style6">Password</span></td>

<td><b>:</b></td>

<td><input name="txtPassword_1" type="password" size="25" maxlength="40"></td>

</tr>

<tr bordercolor="#FFFFFF" bgcolor="#555555">

<td><span class="style6">Password (Lagi) </span></td>

<td><b>:</b></td>

<td><input name="txtPassword_2" type="password" size="25" maxlength="40" /></td>

</tr>

<tr bordercolor="#FFFFFF" bgcolor="#555555">

<td>&nbsp;</td>

<td>&nbsp;</td>

<td><input name="btnDaftar" type="submit" value=" Daftar "></td>

</tr>

</table>

</form>

Page 45: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

78

B. Form Pemesanan <?php

include_once "inc.session.php";

include_once "library/inc.connection.php";

include_once "library/inc.library.php";

// Baca Kode Pelanggan yang Login

$KodePelanggan = $_SESSION['SES_PELANGGAN'];

# TOMBOL SIMPAN DIKLIK

if(isset($_POST['btnSimpan'])){

$arrData = count($_POST['txtJum']);

$qty = 1;

for ($i=0; $i < $arrData; $i++) {

# Melewati biar tidak 0 atau minus

if ($_POST['txtJum'][$i] < 1) {

$qty = 1;

}

else {

$qty = $_POST['txtJum'][$i];

}

# Simpan Perubahan

$KodeBrg = $_POST['txtKodeH'][$i];

$tanggal = date('Y-m-d');

$jam = date('G:i:s');

$sql = "UPDATE tmp_keranjang SET jumlah='$qty', tanggal='$tanggal'

WHERE kd_barang='$KodeBrg' AND

kd_pelanggan='$KodePelanggan'";

$query = mysql_query($sql, $koneksidb);

}

// Refresh

echo "<script>alert('Jumlah Barang Berhasil Di Ubah')</script>";

echo "<meta http-equiv='refresh' content='0; url=?open=Keranjang-Belanja'>";

exit;

}

# MENGHAPUS DATA BARANG YANG ADA DI KERANJANG

// Membaca Kode dari URL

if(isset($_GET['aksi']) and trim($_GET['aksi'])=="Hapus"){

// Membaca Id data yang dihapus

$idHapus = $_GET['idHapus'];

// Menghapus data keranjang sesuai Kode yang dibaca di URL

$mySql = "DELETE FROM tmp_keranjang WHERE id='$idHapus' AND

kd_pelanggan='$KodePelanggan'";

$myQry = mysql_query($mySql, $koneksidb) or die ("Eror hapus data".mysql_error());

if($myQry){

echo "<meta http-equiv='refresh' content='0; url=?open=Keranjang-Belanja'>";

}

}

<title>Keranjang Belanja</title>

<form action="<?php $_SERVER['PHP_SELF']; ?>" method="post" name="form1" target="_self">

<center> <table width="90%" border="1" cellspacing="0" cellpadding="3">

Page 46: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

79

<tr bgcolor="#333333">

<td height="34" colspan="6"><div align="center" class="style1">KERANJANG BELANJA</div></td>

</tr>

<tr bgcolor="">

<td width="15%"><span class="style1">Gambar</span></td>

<td width="38%"><span class="style1">Nama Barang</span></td>

<td width="18%"><span class="style1">Harga Barang </span></td>

<td width="10%"><span class="style1">Jumlah</span></td>

<td width="14%"><span class="style1">Total Harga </span></td>

<td width="5%"><span class="style1">Tools</span></td>

</tr>

<?php

// Menampilkan data Barang dari tmp_keranjang (Keranjang Belanja)

$mySql = "SELECT barang.nm_barang, barang.file_gambar, kategori.nm_kategori,

tmp_keranjang.*

FROM tmp_keranjang

LEFT JOIN barang ON tmp_keranjang.kd_barang=barang.kd_barang

LEFT JOIN kategori ON barang.kd_kategori=kategori.kd_kategori

WHERE tmp_keranjang.kd_pelanggan='$KodePelanggan'

ORDER BY tmp_keranjang.id";

$myQry = mysql_query($mySql, $koneksidb) or die ("Gagal SQL".mysql_error());

$total = 0; $grandTotal = 0;

$no = 0;

while ($myData = mysql_fetch_array($myQry)) {

$no++;

// Menghitung sub total harga

$total = $myData['harga'] * $myData['jumlah'];

// Menghitung grand total harga (semua barang yang dibeli)

$grandTotal = $grandTotal + $total;

// Menampilkan gambar

if ($myData['file_gambar']=="") {

$fileGambar = "img-barang/noimage.jpg";

}

else {

$fileGambar = $myData['file_gambar'];

}

#Kode Barang

$Kode = $myData['kd_barang'];

?>

<tr>

<td rowspan="3" bgcolor=" "> <img src="img-barang/<?php echo $fileGambar; ?>" width="106"

height="76" border="1" > </td>

<td bgcolor=" "><a href="?open=Barang-Lihat&Kode=<?php echo $Kode; ?>" target="_blank"

class="style2 style6"><?php echo $myData['nm_barang']; ?></a></td>

<td bgcolor=" "><span class="style27">Rp. <?php echo format_angka($myData['harga']);

?></span></td>

<td bgcolor=" "><span class="style27">

<input name="txtJum[]" type="text" value="<?php echo $myData['jumlah']; ?>" size="4"

maxlength="2">

<input name="txtKodeH[]" type="hidden" value="<?php echo $myData['kd_barang']; ?>">

</span></td>

<td bgcolor=" "><span class="style27">Rp. <?php echo format_angka($total); ?></span></td>

Page 47: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

80

<td bgcolor=" "><a href="?open=Keranjang-Belanja&aksi=Hapus&idHapus=<?php echo

$myData['id'];?>"target="_self" class="style8 style18" onclick="return confirm('Anda Yakin Ingin

menghapus Data Keranjang Belanja Ini?')" alt="Delete Data">Delete</a></td>

</tr> <tr>

<td bgcolor=""><span class="style27">Kategori : <?php echo $myData['nm_kategori']; ?></span></td>

<td bgcolor="">&nbsp;</td>

<td bgcolor="">&nbsp;</td>

<td bgcolor="">&nbsp;</td>

<td bgcolor=""><span class="style18"></span></td>

</tr>

<tr>

<td bgcolor="">&nbsp;</td>

<td bgcolor="">&nbsp;</td>

<td bgcolor="">&nbsp;</td>

<td bgcolor="">&nbsp;</td>

<td bgcolor=""><span class="style18"></span></td>

</tr>

<?php } ?>

<tr bgcolor="">

<td><span class="style6"></span></td>

<td>&nbsp;</td>

<td colspan="2"><div align="right" class="style28"><span class="style29">GRAND TOTAL :

</span></div></td>

<td><span class="style27"><strong><?php echo "Rp. ".format_angka($grandTotal);

?></strong></span></td>

<td><span class="style6"></span></td>

</tr>

<tr bgcolor="">

<td><span class="style6"></span></td>

<td><span class="style6"></span></td>

<td><span class="style6"></span></td>

<td><span class="style6"></span></td>

<td><input name="btnSimpan" type="submit" value="Update Jumlah"></td>

<td><span class="style6"></span></td>

</tr>

<tr bgcolor="">

<td colspan="6" align="center"><a href="?open=Transaksi-Proses" target="_self" class="style8"><img

src="images/btn_lanjutkan.png" alt="Lanjutkan Transaksi (Checkout)" width="168" height="35"

border="0"></a></td>

</tr>

</table>

</form>

Page 48: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

81

C. Form Barang <?php

// Validasi : halaman ini hanya boleh diakses oleh Admin/Petugas yang sudah login

include_once "../library/inc.sesadmin.php";

# UNTUK PAGING (PEMBAGIAN HALAMAN)

$baris = 15;

$hal = isset($_GET['hal']) ? $_GET['hal'] : 0;

$pageSql = "SELECT * FROM barang";

$pageQry = mysql_query($pageSql, $koneksidb) or die ("error paging: ".mysql_error());

$jumlah = mysql_num_rows($pageQry);

$maksData= ceil($jumlah/$baris);

?>

<style type="text/css">

<!--

.style1 {

font-size: 18px;

font-weight: bold;

font-family: "Times New Roman", Times, serif;

color: #FFFFFF;

}

.style4 {font-size: 16px; font-weight: bold; font-family: "Times New Roman", Times, serif; }

.style5 {

font-size: 16px;

font-weight: bold;

}

-->

</style>

<title>Barang Data</title>

<table width="731" border="0" cellspacing="1" cellpadding="3">

<tr bgcolor="#998AC9">

<td height="33" colspan="2"><div align="center"><span class="style1">DATA BARANG

</span></div></td>

</tr>

<tr>

<td colspan="2" align="right"><a href="?open=Barang-Add" target="_self"><img

src="../images/btn_add_data.png" width="91" height="27" border="0" /></a></td>

</tr>

<tr>

<td colspan="2">

<table class="table-list" width="103%" border="0" cellspacing="1" cellpadding="3">

<tr bgcolor="#998AC9">

<th width="5%"><span class="style4">No</span></th>

<th width="12%"><span class="style4">Kode</span></th>

<th width="33%"><span class="style4">Nama Barang </span></th>

<th width="18%"><span class="style4"> Stok</span></th>

<th width="18%"><span class="style4"> Harga</span></th>

<th colspan="2" scope="col"><div align="center"><span class="style4">Tools</span></div></th>

</tr>

<?php

$mySql = "SELECT * FROM barang ORDER BY kd_barang ASC LIMIT $hal, $baris";

$myQry = mysql_query($mySql, $koneksidb) or die ("Query salah : ".mysql_error());

$nomor = $hal;

while ($myData = mysql_fetch_array($myQry)) {

$nomor++;

$Kode = $myData['kd_barang'];

Page 49: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

82

?>

<tr>

<td> <div align="center"><?php echo $nomor; ?></div></td>

<td> <?php echo $myData['kd_barang']; ?> </td>

<td> <?php echo $myData['nm_barang']; ?> </td>

<td> <?php echo $myData['stok']; ?> </td>

<td> Rp. <?php echo format_angka($myData['harga_jual']); ?> </td>

<td width="7%"><div align="center"><a href="?open=Barang-Edit&Kode=<?php echo $Kode; ?>"

target="_self" alt="Edit Data"><img src="../images/b_edit.png" width="16" height="16"></a></div></td>

<td width="7%"><div align="center"><a href="?open=Barang-Delete&Kode=<?php echo $Kode; ?>"

target="_self" alt="Delete Data" onclick="return confirm('Anda Yakin Ingin Menghapus Data Barang

Ini?')"><img src="../images/hapus.gif" width="16" height="16"></a></div></td>

</tr>

<?php } ?>

</table> </td>

</tr>

<tr>

<td width="313"><span class="style4">Jumlah Data : </span> <?php echo $jumlah; ?></td>

<td width="372" align="right"><span class="style5">Halaman ke : </span>

<?php

for ($h = 1; $h <= $maksData; $h++) {

$list[$h] = $baris * $h - $baris;

echo " <a href='?open=Barang-Data&hal=$list[$h]'>$h</a> ";

}

?> </td>

</tr>

</table>

Page 50: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

83

4.4. Testing

Menurut Rosa dan Salahuddin (2013:30) “tahap pengujian (testing) adalah

fokus pada perangkat lunak secara dari segi lojik dan fungsional dan memastikan

bahwa semua bagian sudah diuji”. Untuk pengujian pada website Batik 10s

dengan menggunakan teknik black box testing. Adapun pengujiannya yaitu :

1. Pengujian Terhadap Form Login Admin

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 di isi

kemudian

klik tombol

Login.

Username :

(kosong)

Password :

(kosong)

Sistem akan

menolak akses user

dan menampilkan

“Error

1. Data Username

belum di isi !

2. Data Password

belum di isi !”.

Sesuai

Harapan

Valid

2. Username

di isi dan

Password

tidak di isi

(kosong)

kemudian

klik tombol

Login.

Username :

Susi2018

Password :

(kosong)

Sistem akan

menolak akses user

dan menampilkan

“Error

1. Data Password

belum di isi !”.

Sesuai

Harapan

Valid

3. Username

tidak di isi

(kosong)

dan

Password

Username:

(kosong)

Password :

admin

Sistem akan

menolak akses user

dan menampilkan

“Error

1. Data Username

Sesuai

Harapan

Valid

Page 51: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

84

di isi

kemudian

klik tombol

Login.

belum di isi !”.

4. Username

di isi

dengan data

yang benar

dan

Password

di isi

dengan data

yang salah

kemudian

klik tombol

Login.

Username:

Susi2018

(benar)

Password:

1234 (salah)

Sistem akan

menolak akses user

dan menampilkan

“Username atau

Password Anda

Salah”.

Sesuai

Harapan

Valid

5. Username

di isi

dengan data

yang benar

dan

Password

di isi

dengan data

yang benar

kemudian

klik tombol

Login.

Username:

Susi2018

(benar)

Password:

admin(benar)

Sistem menerima

akses login dan

menampilkan

“Anda Berhasil

Login Sebagai

Admin”.

Sesuai

Harapan

Valid

Page 52: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

85

2. Pengujian Terhadap Form Login Pelanggan

Tabel III. 14.

Hasil Pengujian Black Box Testing Halaman Login Pelanggan

No Skenario

Pengujian

Test Case Hasil yang

diharapkan

Hasil

Pengujian

Kesimpulan

1.

Username

dan

Password

tidak di isi

kemudian

klik tombol

Login.

Username:

(kosong)

Password :

(kosong)

Sistem akan

menolak akses

user dan

menampilkan

“Error

MAAF, ANDA

GAGAL LOGIN !

Kesalahan Input :

1. Data Username

belum di isi !

2. Data Password

belum di isi !

3. Data Username

dan Password

Yang Anda

masukan belum

benar !”.

Sesuai

Harapan

Valid

2. Username di

isi dan

Password

tidak di isi

(kosong)

kemudian

klik tombol

Login.

Username:

caca

Password :

(kosong)

Sistem akan

menolak akses

user dan

menampilkan

“Error

MAAF, ANDA

GAGAL LOGIN !

Kesalahan Input :

1. Data Password

belum di isi !

Sesuai

Harapan

Valid

Page 53: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

86

2. Data Username

dan Password

Yang Anda

masukan belum

benar !”.

3. Username

tidak di isi

(kosong) dan

Password di

isi kemudian

klik tombol

Login.

Username:

(kosong)

Password :

123

Sistem akan

menolak akses

user dan

menampilkan

“Error

MAAF, ANDA

GAGAL LOGIN !

Kesalahan Input :

1. Data Username

belum di isi !

2. Data Username

dan Password

Yang Anda

masukan belum

benar !”.

Sesuai

Harapan

Valid

4. Username di

isi dengan

data yang

benar dan

Password di

isi dengan

data yang

salah

kemudian

klik tombol

Login.

Username:

caca (benar)

Password:

1234 (salah)

Sistem akan

menolak akses

user dan

menampilkan

“Error

MAAF, ANDA

GAGAL LOGIN !

Kesalahan Input :

1. Data Username

dan Password

Yang Anda

masukan belum

benar !”.

Sesuai

Harapan

Valid

5. Username di

isi dengan

data yang

benar dan

Username:

caca (benar)

Password:

Sistem menerima

akses login dan

menampilkan

“Anda Berhasil

Sesuai

Harapan

Valid

Page 54: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

87

Password di

isi dengan

data yang

benar

kemudian

klik tombol

Login.

123 (benar) Login Sebagai

Pelanggan”.

3. Pengujian Terhadap Form Pendaftaran Baru

Tabel III. 15.

Hasil Pengujian Black Box Testing Halaman Pendaftaran Baru

No Skenario

Pengujian

Test Case Hasil yang

diharapkan

Hasil

Pengujian

Kesimpulan

1. Nama

Pelanggan,

Jenis

Kelamin,

Email,

No.

Telepon,

Username,

Password,

Password

(lagi) tidak

di isi

kemudian

klik tombol

Daftar.

Nama

Pelanggan:

(kosong)

Jenis Kelamin:

(kosong)

Email: (kosong)

No. Telepon:

(kosong)

Username:

(kosong)

Password:

(kosong)

Password (lagi):

(kosong)

Sistem akan

menolak akses

pendaftaran

pelanggan dan

menampilkan

“Error

1. Data Nama

Pelanggan

belum di isi !

2. Data Jenis

Kelamin belum

di pilih !

3. Data Alamat

Email belum di

isi !

4. Data No.

Telepon belum

di isi !

5. Data No.

Sesuai

Harapan

Valid

Page 55: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

88

Telepon harus di

isi dengan angka

!

6. Data

Username belum

di isi !

7. Data

Password belum

di isi !

8. Data

Password (lagi)

belum di isi !”.

2. Mengisi

semua form

pendaftaran,

data

Password

dan data

Password

(lagi) di isi

dengan data

yang tidak

sama

kemudian

klik tombol

Daftar.

Nama

Pelanggan:

Susi2018

Jenis Kelamin:

Perempuan

Email:

Susi2018@gmail

.com

No. Telepon:

087779233800

Username:

Susi2018

Password: 2018

Password (lagi):

1234

Sistem akan

menolak akses

pendaftaran

pelanggan dan

menampilkan

“Error

1. Data

Password Ke 2

tidak sama

dengan

konfirmasi data

password

pertama !”.

Sesuai

Harapan

Valid

3. Mengisi

semua form

pendaftaran

tetapi data

no. telepon

di isi

dengan

huruf

Nama

Pelanggan:

Susi2018

Jenis Kelamin:

Perempuan

Email:

Sistem akan

menolak akses

pendaftaran

pelanggan dan

menampilkan

“Error

1. Data No.

Sesuai

Harapan

Valid

Page 56: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

89

kemudian

klik tombol

Daftar.

Susi2018@gmail

.com

No. Telepon: test

(salah)

Username:

Susi2018

Password: 1993

Password (lagi):

1993

Telepon harus

di isi dengan

angka !”.

4. Mengisi

semua form

pendaftaran

kemudian

klik tombol

Daftar.

Nama

Pelanggan:

Susi2018

Jenis Kelamin:

Perempuan

Email:

Susi2018@gmail

.com

No. Telepon:

087779233800

Username:

Susi2018

Password: 1993

Password (lagi):

1993

Sistem akan

menyimpan data

pelanggan dan

menampilkan

“Anda Berhasil

Mendaftar

Sebagai

Pelanggan,

Silahkan Login

!”.

Sesuai

Harapan

Valid

Page 57: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

90

4. Pengujian Terhadap Halaman Cari Barang

Tabel III. 16.

Hasil Pengujian Black Box Testing Halaman Cari Barang

No Skenario

Pengujian

Test Case Hasil yang

diharapkan

Hasil

Pengujian

Kesimpulan

1. Cari Barang

dengan nama

barang yang

tidak ada di

dalam website.

Cari :

xxx

Sistem

menampilkan

“HASIL

PENCARIAN

“xxx” ”, dan

data barang

tidak keluar

(kosong).

Sesuai

Harapan

Valid

2. Cari Barang

tidak di isi

(kosong).

Cari :

(kosong)

Sistem

menampilkan

“HASIL

PENCARIAN

“ ” ”, dan data

yang keluar

adalah data

barang yang ada

di halaman

menu barang.

Sesuai

Harapan

Valid

3. Cari Barang

dengan nama

barang yang

ada di dalam

website.

Cari :

Canon

Sistem akan

menampilkan

“HASIL

PENCARIAN

“canon” ”, dan

data barang akan

keluar.

Sesuai

Harapan

Valid

5. Pengujian Terhadap Halaman Keranjang Belanja

Tabel III. 17.

Page 58: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

91

Hasil Pengujian Black Box Testing Halaman Keranjang Belanja

No Skenario

Pengujian

Test Case Hasil yang

diharapkan

Hasil

Pengujian

Kesimpulan

1. Jika pelanggan

ingin

mengubah

jumlah barang

menjadi 0 lalu

klik tombol

Update

Jumlah.

Jumlah : 0 Maka sistem tidak

akan mengubah

jumlah barang

menjadi 0 tetapi

jumlah barang

akan tetap

menjadi 1 dan

menampilkan

“Jumlah Barang

Berhasil Di

Ubah”.

Sesuai

Harapan

Valid

2. Jika pelanggan

ingin

mengosongkan

jumlah barang

lalu klik

tombol Update

Jumlah.

Jumlah:

(kosong)

Maka sistem tidak

akan mengubah

jumlah barang,

tetapi jumlah

barang akan tetap

menjadi 1 dan

menampilkan

“Jumlah Barang

Berhasil Di

Ubah”.

Sesuai

Harapan

Valid

3. Jika pelanggan

mengisi jumlah

barang dengan

huruf lalu klik

tombol Update

Jumlah.

Jumlah:

aaa

Maka sistem tidak

akan mengubah

jumlah barang,

tetapi jumlah

barang akan tetap

menjadi 1 dan

menampilkan

“Jumlah Barang

Berhasil Di

Ubah”.

Sesuai

Harapan

Valid

4. Jika pelanggan

ingin

mengubah

Jumlah : 2 Maka sistem akan

mengubah jumlah

barang menjadi 2

Sesuai

Harapan

Valid

Page 59: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

92

jumlah barang

menjadi 2 lalu

klik tombol

Update

Jumlah.

dan menampilkan

“Jumlah Barang

Berhasil Di

Ubah”.

6. Pengujian Terhadap Form Alamat Pengiriman

Tabel III. 18.

Hasil Pengujian Black Box Testing Halaman Form Alamat Pengiriman

No Skenario

Pengujian

Test Case Hasil yang

diharapkan

Hasil

Pengujian

Kesimpulan

1. Nama

Penerima,

Alamat

Tujuan,

Provinsi

Tujuan, Kota

Tujuan,

Kode Pos,

No. Telepon

tidak di isi

kemudian klik

tombol

Simpan

Alamat

Pengiriman.

Nama

Penerima:

(kosong)

Alamat

Tujuan:

(kosong)

Provinsi

Tujuan:

(kosong)

Kota Tujuan:

(kosong)

Kode Pos:

(kosong)

No. Telepon:

(kosong)

Sistem akan

menolak akses

form alamat

pengiriman dan

menampilkan

“Error

1. Data Nama

Penerima belum

di isi !

2. Data Alamat

Tujuan belum di

isi !

3. Data Provinsi

Tujuan belum di

pilih !

4. Data Kota

Tujuan belum di

isi !

5. Data Kode

Pos belum di isi

!

Sesuai

Harapan

Valid

Page 60: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

93

6. Data Kode

Pos harus di isi

dengan angka !

7. Data No.

Telepon belum

di isi !

8. Data No.

Telepon harus di

isi dengan angka

!”.

2. Mengisi salah

satu kolom

saja dan data

kolom lain di

kosongkan

kemudian klik

tombol

Simpan

Alamat

Pengiriman.

Nama

Penerima:

Susi2018

Alamat

Tujuan:

(kosong)

Provinsi

Tujuan:

(kosong)

KotaTujuan:

(kosong)

Kode Pos:

(kosong)

No. Telepon:

(kosong)

Sistem akan

menolak akses

form alamat

pengiriman dan

menampilkan

“Error

1. Data Alamat

Tujuan belum di

isi !

2. Data Provinsi

Tujuan belum di

pilih !

3. Data Kota

Tujuan belum di

isi !

4. Data Kode

Pos belum di isi

!

5. Data Kode

Pos harus di isi

dengan angka !

6. Data No.

Telepon belum

di isi !

7. Data No.

Sesuai

Harapan

Valid

Page 61: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

94

Telepon harus di

isi dengan angka

!”.

3. Mengisi

semua form

Alamat

Pengiriman

tetapi data

kode pos dan

no. telepon di

isi dengan

huruf

kemudian klik

tombol

Simpan

Alamat

Pengiriman.

Nama

penerima:

Susi2018

Alamat tujuan:

Banten

Provinsi

tujuan: Banten

Kota tujuan:

Serpong

Kode pos: test

(salah)

No telepon:

test (salah)

Sistem akan

menolak akses

form alamat

pengiriman dan

menampilkan

“Error

1. Data Kode

Pos harus di isi

dengan angka !

2. Data No.

Telepon harus di

isi dengan angka

!”.

Sesuai

Harapan

Valid

4. Mengisi

semua form

Alamat

Pengiriman

kemudian klik

tombol

Simpan

Alamat

Pengiriman.

Nama

penerima:

Susi2018

Alamat tujuan:

Banten

Provinsi

tujuan: Banten

Kota tujuan:

Serpong

Kode pos:

41316

No telepon:

087779233880

Sistem akan

menyimpan data

alamat

pengiriman dan

menampilkan

“Anda Berhasil

Menyimpan

Data !”.

Sesuai

Harapan

Valid

Page 62: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

95

7. Pengujian Terhadap Form Buku Tamu

Tabel III. 19.

Hasil Pengujian Black Box Testing Halaman Form Buku Tamu

No Skenario

Pengujian

Test Case Hasil yang

diharapkan

Hasil

Pengujian

Kesimpulan

1. Nama,

Email,

Pesan tidak

di isi

kemudian

klik tombol

Kirim.

Nama: (kosong)

Email: (kosong)

Pesan: (kosong)

Sistem akan

menolak akses

form buku tamu

dan menampilkan

“Error

1. Data Nama

belum di isi !

2. Data Alamat

Email belum di

isi !

3. Data Pesan

belum di isi !”.

Sesuai

Harapan

Valid

2. Mengisi

salah satu

kolom saja

dan data

kolom lain

dikosongkan

kemudian

klik tombol

Kirim.

Nama: Susi2018

Email: (kosong)

Pesan: (kosong)

Sistem akan

menolak akses

form buku tamu

dan menampilkan

“Error

1. Data Alamat

Email belum di

isi !

2. Data Pesan

belum di isi !”.

Sesuai

Harapan

Valid

3. Nama,

email, Pesan

di isi

kemudian

klik tombol

Nama:

Susi2018

Email: Susi2018

Sistem akan

menyimpan data

buku tamu dan

menampilkan

“Pesan Sudah

Sesuai

Harapan

Valid

Page 63: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

96

Kirim. @gmail.com

Pesan: Test

Dikirim”.

8. Pengujian Terhadap Form Testimonial

Tabel III. 20.

Hasil Pengujian Black Box Testing Halaman Form Testimonial

No Skenario

Pengujian

Test Case Hasil yang

diharapkan

Hasil

Pengujian

Kesimpulan

1. Nama,

Email,

Komentar

tidak di isi

kemudian

klik tombol

Kirim

Komentar

Nama: (kosong)

Email: (kosong)

Komentar:

(kosong)

Sistem akan

menolak akses

form testimonial

dan

menampilkan

“Error

1. Data Nama

belum di isi !

2. Data Alamat

Email belum di

isi !

3. Data

Komentar belum

di isi !”.

Sesuai

Harapan

Valid

2. Mengisi

salah satu

kolom saja

dan data

kolom lain

dikosongkan

kemudian

klik tombol

Kirim

Komentar

Nama: Susi2018

Email: (kosong)

Komentar:

(kosong)

Sistem akan

menolak akses

form testimonial

dan

menampilkan

“Error

1. Data Alamat

Email belum di

isi !

2. Data

Sesuai

Harapan

Valid

Page 64: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

97

Komentar belum

di isi !”.

3. Nama, email,

komentar di

isi kemudian

klik tombol

Kirim

Komentar

Nama:

Susi2018

Email: Susi2018

@gmail.com

Komentar:

Belanja di Batik

10s sangat

memuaskan

Sistem akan

menyimpan data

ke dalam menu

lihat testimonial

dan

menampilkan

“Komentar

Sudah Dikirim”.

Sesuai

Harapan

Valid

9. Pengujian Terhadap Form Konfirmasi Pembayaran

Tabel III. 21.

Hasil Pengujian Black Box Testing Halaman Form Konfirmasi

Pembayaran

No Skenario

Pengujian

Test Case Hasil yang

diharapkan

Hasil

Pengujian

Kesimpulan

1. No.

Pemesanan,

Nama

Pelanggan,

Nama

Rekening,

No.

Rekening,

Jumlah

Transfer,

Keterangan

tidak di isi

kemudian

klik tombol

No.

Pemesanan:

(kosong)

Nama

Pelanggan:

(kosong)

Nama

Rekening:

(kosong)

No. Rekening:

(kosong)

Jumlah

Sistem akan

menolak akses

form konfirmasi

pembayaran dan

menampilkan

“Error

1. Data No.

Pemesanan belum

di isi, isi sesuai

dengan No.

Pemesanan Anda !

2. Data Nama

Pelanggan belum

Sesuai

Harapan

Valid

Page 65: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

98

Kirim

Konfirmasi

Pembayaran.

Transfer:

(kosong)

Keterangan:

(kosong)

di isi !

3. Data Nama

Rekening belum di

isi !

4. Data No

Rekening belum di

isi !

5. Data No

Rekening harus di

isi dengan angka !

6. Data Jumlah

Transfer belum di

isi !

7. Data Jumlah

Transfer harus di

isi dengan angka !

8. Data

Keterangan belum

di isi !”.

2. Mengisi

salah satu

kolom saja

dan data

kolom lain

dikosongkan

kemudian

klik tombol

Kirim

Konfirmasi

Pembayaran.

No.

Pemesanan:

PS0001

Nama

Pelanggan:

(kosong)

Nama

Rekening:

(kosong)

No. Rekening:

(kosong)

Jumlah

Transfer:

(kosong)

Keterangan:

Sistem akan

menolak akses

form konfirmasi

pembayaran dan

menampilkan

“Error

1. Data Nama

Pelanggan belum

di isi !

2. Data Nama

Rekening belum di

isi !

3. Data No

Rekening belum di

isi !

4. Data No

Sesuai

Harapan

Valid

Page 66: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

99

(kosong) Rekening harus di

isi dengan angka !

5. Data Jumlah

Transfer belum di

isi !

6. Data Jumlah

Transfer harus di

isi dengan angka !

7. Data

Keterangan belum

di isi !”.

3. Mengisi

semua form

konfirmasi

pembayaran,

tetapi data

no rekening

dan jumlah

transfer di

isi dengan

huruf

kemudian

klik tombol

Kirim

Konfirmasi

Pembayaran.

No

pemesanan:

PS000001

Nama

Pelanggan:

Susi2018

Nama

rekening:

Susi2018

No rekening:

test (salah)

Jumlah

transfer: test

(salah)

Keterangan:

Sudah di

transfer ya.

Sistem akan

menolak akses

form konfirmasi

pembayaran dan

menampilkan

“Error

1. Data No

Rekening harus di

isi dengan angka !

2. Data Jumlah

Transfer harus di

isi dengan angka

!”.

Sesuai

Harapan

Valid

4. No.

Pemesanan,

Nama

Pelanggan,

Nama

Rekening,

No

pemesanan:

PS000001

Nama

Pelanggan:

Susi2018

Sistem akan

menyimpan data

Konfirmasi

Pembayaran dan

menampilkan

“Data Konfirmasi

Pembayaran

Sesuai

Harapan

Valid

Page 67: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

100

No.

Rekening,

Jumlah

Transfer,

Keterangan

di isi

kemudian

klik tombol

Kirim

Konfirmasi

Pembayaran.

Nama

rekening:

Susi2018

No rekening:

1090979317

Jumlah

transfer:

2000000

Keterangan:

Sudah di

transfer ya.

Sudah Dikirim”.

10. Pengujian Terhadap Ubah Password Admin

Tabel III. 22.

Hasil Pengujian Black Box Testing Halaman Ubah Password Admin

No Skenario

Pengujian

Test Case Hasil yang

diharapkan

Hasil

Pengujian

Kesimpulan

1. Password

Lama dan

Password

Baru tidak di

isi kemudian

klik tombol

Ubah

Password.

Password

Lama:

(kosong)

Password

Baru:

(kosong)

Sistem akan

menolak akses

ubah password

dan menampilkan

“Error

1. Data Password

Lama belum di

isi !

2. Data Password

Baru belum di

isi !

Sesuai

Harapan

Valid

Page 68: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

101

3. Maaf, Password

Anda Salah

silahkan ulangi

lagi !”.

2. Password

Lama di isi

dengan data

yang salah dan

Password

Baru di isi

kemudian klik

tombol Ubah

Password.

Password

Lama:

admin

(salah)

Password

Baru: user

Sistem akan

menolak akses

ubah password

dan menampilkan

“Error

1. Maaf, Password

Anda Salah

silahkan ulangi

lagi !”.

Sesuai

Harapan

Valid

3. Password

Lama di isi

dengan data

yang benar

dan Password

Baru di isi

kemudian klik

tombol Ubah

Password.

Password

Lama:

admin

(benar)

Password

Baru: user

Sistem akan

menyimpan data

dan menampilkan

“Password Anda

Berhasil Di

Ubah”.

Sesuai

Harapan

Valid

11. Pengujian Terhadap Form Input Data Admin

Tabel III. 23.

Hasil Pengujian Black Box Testing Halaman Input Data Admin

No Skenario

Pengujian

Test Case Hasil yang

diharapkan

Hasil

Pengujian

Kesimpulan

1. Username dan

Password tidak

di isi kemudian

klik tombol

Simpan Data

Username:

(Kosong)

Password:

(kosong)

Sistem akan

menolak akses

input data admin

dan menampilkan

“Error

Sesuai

Harapan

Valid

Page 69: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

102

Admin. 1. Data Username

belum di isi !

2. Data Password

belum di isi !”.

2. Username di isi

dengan data

username yang

sudah ada,

kemudian klik

tombol Simpan

Data Admin

Username:

Susi2018

(username

yang sudah

ada)

Password:

admin

Sistem akan

menolak akses

input data admin

dan menampilkan

“Maaf, username

Susi2018 sudah

ada, ganti dengan

nama yang

berbeda !”.

Sesuai

Harapan

Valid

3. Username di isi

dan Password

tidak di isi

(kosong)

kemudian klik

tombol Simpan

Data Admin.

Username:

(Susi2018)

Password:

(kosong)

Sistem akan

menolak akses

input data admin

dan menampilkan

“Error

1. Data Password

belum di isi !”.

Sesuai

Harapan

Valid

4. Username dan

Password di isi

kemudian klik

tombol Simpan

Data Admin.

Username:

Susi2018

Password:

12345

Sistem akan

menyimpan data

admin dan

menampilkan

“Data Admin

Berhasil Di

Simpan”.

Sesuai

Harapan

Valid

12. Pengujian Terhadap Form Input Data Provinsi

Page 70: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

103

Tabel III. 24.

Hasil Pengujian Black Box Testing Halaman Input Data Provinsi

No Skenario

Pengujian

Test Case Hasil yang

diharapkan

Hasil

Pengujian

Kesimpulan

1. Nama Provinsi

dan Biaya

Kirim tidak di

isi kemudian

klik tombol

Simpan Data

Provinsi.

Nama

Provinsi:

(kosong)

Biaya

Kirim:

(kosong)

Sistem akan menolak

akses input data

provinsi dan

menampilkan “Error

1. Data Nama

Provinsi belum di isi

!

2. Data Biaya Kirim

belum di isi !

3. Data Biaya Kirim

harus di isi dengan

angka !”.

Sesuai

Harapan

Valid

2. Nama Provinsi

di isi dengan

data nama

provinsi yang

sudah ada,

kemudian klik

tombol

Simpan Data

Provinsi.

Nama

Provinsi:

Jawa

Barat

(nama

provinsi

yang

sudah ada)

Biaya

Kirim:

Rp. 40000

Sistem akan menolak

akses input data

provinsi dan

menampilkan “Error

1. Maaf, provinsi

jawa barat sudah ada,

ganti dengan nama

yang berbeda !”.

Sesuai

Harapan

Valid

3. Nama Provinsi

di isi dan

Biaya Kirim di

isi dengan

huruf

kemudian klik

tombol

Nama

Provinsi:

Jawa

Barat

Biaya

Kirim: test

Sistem akan menolak

akses input data

provinsi dan

menampilkan “Error

1. Data Biaya Kirim

harus di isi dengan

Sesuai

Harapan

Valid

Page 71: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

104

Simpan Data

Provinsi.

(salah) angka !”.

4. Nama Provinsi

dan Biaya

Kirim di isi

kemudian klik

tombol

Simpan Data

Provinsi.

Nama

Provinsi:

Jawa

Barat

Biaya

Kirim:

30000

Sistem akan

menyimpan data

provinsi dan

menampilkan “Data

Provinsi Berhasil Di

Simpan”.

Sesuai

Harapan

Valid

13. Pengujian Terhadap Form Input Data Kategori

Tabel III. 25.

Hasil Pengujian Black Box Testing Halaman Input Data Kategori

No Skenario

Pengujian

Test Case Hasil yang

diharapkan

Hasil

Pengujian

Kesimpulan

1. Nama Kategori

tidak di isi

kemudian klik

tombol Simpan

Data Kategori.

Nama

Kategori:

(kosong)

Sistem akan

menolak akses

input data

kategori dan

menampilkan

“Error

1. Data Nama

Kategori belum

di isi !”.

Sesuai

Harapan

Valid

2. Nama Kategori

di isi dengan

data nama

kategori yang

sudah ada,

kemudian klik

tombol Simpan

Data Kategori.

Nama

Kategori:

Baju

(nama

kategori

yang

sudah ada)

Sistem akan

menolak akses

input data

kategori dan

menampilkan

“Maaf, kategori

mouse sudah

ada, ganti

dengan nama

Sesuai

Harapan

Valid

Page 72: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

105

yang berbeda !”.

3. Nama Kategori

di isi kemudian

klik tombol

Simpan Data

Kategori.

Nama

Kategori:

Baju

Sistem akan

menyimpan data

kategori dan

menampilkan

“Data Kategori

Berhasil Di

Simpan”.

Sesuai

Harapan

Valid

14. Pengujian Terhadap Form Input Data Barang

Tabel III. 26.

Hasil Pengujian Black Box Testing Halaman Input Data Barang

No Skenario

Pengujian

Test Case Hasil yang

diharapkan

Hasil

Pengujian

Kesimpulan

1. Nama Barang,

Harga Modal,

Harga Jual,

Stok, File

Gambar,

Keterangan,

Kategori

tidak di isi

kemudian klik

tombol Simpan

Data Barang.

Nama

Barang:

(kosong)

Harga Modal:

(kosong)

Harga Jual:

(kosong)

Stok:

(kosong)

File Gambar:

(kosong)

Keterangan:

(kosong)

Kategori:

(kosong)

Sistem akan

menolak akses

input data

barang dan

menampilkan

“Error

1. Data Nama

Barang belum di

isi !

2. Data Harga

Modal belum di

isi !

3. Data Harga

Modal harus di

isi dengan angka

!

4. Data Harga

Jual belum di isi

Sesuai

Harapan

Valid

Page 73: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

106

!

5. Data Harga

Jual harus di isi

dengan angka !

6. Data Stok

belum di pilih !

7. Data File

Gambar belum

di isi !

8. Data

Keterangan

belum di isi !

9. Data Kategori

belum di pilih

!”.

2. Mengisi salah

satu kolom saja

dan data kolom

lain dikosongkan

kemudian klik

tombol Simpan

Data Barang.

Nama

Barang:

Sandal 002

Harga Modal:

(kosong)

Harga Jual:

(kosong)

Stok:

(kosong)

File Gambar:

(kosong)

Keterangan:

(kosong)

Kategori:

(kosong)

Sistem akan

menolak akses

input data

barang dan

menampilkan

“Error

1. Data Harga

Modal belum di

isi !

2. Data Harga

Modal harus di

isi dengan angka

!

3. Data Harga

Jual belum di isi

!

4. Data Harga

Jual harus di isi

Sesuai

Harapan

Valid

Page 74: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

107

dengan angka !

5. Data Stok

belum di pilih !

6. Data File

Gambar belum

di isi !

7. Data

Keterangan

belum di isi !

8. Data Kategori

belum di pilih

!”.

3. Mengisi semua

form input

barang tetapi

data harga

modal dan harga

jual di isi dengan

huruf kemudian

klik tombol

Simpan Data

Barang.

Nama

Barang:

Sepatu 001

Harga Modal:

test (salah)

Harga Jual:

test (salah)

Stok: Ready

Stok

File Gambar:

(di isi)

Keterangan:

Fungsi print

scan dan

copy

Kategori:

Sepatu

Sistem akan

menolak akses

input data

barang dan

menampilkan

“Error

1. Data Harga

Modal harus di

isi dengan angka

!

2. Data Harga

Jual harus di isi

dengan angka

!”.

Sesuai

Harapan

Valid

4. Nama Barang,

Harga Modal,

Harga Jual,

Stok, File

Gambar,

Keterangan,

Kategori di isi

kemudian klik

Nama

Barang:

Sandal

Harga Modal:

200.000

Harga Jual:

250.000

Stok: Ready

Sistem akan

menyimpan data

barang dan

menampilkan

“Data Barang

Berhasil Di

Simpan”.

Sesuai

Harapan

Valid

Page 75: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

108

tombol Simpan

Data Barang.

Stok

File Gambar:

(di isi)

Keterangan:

Fungsi print

scan dan

copy

Kategori:

Sepatu

4.5. Support

Menurut Sukamto dan Salahuddin (2013:30) “tahap pendukung adalah

tahapan yang dapat mengulangi proses pengembangan mulai dari analisis

spesifikasi untuk perubahan perangkat lunak yang sudah ada, tapi tidak untuk

membuat perangkat lunak baru”. Untuk support yang ada di toko Batik 10s yaitu :

4.5.1. Publikasi Web

Setelah website yang dibuat telah selesai, tahap selanjutnya adalah

mendapatkan hosting dan domain pada tempat-tempat yang menyediakan jasa

tersebut. Namun pada penulisan skripsi ini, penulis menggunakan publikasi web

pada web hosting yang menyediakan jasa pubilkasi web secara bayar, misalnya

saja pada http://www.dewaweb.com.

Setelah mendapatkan hosting dan domain yang sesuai yaitu

http://www.batik10Sbae.com. Tahap selanjutnya adalah proses upload database

dan file ke server hosting. Setelah mendapatkan hosting, domain, melakukan

proses upload database dan file situs, tahap yang terakhir adalah melihat situs

Page 76: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

109

yang telah dibuat secara online. Pada saat mengakses website bisa dengan

menggunakan browser yang telah banyak tersedia seperti google chrome, mozilla

firefox, internet explorer, nestcape dan lain sebagainya.

4.5.2. Spesifikasi Hardware dan Software

Tabel IV.27

Tabel Spesifikasi Hardware dan Software

Kebutuhan Keterangan

Sistem Operasi Windows 7 dan sesudahnya

Processor Pentium Core 2 Duo, 2.4 Ghz

RAM 1 GB

Harddisk 160 GB

CD-ROM 52x

Monitor SVGA 14”

Keyboard 108 Keys

Prnter Laser Jet

Mouse Standarad

Browser Mozilla Firefox,Google Chrome,Internet Explorer

Software Dreamweaver,Photoshop,PHP MyAdmin

4.6. Spesifikasi Dokumen Sistem Usulan

Spesifikasi sistem usulan adalah rangkaian dari proses-proses yang terjadi

dalam sistem usulan yang memerlukan dokumen masukan untuk mendukung

jalannya proses dokumen keluaran. Adapun spesifikasi sistem penjualan pada

Toko Batik 10s adalah :

Page 77: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

110

4.6.1. Spesifikasi Bentuk Dokumen Masukan Sistem Usulan

Berikut adalah spesifikasi bentuk dokumen masukan sistem usulan yang

ada di Toko Batik 10s :

1. Nama Dokumen : Form Pengiriman

Fungsi : Sebagai data pengiriman untuk admin

Sumber : Member

Tujuan : Admin

Media : Monitor

Frekuensi : Setiap terjadi pengiriman barang

Format : Lampiran C1

2. Nama Dokumen : Form Konfirmasi Transaksi

Fungsi : Sebagai data transaksi untuk member dan admin

Sumber : Member

Tujuan : Admin

Media : Monitor

Frekuensi : Setiap terjadi transaksi

Format : Lampiran C2

3. Nama Dokumen : Form Testimonial

Fungsi : Sebagai pusat interaksi antara member dan admin

Sumber : Member

Tujuan : Admin

Media : Monitor

Frekuensi : Setiap ingin mengajukan kritikan atau saran

Format : Lampiran C3

Page 78: BAB IV RANCANGAN SISTEM DAN PROGRAM USULAN · 37 Deskripsi Use Case Diagram Penjualan Online Halaman User.Member Tabel IV.1 Deskripsi Use Case Diagram Penjualan Online Halaman User

111

4.6.2. Spesifikasi Bentuk Dokumen Keluaran Sistem Usulan

Berikut adalah spesifikasi bentuk dokumen keluaran sistem usulan yang

ada di Toko Batik 10s :

1. Nama Dokumen : Bukti Pemesanan

Fungsi : Sebagai bukti transaksi penjualan

Sumber : Admin

Tujuan : Member

Media : Cetak Komputer

Frekuensi : Setiap ada transaksi pembayaran

Format : Lampiran C4

2. Nama Dokumen : Laporan Penjualan

Fungsi : Sebagai laporan penjualan harian atau bulanan

Sumber : Admin

Tujuan : Owner

Media : Cetakan Komputer

Frekuensi : Setiap membuat laporan harian atau bulanan

Format : Lampiran C5