bab iv rancangan sistem dan program usulan · 41 a11. admin dapat mengelola halaman ongkos kirim....
TRANSCRIPT
40
BAB IV
RANCANGAN SISTEM DAN PROGRAM USULAN
4.1 Analisa Kebutuhan Software
4.1.1 Tahapan Analisis
Penjualan Online atau E-Commerce adalah sistem penjualan yang
berbasiskan web dengan menggunakan media internet. Sistem ini memberikan
kemudahan bagi pelaku bisnis maupun konsumen. Cara kerja sistem ini
menggunakan database sebagai media untuk menyimpan segala data produk,
transaksi penjualan maupun laporan penjualan. Spesifikasi kebutuhan (system
requirement) dari sistem e-commerce jamu instan tradisional kelompok usaha Jati
Husada Mulya adalah sebagai berikut:
Halaman Administrator:
A1. Admin dapat masuk ke ruang administrator dengan melakukan login.
A2. Admin dapat mengelola halaman data pengguna (users).
A3. Admin dapat mengelola halaman account pribadi.
A4. Admin dapat mengelola laporan-laporan.
A5. Admin dapat mengelola halaman konten produk.
A6. Admin dapat mengelola halaman konten event.
A7. Admin dapat mengelola halaman konten page (profil, info lokasi, cara
pemesanan, cara pembayaran, media promosi, kontak kami, transfer bank)
A8. Admin dapat mengelola stok produk.
A9. Admin dapat mengelola halaman buku tamu.
A10. Admin dapat mengelola halaman konfirmasi pembayaran.
41
A11. Admin dapat mengelola halaman ongkos kirim.
Halaman User:
B1. User dapat melakukan pencarian produk atau info seputar website Jati Husada
Mulya.
B2. User dapat mengirimkan komentar, saran, atau kritik pada halaman buku
tamu.
B3. User dapat melakukan registrasi sebagai member.
Halaman Member:
C1. Member dapat melakukan login dengan akun yang sudah dibuat saat
registrasi.
C2. Member dapat mengelola akun pribadi.
C3. Member dapat melihat laporan belanja serta status transaksi pembelian.
C4. Member dapat mengirimkan komentar, saran, atau kritik pada halaman buku
tamu.
C5. Member dapat melakukan konfirmasi pembayaran.
C6. Member dapat mengelola keranjang belanja, seperti menambah produk yang
dibeli.
C7. Member dapat melakukan check out pembelian.
C8. Member dapat mencetak struk pembayaran.
42
4.1.2 Use Case Diagram
a. Use Case Diagram Halaman User
Sumber: Hasil Olahan Penulis
Gambar IV.1
Use Case Diagram Halaman User
Tabel IV.1
Deskripsi Use Case Diagram Halaman User
Use Case Name Kunjungan Online
Requirements B1 - B3
Goal User dapat menjadi member dengan
melakukan registrasi member
Pre-Condition User masuk menuju halaman registrasi
member
Post-Condition User memiliki akun sebagai member
Failed End Condition User dapat membatakan registrasi member
Primary Actors User
Main Flow / Basic Path
1. User dapat melihat detail semua produk.
2. User dapat melakukan registrasi sebagai
member.
3. User dapat meninggalkan jejak komentar
pada buku tamu.
Invariant -
43
b. Use Case Diagram Halaman Member
Sumber: Hasil Olahan Penulis
Gambar IV.2
Use Case Diagram Halaman Member
Tabel IV.2
Deskripsi Use Case Diagram Halaman Member
Use Case Name Belanja Online
Requirements C1 – C8
Goal Member dapat melakukan transaksi /
membeli produk melalui website
Pre-Condition Member melakukan login terlebih dahulu
Post-Condition Member dapat membeli produk secara online
Failed End Condition Member dapat membatalkan transaksi
Primary Actors Member
Main Flow / Basic Path
1. Member dapat update data diri.
2. Member dapat melihat laporan belanja
serta status pesanan.
3. Member dapat memilih produk dan
menambahkan ke keranjang belanja.
4. Member dapat melakukan check out.
5. Member dapat mengisi data pengiriman.
44
6. Member dapat mencetak struk pesanan.
7. Member dapat mengisi buku tamu.
8. Member dapat melakukan konfirmasi
pembayaran.
Invariant -
c. Use Case Diagram Halaman Admin
Sumber: Hasil Olahan Penulis
Gambar IV.3
Use Case Diagram Halaman Admin
45
1) Deskripsi Use Case Admin Mengelola Data Pengguna.
Tabel IV.3
Deskripsi Use Case Admin Mengelola Data Pengguna
Use Case Name Mengelola Data Pengguna
Requirements A2
Goal Admin dapat menambah dan menghapus
data pengguna (users)
Pre-Condition Admin berhasil login dan masuk ke
halaman administrator
Post-Condition Data pengguna tersimpan, terhapus
Failed End Condition Gagal menyimpan karena ada data yang
kurang, atau menghapus
Primary Actors Admin
Main Flow / Basic Path
1. Admin melihat data pengguna.
2. Admin menambah data pengguna.
3. Admin menyimpan data pengguna.
Alternate Flow / Invariant 1 Admin menghapus data pengguna
Invariant 2 -
2) Deskripsi Use Case Admin Mengelola Akun Pribadi.
Tabel IV.4
Deskripsi Use Case Admin Mengelola Akun Pribadi
Use Case Name Mengelola Akun Pribadi
Requirements A3
Goal Admin dapat mengubah (edit) akun
Pre-Condition Admin berhasil login dan masuk ke
halaman administrator
Post-Condition Data akun terupdate
Failed End Condition Gagal mengupdate karena ada data yang
kurang
Primary Actors Admin
Main Flow / Basic Path Admin menyimpan data akun.
Alternate Flow / Invariant 1 2a. Admin mengedit data akun pribadi
Invariant 2 -
46
3) Deskripsi Use Case Admin Mengelola Data Laporan Penjualan.
Tabel IV.5
Deskripsi Use Case Admin Mengelola Laporan Penjualan
Use Case Name Mengelola Data Laporan Penjualan
Requirements A4
Goal Admin dapat mengubah, melihat detail
status pesanan
Pre-Condition Admin berhasil login dan masuk ke
halaman administrator
Post-Condition Data pesanan tersimpan, melihat detail
status pesanan
Failed End Condition Gagal menyimpan karena ada data yang
kurang, data detail pesanan masih kosong
Primary Actors Admin
Main Flow / Basic Path 1. Admin melihat detail pesanan.
2. Admin menyimpan data status pesanan.
Alternate Flow / Invariant 1 -
Invariant 2 -
4) Deskripsi Use Case Admin Mengelola Data Produk.
Tabel IV.6
Deskripsi Use Case Admin Mengelola Data Produk
Use Case Name Mengelola Data Produk
Requirements A5
Goal
Admin dapat melihat detail produk,
menambah, mengedit, menghapus data
produk
Pre-Condition Admin berhasil login dan masuk ke
halaman administrator
Post-Condition Melihat detail data produk, data produk
tersimpan, terupdate, terhapus
Failed End Condition
Gagal menyimpan karena ada data yang
kurang, mengupdate atau menghapus data
produk
Primary Actors Admin
Main Flow / Basic Path 1. Admin melihat data produk.
2. Admin melihat detail data produk.
47
3. Admin menambah data produk.
4. Admin menyimpan data produk.
Alternate Flow / Invariant 1 2a. Admin mengedit data produk
Invariant 2 2b. Admin menghapus data produk
5) Deskripsi Use Case Admin Mengelola Data Event.
Tabel IV.7
Deskripsi Use Case Admin Mengelola Data Event
Use Case Name Mengelola Data Event
Requirements A6
Goal Admin dapat menambah,mengedit,
menghapus data event
Pre-Condition Admin berhasil login dan masuk ke
halaman administrator
Post-Condition Data event tersimpan, terupdate, terhapus
Failed End Condition
Gagal menyimpan karena ada data yang
kurang, mengupdate atau menghapus data
event
Primary Actors Admin
Main Flow / Basic Path
1. Admin melihat data event.
2. Admin menambah data event.
3. Admin menyimpan data event.
Alternate Flow / Invariant 1 2a. Admin mengedit data event
Invariant 2 2b. Admin menghapus data event
6) Deskripsi Use Case Admin Mengelola Data Page.
Tabel IV.8
Deskripsi Use Case Admin Mengelola Data Page
Use Case Name Mengelola Data Page
Requirements A7
Goal Admin dapat menambah,mengedit,
menghapus data page
Pre-Condition Admin berhasil login dan masuk ke
halaman administrator
Post-Condition Data page tersimpan, terupdate, terhapus
48
Failed End Condition
Gagal menyimpan karena ada data yang
kurang, mengupdate atau menghapus data
page
Primary Actors Admin
Main Flow / Basic Path
1. Admin melihat data page.
2. Admin menambah data page.
3. Admin menyimpan data page.
Alternate Flow / Invariant 1 2a. Admin mengedit data page
Invariant 2 2b. Admin menghapus data page
7) Deskripsi Use Case Admin Mengelola Data Stok.
Tabel IV.9
Deskripsi Use Case Admin Mengelola Data Stok
Use Case Name Mengelola Data Stok
Requirements A8
Goal Admin dapat menambah,mengedit,
menghapus data stok
Pre-Condition Admin berhasil login dan masuk ke
halaman administrator
Post-Condition Data stok tersimpan, terupdate, terhapus
Failed End Condition
Gagal menyimpan karena ada data yang
kurang, mengupdate atau menghapus data
stok
Primary Actors Admin
Main Flow / Basic Path
1. Admin melihat data stok.
2. Admin menambah data stok.
3. Admin menyimpan data stok.
Alternate Flow / Invariant 1 2a. Admin mengedit data stok
Invariant 2 2b. Admin menghapus data stok
8) Deskripsi Use Case Admin Mengelola Ongkos Kirim.
Tabel IV.10
Deskripsi Use Case Admin Mengelola Ongkos Kirim
Use Case Name Mengelola Data Ongkos Kirim
Requirements A11
49
Goal Admin dapat menambah,mengedit,
menghapus data ongkos kirim
Pre-Condition Admin berhasil login dan masuk ke
halaman administrator
Post-Condition Data ongkos kirim tersimpan, terupdate,
terhapus
Failed End Condition
Gagal menyimpan karena ada data yang
kurang, mengupdate atau menghapus data
ongkos kirim
Primary Actors Admin
Main Flow / Basic Path
1. Admin melihat data ongkos kirim.
2. Admin menambah data ongkos kirim.
3. Admin menyimpan data ongkos kirim.
Alternate Flow / Invariant 1 2a. Admin mengedit data ongkos kirim
Invariant 2 2b. Admin menghapus data ongkos kirim
9) Deskripsi Use Case Admin Mengelola Buku Tamu.
Tabel IV.11
Deskripsi Use Case Admin Mengelola Buku Tamu
Use Case Name Mengelola Data Buku Tamu
Requirements A9
Goal Admin dapat membalas dan menghapus
data buku tamu
Pre-Condition Admin berhasil login dan masuk ke
halaman administrator
Post-Condition Data buku tamu berhasil dibalas, terhapus
Failed End Condition Gagal membalas, menghapus data buku
tamu
Primary Actors Admin
Main Flow / Basic Path Admin melihat data buku tamu
Alternate Flow / Invariant 1 Admin menghapus data buku tamu
Invariant 2 -
50
10) Deskripsi Use Case Admin Mengelola Konfirmasi Pembayaran.
Tabel IV.12
Deskripsi Use Case Admin Mengelola Konfirmasi Pembayaran
Use Case Name Mengelola Data Konfirmasi Pembayaran
Requirements A10
Goal Admin dapat menghapus data konfirmasi
pembayaran
Pre-Condition Admin berhasil login dan masuk ke halaman
administrator
Post-Condition Data konfirmasi pembayaran terhapus
Failed End Condition Gagal menghapus data konfirmasi
pembayaran
Primary Actors Admin
Main Flow / Basic Path Admin melihat data konfirmasi pembayaran
Alternate Flow / Invariant
1
Admin menghapus data konfirmasi
pembayaran
Invariant 2 -
4.1.3 Activity Diagram
a. Activity Diagram Halaman User (Pengunjung)
Sumber: Hasil Olahan Penulis
Gambar IV.4
Activity Diagram Halaman User (Pengunjung)
51
b. Activity Diagram Halaman Member
Sumber: Hasil Olahan Penulis
Gambar IV.5
Activity Diagram Halaman Member
c. Activity Diagram Admin Mengelola Data Pengguna.
Sumber: Hasil Olahan Penulis
Gambar IV.6
Activity Diagram Admin Mengelola Data Pengguna
52
d. Activity Diagram Admin Mengelola Akun Pribadi.
Sumber: Hasil Olahan Penulis
Gambar IV.7
Activity Diagram Admin Mengelola Akun Pribadi
e. Activity Diagram Admin Mengelola Data Laporan Penjualan.
Sumber: Hasil Olahan Penulis
Gambar IV.8
Activity Diagram Admin Mengelola Laporan Penjualan
f. Activity Diagram Admin Mengelola Data Produk.
Sumber: Hasil Olahan Penulis
Gambar IV.9
Activity Diagram Admin Mengelola Data Produk
53
g. Activity Diagram Admin Mengelola Data Event.
Sumber: Hasil Olahan Penulis
Gambar IV.10
Activity Diagram Admin Mengelola Data Event
h. Activity Diagram Admin Mengelola Data Page.
Sumber: Hasil Olahan Penulis
Gambar IV.11
Activity Diagram Admin Mengelola Data Page
i. Activity Diagram Admin Mengelola Data Stok.
Sumber: Hasil Olahan Penulis
Gambar IV.12
Activity Diagram Admin Mengelola Data Stok
54
j. Activity Diagram Admin Mengelola Ongkos Kirim.
Sumber: Hasil Olahan Penulis
Gambar IV.13
Activity Diagram Admin Mengelola Ongkos Kirim
k. Activity Diagram Admin Mengelola Buku Tamu.
Sumber: Hasil Olahan Penulis
Gambar IV.14
Activity Diagram Admin Mengelola Buku Tamu
l. Activity Diagram Admin Mengelola Konfirmasi Pembayaran.
Sumber: Hasil Olahan Penulis
Gambar IV.15
Activity Diagram Admin Mengelola Konfirmasi Pembayaran
55
4.2 Desain
Tahap desain menjelaskan tentang penjabaran desain database, desain
software architecture, dan desain interface yang digunakan pada sistem penjualan
berbasis web di kelompok Jati Husada Mulya. Penjelasannya sebagai berikut:
4.2.1 Database
a. Entity Relationship Diagram (ERD)
Sumber: Hasil Olahan Penulis
Gambar IV.16
Entity Relationship Diagram Penjualan Berbasis Web
56
b. Logical Record Strucuture (LRS)
Sumber: Hasil Olahan Penulis
Gambar IV.17
Logical Record Structure Penjualan Berbasis Web
c. Spesifikasi File
Spesifikasi File dalam perancangan website kelompok usaha jamu Jati
Husada Mulya adalah sebagai berikut:
1) Spesifikasi File Akses
Nama File : Akses
57
Akronim : Akses
Fungsi : Untuk menyimpan data hak akses
Tipe File : File Master
Akses File : Random
Media : Hard Disk
Kunci Field : akid
Software : phpMyAdmin
Tabel IV.13
Spesifikasi File Akses
No. Elemen Data Nama Field Type Size Keterangan
1. ID Akses akid Integer 11 Primary Key,
Auto Increment
2. Nama Akses aknama Char 10
2) Spesifikasi File Buku Tamu
Nama File : Buku Tamu
Akronim : btamu
Fungsi : Untuk menyimpan data buku tamu
Tipe File : File Master
Akses File : Random
Media : Hard Disk
Kunci Field : btid
Software : phpMyAdmin
58
Tabel IV.14
Spesifikasi File Buku Tamu
No. Elemen Data Nama Field Type Size Keterangan
1. ID Buku Tamu btid Integer 11 Primary Key,
Auto Increment
2. Nama Buku Tamu btnama Varchar 32
3. Email Buku Tamu btemail Varchar 64
4. Web Buku Tamu btweb Varchar 64
5. Isi Buku Tamu btkonten Varchar 1000
6. Waktu btwaktu Varchar 40
7. Isi Balasan btbalas Text
8. Nama Author usnama Varchar 40
3) Spesifikasi File Event
Nama File : Event
Akronim : event
Fungsi : Untuk menyimpan data event
Tipe File : File Master
Akses File : Random
Media : Hard Disk
Kunci Field : evid
Software : phpMyAdmin
Tabel IV.15
Spesifikasi File Event
No. Elemen Data Nama Field Type Size Keterangan
1. ID Event evid Integer 11 Primary Key,
Auto Increment
59
2. Gambar Event evimg Varchar 65
3. Judul Event evjudul Varchar 65
4. Konten Event evkonten Text
5. Nama User usnama Varchar 40
4) Spesifikasi File Jamu
Nama File : Jamu
Akronim : jamu
Fungsi : Untuk menyimpan data produk jamu
Tipe File : File Master
Akses File : Random
Media : Hard Disk
Kunci Field : jid
Software : phpMyAdmin
Tabel IV.16
Spesifikasi File Jamu
No. Elemen Data Nama Field Type Size Keterangan
1. ID Jamu jid Integer 11 Primary Key,
Auto Increment
2. Nama Jamu jnama Varchar 50
3. Harga Jamu jharga Double
4. Gambar Jamu jimg Varchar 65
5. Berat Jamu jberat Varchar 25
6. Best Jamu jbest Integer 11
7. Komposisi komposisi Varchar 150
8. Kegunaan kegunaan Text
9. Stok stok Integer 11
60
5) Spesifikasi File Keranjang Belanja
Nama File : Keranjang Belanja
Akronim : kerbelanja
Fungsi : Untuk menyimpan data keranjang belanja yang
masuk
Tipe File : File Transaksi
Akses File : Random
Media : Hard Disk
Kunci Field : kerid
Software : phpMyAdmin
Tabel IV.17
Spesifikasi File Keranjang Belanja
No. Elemen Data Nama Field Type Size Keterangan
1. ID Keranjang kerid Integer 11 Primary Key,
Auto Increment
2. ID Jamu jid Integer 11
3. Kuantitas kerqty Integer 11
4. Sub Total kersubtot Double
5. IP Keranjang kerip Varchar 20
6. Status Keranjang kerstatus Integer 11
7. ID Laporan lapid Biginteger 20
8. ID User usid Integer 11
6) Spesifikasi File Konfirmasi
Nama File : Konfirmasi
Akronim : konfirmasi
Fungsi : Untuk menyimpan data konfirmasi pembayaran
61
Tipe File : File Master
Akses File : Random
Media : Hard Disk
Kunci Field : kfmid
Software : phpMyAdmin
Tabel IV.18
Spesifikasi File Konfirmasi
No. Elemen Data Nama Field Type Size Keterangan
1. ID Konfirmasi kfmid Integer 11 Primary Key,
Auto Increment
2. Nama Konfirmasi usnama Varchar 40
3. Nomor Order kfmno Integer 11
4. Jumlah Transfer jmtransfer Double
5. Nama Rekening kfmrek Varchar 50
6. Waktu kfmwaktu Varchar 40
7) Spesifikasi File Kota
Nama File : Kota
Akronim : kota
Fungsi : Untuk menyimpan data ongkos kirim
Tipe File : File Master
Akses File : Random
Media : Hard Disk
Kunci Field : ktnama
Software : phpMyAdmin
62
Tabel IV.19
Spesifikasi File Kota
No. Elemen Data Nama Field Type Size Keterangan
1. Nama Kota ktnama Varchar 50 Primary Key
2. Ongkos Kirim ktongkos Double
8) Spesifikasi File Laporan Belanja
Nama File : Laporan Belanja
Akronim : lapbelanja
Fungsi : Untuk menyimpan data laporan belanja
Tipe File : File Transaksi
Akses File : Random
Media : Hard Disk
Kunci Field : lapid
Software : phpMyAdmin
Tabel IV.20
Spesifikasi File Laporan Belanja
No. Elemen Data Nama Field Type Size Keterangan
1. ID Laporan akid Biginteger 20 Primary Key,
Auto Increment
2. ID User usid Integer 11
3. Nama Kota ktnama Varchar 50
4. Alamat alamat Varchar 150
5. IP Laporan lapip Varchar 20
6. Tanggal Laporan lapdate Varchar 35
7. Waktu Laporan laptime Varchar 15
8. Status Laporan lapstatus Varchar 20
63
9) Spesifikasi File Menu
Nama File : Menu
Akronim : menu
Fungsi : Untuk menyimpan data menu
Tipe File : File Master
Akses File : Random
Media : Hard Disk
Kunci Field : mnid
Software : phpMyAdmin
Tabel IV.21
Spesifikasi File Menu
No. Elemen Data Nama Field Type Size Keterangan
1. ID Menu mnid Integer 11 Primary Key,
Auto Increment
2. Kelas Menu mnclass Varchar 20
3. ID Parent parent_id Integer 11
4. Judul Menu mnjudul Varchar 65
5. URL Menu mnurl Varchar 65
6. Urutan Menu mnorder Integer 11
7. Nama User usnama Varchar 40
10) Spesifikasi File News
Nama File : News
Akronim : news
Fungsi : Untuk menyimpan data news, article, berita dll
Tipe File : File Master
Akses File : Random
64
Media : Hard Disk
Kunci Field : newsid
Software : phpMyAdmin
Tabel IV.22
Spesifikasi File News
No. Elemen Data Nama Field Type Size Keterangan
1. ID News newsid Integer 11 Primary Key,
Auto Increment
2. Gambar News newsimg Varchar 65
3. Judul News newsjudul Varchar 65
4. Konten News newskonten Text
5. Nama User usnama Varchar 40
11) Spesifikasi File Node
Nama File : Node
Akronim : node
Fungsi : Untuk menyimpan data node atau page
Tipe File : File Master
Akses File : Random
Media : Hard Disk
Kunci Field : ndid
Software : phpMyAdmin
Tabel IV.23
Spesifikasi File Node
No. Elemen Data Nama Field Type Size Keterangan
1. ID Node ndid Varchar 65 Primary Key
65
2. Judul Node ndjudul Varchar 65
3. Isi Node ndkonten Text
4. Nama User usnama Varchar 40
12) Spesifikasi File Users
Nama File : Users
Akronim : users
Fungsi : Untuk menyimpan data semua pengguna
Tipe File : File Master
Akses File : Random
Media : Hard Disk
Kunci Field : usid
Software : phpMyAdmin
Tabel IV.24
Spesifikasi File Users
No. Elemen Data Nama Field Type Size Keterangan
1. ID Users usid Integer 11 Primary Key,
Auto Increment
2. ID Akses akid Integer 11
3. Nama Users usnama Varchar 40
4. Password Users uspass Varchar 40
5. Nama nama Varchar 50
6. Email email Varchar 50
7. Alamat alamat Varchar 100
8. Telephone phone Varchar 15
9. Gambar Users usimg Varchar 50
10. Nama Kota ktnama Varchar 50
66
4.2.2 Software Architecture
a. Deployment Diagram
Fungsi diagram ini adalah menggambarkan tata letak sistem secara fisik
sehingga memperlihatkan bagian-bagian software (perangkat lunak) yang berjalan
pada hardware yang digunakan untuk mengimplementasikan sistem serta
keterhubungan antara komponen hardware-hardware tersebut.
Sumber: Hasil Olahan Penulis
Gambar IV.18
Deployment Diagram Penjualan Berbasis Web
b. Component Diagram
Fungsi diagram ini adalah menggambarkan struktur dan hubungan antar
komponen software, termasuk saling ketergantungan diantaranya. Diagram ini juga
67
dapat berupa interface, berupa kumpulan layanan yang disediakan oleh satu
komponen untuk komponen lainnya.
Sumber: Hasil Olahan Penulis
Gambar IV.19
Component Diagram Penjualan Berbasis Web
4.2.3 User Interface
User interface adalah tampilan antar muka website yang dihasilkan dari
pengolahan kode program berdasarkan desain yang telah dibuat pada tahap desain.
User interface pada website Jati Husada Mulya terdapat dua bagian yaitu user,
pengunjung biasa atau yang telah memiliki akun (member) dan admin, yang dapat
mengelola data-data pada website. Di bawah ini adalah interface pada website Jati
Husada Mulya, antara lain:
a. Halaman User
68
Sumber: Hasil Olahan Penulis
Gambar IV.20
Tampilan Halaman Index User
69
Sumber: Hasil Olahan Penulis
Gambar IV.21
Tampilan Halaman Mengenai Kami
Sumber: Hasil Olahan Penulis
Gambar IV.22
Tampilan Halaman Detail Artikel
70
Sumber: Hasil Olahan Penulis
Gambar IV.23
Tampilan Halaman Detail Produk
Sumber: Hasil Olahan Penulis
Gambar IV.24
Tampilan Halaman Buku Tamu
71
Sumber: Hasil Olahan Penulis
Gambar IV.25
Tampilan Halaman Event
Sumber: Hasil Olahan Penulis
Gambar IV.26
Tampilan Halaman Detail Event
72
Sumber: Hasil Olahan Penulis
Gambar IV.27
Tampilan Halaman Registrasi Member
Sumber: Hasil Olahan Penulis
Gambar IV.28
Tampilan Halaman Login Member
73
Sumber: Hasil Olahan Penulis
Gambar IV.29
Tampilan Halaman Ongkos Kirim
Sumber: Hasil Olahan Penulis
Gambar IV.30
Tampilan Halaman Profil Member
74
Sumber: Hasil Olahan Penulis
Gambar IV.31
Tampilan Halaman Edit Profil Member
Sumber: Hasil Olahan Penulis
Gambar IV.32
Tampilan Halaman Keranjang Belanja Member
75
Sumber: Hasil Olahan Penulis
Gambar IV.33
Tampilan Halaman Laporan Belanja Member
Sumber: Hasil Olahan Penulis
Gambar IV.34
Tampilan Halaman Konfirmasi Pembayaran Member
76
b. Halaman Admin
Sumber: Hasil Olahan Penulis
Gambar IV.35
Tampilan Halaman Index Administrator
77
Sumber: Hasil Olahan Penulis
Gambar IV.36
Tampilan Halaman Login Admin
Sumber: Hasil Olahan Penulis
Gambar IV.37
Tampilan Halaman Data Profil Admin
78
Sumber: Hasil Olahan Penulis
Gambar IV.38
Tampilan Halaman Edit Profil Admin
Sumber: Hasil Olahan Penulis
Gambar IV.39
Tampilan Halaman Data Akses
79
Sumber: Hasil Olahan Penulis
Gambar IV.40
Tampilan Halaman Edit Data Akses
Sumber: Hasil Olahan Penulis
Gambar IV.41
Tampilan Halaman Data Daftar Pengguna
80
Sumber: Hasil Olahan Penulis
Gambar IV.42
Tampilan Halaman Laporan Order Masuk
Sumber: Hasil Olahan Penulis
Gambar IV.43
Tampilan Halaman Laporan Order Selesai
81
Sumber: Hasil Olahan Penulis
Gambar IV.44
Tampilan Halaman Administrasi Laporan
Sumber: Hasil Olahan Penulis
Gambar IV.45
Tampilan Halaman Rekap Laporan
82
Sumber: Hasil Olahan Penulis
Gambar IV.46
Tampilan Halaman Konten Barang
Sumber: Hasil Olahan Penulis
Gambar IV.47
Tampilan Halaman Tambah Data Barang
83
Sumber: Hasil Olahan Penulis
Gambar IV.48
Tampilan Halaman Edit Data Barang
Sumber: Hasil Olahan Penulis
Gambar IV.49
Tampilan Halaman Detail Data Barang
84
Sumber: Hasil Olahan Penulis
Gambar IV.50
Tampilan Halaman Konten Data Page
Sumber: Hasil Olahan Penulis
Gambar IV.51
Tampilan Halaman Detail Data Page
85
Sumber: Hasil Olahan Penulis
Gambar IV.52
Tampilan Halaman Tambah Data Page
Sumber: Hasil Olahan Penulis
Gambar IV.53
Tampilan Halaman Edit Data Page
86
Sumber: Hasil Olahan Penulis
Gambar IV.54
Tampilan Halaman Konten Data Event
Sumber: Hasil Olahan Penulis
Gambar IV.55
Tampilan Halaman Detail Data Event
87
Sumber: Hasil Olahan Penulis
Gambar IV.56
Tampilan Halaman Konten Data News
Sumber: Hasil Olahan Penulis
Gambar IV.57
Tampilan Halaman Detail Data News
88
Sumber: Hasil Olahan Penulis
Gambar IV.58
Tampilan Halaman Data Menu
Sumber: Hasil Olahan Penulis
Gambar IV.59
Tampilan Halaman Tambah Data Menu
89
Sumber: Hasil Olahan Penulis
Gambar IV.60
Tampilan Halaman Edit Data Menu
Sumber: Hasil Olahan Penulis
Gambar IV.61
Tampilan Halaman Data Ongkos Kirim
90
Sumber: Hasil Olahan Penulis
Gambar IV.62
Tampilan Halaman Tambah Ongkos Kirim
Sumber: Hasil Olahan Penulis
Gambar IV.63
Tampilan Halaman Edit Ongkos Kirim
91
Sumber: Hasil Olahan Penulis
Gambar IV.64
Tampilan Halaman Buku Tamu Admin
Sumber: Hasil Olahan Penulis
Gambar IV.65
Tampilan Halaman Balas Buku Tamu
92
Sumber: Hasil Olahan Penulis
Gambar IV.66
Tampilan Halaman Konfirmasi Pembayaran
4.3 Code Generation
a. Cart.php
<?php
if (isset($_POST['chout'])) {
if (isset($_SESSION['loggedin']) && $_SESSION['loggedin']==MD5('Y3s!OK'))
{
$mess_cnama = $mess_cphone = $mess_calamat = "";
$nama = $phone = $alamat = "";
if (empty($_POST['cnama'])) {
$mess_cnama="* Nama belum diisi";
} else {
$nama = $_POST['cnama'];
//validasi nama
if (!preg_match("/^[a-zA-Z .]*$/", $nama)) {
93
$mess_cnama="* Nama harus berupa huruf";
}
}
if (empty($_POST['cphone'])) {
$mess_cphone="* Nomor telepon belum diisi";
} else {
$phone = $_POST['cphone'];
//validasi telepon
if (!preg_match("/^[0-9]*$/", $phone)) {
$mess_cphone="* Nomor telepon harus berupa angka";
}
}
if (empty($_POST['ckota'])) { $mess_ckota="*"; }
if (empty($_POST['calamat'])) { $mess_calamat="* Alamat belum diisi";
}
if(empty($_POST['qty'])) {
$mess_qty="* Jumlah beli harus diisi";
} else {
$qty = $_POST['qty'];
//validasi kuantitas
if (!preg_match("/^[0-9]*$/", $qty)) {
$mess_qty="* Jumlah beli harus berupa angka";
}
}
if (!empty($nama)&&empty($mess_cnama) &&
!empty($phone)&&empty($mess_cphone) && !empty($_POST['ckota']) &&
!empty($_POST['calamat'])) {
$_SESSION['ktnama']=$_POST['ckota'];
$_SESSION['alamat']=$_POST['calamat'];
user_REGUP($_POST['cnama'],$_POST['ckota'],$_POST['calamat'],$_POST['cp
hone']);
$_SESSION['checkdata']=1;
}
}
}
?>
<div class="title-content"> Keranjang Belanja</div>
<div id="border">
<div id="main">
<div class='m-content'>
<?php
TOTAL_TR();
//diambil dari fungsi TOTAL_TR() dalam file function
$qrytot=mysql_query("SELECT ifnull(COUNT(a.jid),0) as
totdata FROM kerbelanja a, jamu b WHERE a.jid=b.jid AND a.kerstatus=2 AND
a.usid='$usid' AND a.kerip='$ip'", $koneksi);
$rowtot=mysql_fetch_array($qrytot);
94
$totkb=$rowtot['totdata'];
if ($totkb>0) {
?>
<p>
<table border="0" cellpadding="0" cellspacing="0">
<tr bgcolor="#663" style="border:solid 0px #999;color:#FFF">
<td align='center'>Item</td>
<td align='center'>Detail</td>
<td align='center'>Qty (Pack)</td>
<td align='center'>Subtotal</td>
</tr>
<?php
print "Berikut ini adalah produk yang ada di Keranjang Belanja
Anda:";
$qry=mysql_query("SELECT * FROM vkerblj_jamu WHERE
kerstatus=2 AND kerip='$ip' ORDER BY kerid", $koneksi);
while($row=mysql_fetch_array($qry)) {
?>
<p>
<!-- fungsi update atau delete (membatalkan) barang -->
<form method="POST" action="?n=cart_reg">
<tr>
<td rowspan='3' width='110'>
<div class='m_img'><center><?php print "<img
src=./admin/images/$row[jimg] title='".$row['jnama']."' height='75' class='m'>";
?></center></div></td>
<td bgcolor="E8E8E8" height='20' width='300'> <?php print
$row['jnama'] ?></td>
<td align='center'> <input type='text' name='qty' tabindex='1'
size='6' maxlength='6' value='<?php print $row['kerqty'] ?>' /> <br /></td>
<td bgcolor="E8E8E8" valign='middle'> <?php print
"Rp.".number_format($row['kersubtot']) ?> </td>
</tr>
<tr>
<td bgcolor="E8E8E8" colspan='1' height='20'> <?php print
"Rp.".number_format($row['jharga']) ?></td>
<td align='center'><button name="add" style="border: 0px; background-
color:transparent"><img src='./images/bt_add.png' height='23' /></button></td>
<td bgcolor="E8E8E8"><input name='addid' type='hidden' value='<?php
print $row['kerid'] ?>' /></td>
</tr>
</form>
<tr>
<td bgcolor="E8E8E8"></td>
<td></td>
<td bgcolor="E8E8E8"></td>
</tr>
<tr>
95
<td height='20' align='center'> <?php print "<a
href='./?n=cart_reg&&kerid=$row[kerid]'><img src='./images/bt_delete.png'
height='23'></a>" ?> </td>
<td bgcolor="E8E8E8"></td>
<td></td>
<td bgcolor="E8E8E8"></td>
</tr>
<tr>
<td colspan='4'><hr /></td>
</tr>
<?php
}
?>
<tr bgcolor="#663" style="border:solid 0px #999;color:#FFF">
<td height='20' align='center'> Total </td>
<td></td>
<td></td>
<td> <?php print "Rp.".number_format($total) ?> </td>
</tr>
<tr>
<td height='10' colspan=4></td>
</tr>
<tr>
<td height="10" align="left"><b>Catatan:</b></td>
<td colspan="3" align="justify">Ongkos kirim hanya diberlakukan per
pengiriman berdasarkan KOTA tujuan, berapapun berat dari total produk yang
dipesan.</td>
</tr>
<tr>
<td height="10"></td>
</tr>
<tr bgcolor="#663" style="border:solid 0px #999;color:#FFF">
<td colspan="4"> Silakan isikan data pribadi (kontak) anda
: </td>
</tr>
</table>
<p>
<!-- menampilkan data user -->
<form method="POST" action="<?php print $_SERVER['REQUEST_URI'];
?>">
<table border="0" cellpadding="0" cellspacing="0">
<tr><td height="10"></td></tr>
<tr><td rowspan="29" width="10"></td></tr>
<?php
if (isset($_SESSION['usnama'])) {
$qryuser = mysql_query("SELECT * FROM users WHERE
usnama='$_SESSION[usnama]'", $koneksi);
} else {
$qryuser = mysql_query("SELECT * FROM users WHERE
usnama='-'", $koneksi);
}
96
$rowuser = mysql_fetch_array($qryuser);
?>
<tr><td height='2'></td></tr>
<tr>
<td> Nama </td>
<td><input type="text" name="cnama" tabindex="15" size="24"
maxlength="32" value='<?php echo $rowuser['nama']; ?>' />
<?php if (!empty($mess_cnama)) { print $mess_cnama; } ?></td>
</tr>
<tr>
<td> Telepon </td>
<td><input type="text" name="cphone" tabindex="16" size="24"
maxlength="14" value='<?php echo $rowuser['phone']; ?>' />
<?php if(!empty($mess_cphone)) { print $mess_cphone; } ?></td>
</tr>
<tr>
<td> Kota </td>
<td><select name="ckota" tabindex="17">
<option value='<?php echo $rowuser['ktnama']; ?>' selected><?php echo
$rowuser['ktnama']; ?></option>
<?php
$qrytotko=mysql_query("SELECT ifnull(COUNT(*),0) as
totkota FROM kota", $koneksi);
$rowkota=mysql_fetch_array($qrytotko);
$totko=$rowkota["totkota"];
if ($totko>0) {
$qry=mysql_query("SELECT * FROM kota ORDER BY
ktnama", $koneksi);
while ($row=mysql_fetch_array($qry)) {
echo "<option
value='".$row['ktnama']."'>".$row['ktnama']."</option>";
}
}
?>
</select><?php if (!empty($mess_ckota)) { print $mess_ckota; } ?></td>
</tr>
<tr>
<td> Alamat </td>
<td><textarea name="calamat" rows='2' cols="19" tabindex="18"><?php
echo $rowuser['alamat'];?></textarea>
<?php if (!empty($mess_calamat)) { print $mess_calamat; } ?></td>
</tr>
<tr><td height='6'></td></tr>
<tr>
<td width="94"></td>
<td><button name="chout" style="border:0px; background-
color:transparent"><img src='./images/bt_checkout.png' height="30"
/></button></td>
</tr>
</table>
</form>
<p>
97
<!-- pesan ketika mengakses ker_belanja yg masih kosong -->
<?php
} else {
if (isset($_SESSION['loggedin'])) {
print "Keranjang belanja Anda masih
kosong.<br>";
} else {
print "Untuk bisa belanja, Anda harus login
terlebih dahulu. Jika belum memiliki akun, silahkan daftar <a href='?n=user_reg'>di
sini</a>.";
}
}
?>
</div>
</div>
</div>
<font face='Tahoma' size='2'><img src='./images/back.gif' alt='mb' width="5" /><a
href="index.php" style="color:#b72c24" onmouseover="this.style.color='#ff0000'"
onmouseout="this.style.color='#b72c24'"> Kembali</a></font>
4.4 Testing
Pengujian terhadap rancangan website Jati Husada Mulya menggunakan
metode Black Box Testing yang terfokus terhadap proses masukan dan keluaran
yang ditampilkan melalui form-form pada website.
a. Pengujian Halaman Admin
1) Pengujian terhadap form login admin
Tabel IV.25
Pengujian Black Box Testing Form Login Admin
No. Skenario
Pengujian
Test Case Hasil yang
diharapkan
Hasil
Pengujian
Kesimpulan
1. Username dan
Password tidak
diisi kemudian
klik tombol
login
Username :
(kosong)
Password :
(kosong)
Sistem
menolak
masuk dan
menampilkan
tanda * pada
Username dan
Password
Sesuai
Harapan
Valid
2. Username
tidak diisi dan
Password diisi
kemudian klik
tombol login
Username :
(kosong)
Password :
admin
Sistem
menolak
masuk dan
menampilkan
Sesuai
Harapan Valid
98
tanda * pada
Username
3. Username diisi
dan Password
tidak diisi
kemudian klik
tombol login
Username :
admin
Password :
(kosong)
Sistem
menolak
masuk dan
menampilkan
tanda * pada
password
Sesuai
Harapan Valid
4. Mengetikkan
salah satu
kondisi salah
pada
Username atau
Password
kemudian klik
tombol login
Username :
admin (benar)
Password :
hida (salah)
Sistem
menolak
masuk dan
menampilkan
pesan “Gagal
Login”
Sesuai
Harapan Valid
5. Mengetikkan
Username dan
Password
dengan benar
kemudian klik
tombol login
Username :
admin (benar)
Password :
admin (benar)
Sistem
menerima
akses login
dan
menampilkan
pesan
“Berhasil
Login”
Sesuai
Harapan Valid
2) Pengujian terhadap konten data barang
Tabel IV.26
Pengujian Black Box Testing Konten Barang
No. Skenario
Pengujian
Test Case Hasil yang
diharapkan
Hasil
Pengujian
Kesimpulan
1. Nama produk
tidak diisi,
mengisi harga
produk, pilih
gambar, berat,
komposisi dan
kegunaan
Nama Produk:
(kosong)
Harga :
20,000
Gambar :
j_kuthi.jpg
Berat/Gram :
250
Komposisi :
(uraian)
Kegunaan :
(uraian)
Klik Simpan
Sistem akan
menolak akses
tambah produk
baru dengan
menampilkan
pesan * Nama
belum diisi
pada nama
produk
Sesuai
Harapan Valid
2. Mengklik
tombol
Nama Produk:
Kencur Sunthi
Sistem akan
menerima
Sesuai
Harapan Valid
99
Tambah
Produk Baru.
Ketik nama
produk, harga
produk, pilih
gambar, berat,
komposisi dan
kegunaan
Harga :
20,000
Gambar :
j_kuthi.jpg
Berat/Gram :
250
Komposisi :
(uraian)
Kegunaan :
(uraian)
Klik Simpan
akses tambah
produk baru
3. Klik tombol
ubah pada
kolom aksi.
Ubah nama
produk, harga
produk,
gambar, berat,
komposisi dan
kegunaan
Nama Produk:
(data)
Harga :
(data)
Gambar :
(data)
Berat/Gram :
(data)
Komposisi :
(data)
Kegunaan :
(data)
Klik Simpan
Sistem akan
menerima
akses ubah
data produk
Sesuai
Harapan Valid
3) Pengujian terhadap konten data page
Tabel IV.27
Pengujian Black Box Testing Konten Page
No. Skenario
Pengujian
Test Case Hasil yang
diharapkan
Hasil
Pengujian
Kesimpulan
1. Judul tidak
diisi, hanya
mengisi konten
Judul:
(kosong)
Konten :
(uraian)
Klik Simpan
Sistem akan
menolak akses
tambah page
baru dengan
menampilkan
pesan * Judul
belum diisi
pada judul
Sesuai
Harapan Valid
2. Mengklik
tombol
Tambah Page
Baru. Ketik
judul, dan
konten
Judul:
Pelatihan
Konten :
(uraian)
Klik Simpan
Sistem akan
menerima
akses tambah
page baru
Sesuai
Harapan Valid
100
3. Klik tombol
ubah pada
kolom aksi.
Ubah judul,
dan konten
Judul:
(data)
Konten :
(data)
Klik Simpan
Sistem akan
menerima
akses ubah
data page
Sesuai
Harapan Valid
4) Pengujian terhadap konten data event
Tabel IV.28
Pengujian Black Box Testing Konten Event
No. Skenario
Pengujian
Test Case Hasil yang
diharapkan
Hasil
Pengujian
Kesimpulan
1. Judul tidak
diisi, hanya
mengisi
gambar dan
konten
Judul:
(kosong)
Gambar :
ev_eve1.jpg
Konten :
(uraian)
Klik Simpan
Sistem akan
menolak akses
tambah event
baru dengan
menampilkan
pesan * Judul
belum diisi
pada judul
Sesuai
Harapan
Valid
2. Mengklik
tombol
Tambah Event
Baru. Ketik
judul, pilih
gambar dan
ketik konten
Judul :
Pelatihan
Gambar :
ev_eve1.jpg
Konten :
(uraian)
Klik Simpan
Sistem akan
menerima
akses tambah
event baru Sesuai
Harapan Valid
3. Klik tombol
ubah pada
kolom aksi.
Ubah judul,
gambar dan
konten
Judul:
(data)
Gambar :
(data)
Konten :
(data)
Klik Simpan
Sistem akan
menerima
akses ubah
data event Sesuai
Harapan Valid
5) Pengujian terhadap menu horizontal
Tabel IV.29
Pengujian Black Box Testing Menu Horizontal
No. Skenario
Pengujian
Test Case Hasil yang
diharapkan
Hasil
Pengujian
Kesimpulan
1. Kategori tidak
diisi
Kategori :
(kosong)
Sistem akan
menolak akses
Sesuai
Harapan Valid
101
Klik Simpan tambah menu
horisontal
dengan
menampilkan
pesan *
Kategori
belum diisi
pada kategori
2. Mengklik
tombol
Tambah Menu
Horisontal.
Ketikkan
kategori
Kategori :
Tentang Kami
Klik Simpan
Sistem akan
menerima
akses tambah
menu
horisontal
Sesuai
Harapan Valid
3. Klik tombol
ubah pada
kolom aksi.
Ubah kategori
Kategori :
(data)
Klik Simpan
Sistem akan
menerima
akses ubah
data menu
horisontal
Sesuai
Harapan Valid
6) Pengujian terhadap data ongkos kirim
Tabel IV.30
Pengujian Black Box Testing Ongkos Kirim
No. Skenario
Pengujian
Test Case Hasil yang
diharapkan
Hasil
Pengujian
Kesimpulan
1. Nama kota
tidak diisi dan
ongkos kirim
diisi
Kota :
(kosong)
Ongkos Kirim :
15,000
Klik Simpan
Sistem akan
menolak akses
tambah data
baru dengan
menampilkan
pesan * Kota
belum diisi
pada kota
Sesuai
Harapan Valid
2.
Menambahkan
kota dengan
nama yang
sudah ada dan
ongkos kirim
berbeda
Kota :
Surabaya
Ongkos Kirim ;
20,000
Klik Simpan
Sistem akan
menolak akses
tambah data
baru dengan
menampilkan
pesan *Nama
kota sudah ada
pada kota
Sesuai
Harapan
Valid
3. Mengklik
tombol
Tambah Data
Baru. Ketikkan
Kota :
Surabaya
Ongkos Kirim :
15,000
Sistem akan
menerima
akses tambah
data kota baru
Sesuai
Harapan Valid
102
nama kota dan
ongkos kirim
Klik Simpan
4. Klik tombol
ubah pada
kolom aksi.
Ubah nama
kota dan
ongkos kirim
Kota :
(data)
Ongkos Kirim :
(data)
Klik Simpan
Sistem akan
menerima
akses ubah
data ongkos
kirim
Sesuai
Harapan Valid
7) Pengujian terhadap data akses
Tabel IV.31
Pengujian Black Box Testing Data Akses
No. Skenario
Pengujian
Test Case Hasil yang
diharapkan
Hasil
Pengujian
Kesimpulan
1. Klik tombol
ubah pada
kolom aksi.
Ubah nama
akses
ID Akses :
(disabled)
Nama Akses :
(data)
Klik Simpan
Sistem akan
menerima
akses ubah
data akses
Sesuai
Harapan Valid
8) Pengujian terhadap daftar pengguna
Tabel IV.32
Pengujian Black Box Testing Daftar Pengguna
No. Skenario
Pengujian
Test Case Hasil yang
diharapkan
Hasil
Pengujian
Kesimpulan
1. Username
tidak diisi lalu
mengisikan
password,
ulang
password,
email, nama,
telepon,
alamat, kota
Username :
(kosong)
Password :
hida
Ulang
Password :
hida
Email :
m
Nama :
Nurhida
Telepon :
12345
Alamat :
Sedayu
Sistem akan
menolak
akses tambah
pengguna
baru dengan
menampilkan
pesan *
Username
belum diisi
pada
username
Sesuai
Harapan
Valid
103
Kota :
Yogyakarta
Klik Simpan
2. Mengsisikan
username,
password,
ulang
password,
email, nama,
telepon,
alamat, kota
tetapi
password dan
ulang
password tidak
sama
Username :
hida
Password :
hida
Ulang
Password :
hidaa (salah)
Email :
m
Nama :
Nurhida
Telepon :
12345
Alamat :
Sedayu
Kota :
Yogyakarta
Klik Simpan
Sistem akan
menolak
akses tambah
pengguna
baru dengan
menampilkan
pesan *
Password
tidak sama
pada
password
Sesuai
Harapan Valid
3. Mengisikan
username
dengan nama
yang sudah ada
pada daftar
pengguna
dengan
password,
ulang
password,
email, nama,
telepon,
alamat, kota
yang berbeda
Username :
hida
Password :
admin
Ulang
Password :
admin
Email :
hidaaa@gmail.
com
Nama :
Nurhidaa
Telepon :
12345
Alamat :
Bantul
Kota :
Yogyakarta
Klik Simpan
Sistem akan
menolak
akses tambah
pengguna
baru dengan
menampilkan
pesan
*Username
sudah ada
Sesuai
Harapan
Valid
4. Mengklik
tombol ubah
pada kolom
aksi untuk
mengubah
password.
Ketika
New
Password:
hidaa
Confirm
Password :
hidha
Klik Simpan
Sistem akan
menolak
akses ubah
data
pengguna
dengan
menampilkan
Sesuai
Harapan Valid
104
mengubah data
password,
antara
password baru
dan ulang
password tidak
sama
pesan
*Password
tidak sama
pada new
password
5. Mengklik
tombol
Tambah
Pengguna
Baru. Ketikkan
username,
password,
ulang
password,
email, nama,
telepon,
alamat, kota
Username :
Hida
Password :
hida
Ulang
Password :
Hida
Email :
m
Nama :
Nurhida
Telepon :
12345
Alamat :
Sedayu
Kota :
Yogyakarta
Klik Simpan
Sistem akan
menerima
akses tambah
pengguna
baru
Sesuai
Harapan Valid
6. Klik tombol
ubah pada
kolom aksi.
Ubah
username,
nama, pilih hak
akses, email,
telepon, foto,
alamat, kota.
Apabila ingin
mengubah
password,
isikan new
password dan
confirm
password. Jika
tidak, biarkan
dalam keadaan
tidak terisi
(kosong)
Username :
(disabled)
Nama :
(data)
Hak Akses :
(data)
Email :
(data)
Telepon :
(data)
Foto :
(data)
Alamat :
(data)
Kota :
(data)
Klik Simpan
Sistem akan
menerima
akses ubah
data
pengguna
Sesuai
Harapan Valid
105
b. Pengujian Halaman User atau Member
1) Pengujian terhadap login member
Tabel IV.33
Pengujian Black Box Testing Form Login Member
No. Skenario
Pengujian
Test Case Hasil yang
diharapkan
Hasil
Pengujian
Kesimpulan
1. Username dan
Password tidak
diisi kemudian
klik tombol
login
Username :
(kosong)
Password :
(kosong)
Sistem
menolak
masuk dan
menampilkan
tanda * pada
Username dan
Password
Sesuai
Harapan
Valid
2. Username
tidak diisi dan
Password diisi
kemudian klik
tombol login
Username :
(kosong)
Password :
nada
Sistem
menolak
masuk dan
menampilkan
tanda * pada
Username
Sesuai
Harapan Valid
3. Username diisi
dan Password
tidak diisi
kemudian klik
tombol login
Username :
nada
Password :
(kosong)
Sistem
menolak
masuk dan
menampilkan
tanda * pada
Password
Sesuai
Harapan Valid
4. Mengetikkan
salah satu
kondisi salah
pada
Username atau
Password
kemudian klik
tombol login
Username :
nada (benar)
Password :
hida (salah)
Sistem
menolak
masuk dan
menampilkan
pesan “Gagal
Login”
Sesuai
Harapan Valid
5. Mengetikkan
Username dan
Password
dengan benar
kemudian klik
tombol login
Username :
nada (benar)
Password :
nada (benar)
Sistem
menerima
akses login
dan
menampilkan
pesan
“Berhasil
Login”
Sesuai
Harapan Valid
106
2) Pengujian terhadap data pribadi member
Tabel IV.34
Pengujian Black Box Testing Data Pribadi Member
No. Skenario
Pengujian
Test Case Hasil yang
diharapkan
Hasil
Pengujian
Kesimpulan
1. Mengklik
tombol ubah
untuk
mengubah
password.
Ketika
mengubah data
password,
antara
password baru
dan ulang
password tidak
sama
New
Password:
nadha
Confirm
Password :
hidha
Klik Simpan
Sistem akan
menolak
akses ubah
data
pengguna
dengan
menampilkan
pesan
*Password
tidak sama
pada new
password
Sesuai
Harapan Valid
2. Klik tombol
ubah pada
daftar
pengguna.
Ubah
username,
nama, email,
telepon, foto,
alamat.
Apabila ingin
mengubah
password,
isikan new
password dan
confirm
password. Jika
tidak, biarkan
dalam keadaan
tidak terisi
(kosong)
Username :
(disabled)
Nama :
(data)
Email :
(data)
Telepon :
(data)
Foto :
(data)
Alamat :
(data)
Klik Simpan
Sistem akan
menerima
akses ubah
data
pengguna
member
Sesuai
Harapan Valid
3) Pengujian terhadap buku tamu
107
Tabel IV.35
Pengujian Black Box Testing Buku Tamu
No. Skenario
Pengujian
Test Case Hasil yang
diharapkan
Hasil
Pengujian
Kesimpulan
1. Nama tidak
diisi, dan
mengisikan
email, website
dan konten
Nama :
(kosong)
Email :
yunda@gmail.
com
Website :
yunda.blogspot
.com
Konten :
(uraian)
Klik Simpan
Sistem akan
menolak
penambahan
komentar
dengan
menampilkan
pesan * Nama
belum diisi
pada nama
Sesuai
Harapan Valid
2. Mengisikan
nama, email,
website dan
konten namun
penulisan
email dengan
format yang
salah
Nama :
Ayunda
Email :
yunda.com
Website :
yunda.blogspot
.com
Konten :
(uraian)
Klik Simpan
Sistem akan
menolak
penambahan
komentar
dengan
menampilkan
pesan *Email
tidak valid
pada email
Sesuai
Harapan Valid
3. Klik menu
buku tamu.
Isikan nama,
email, website,
konten
Nama :
Ayunda
Email :
yunda@gmail.
com
Website :
yunda.blogspot
.com
Konten :
(uraian)
Klik Simpan
Sistem
menerima
penambahan
komentar
dengan
menampilkan
komentar di
daftar
komentar
Sesuai
Harapan Valid
4) Pengujian terhadap konfirmasi pembayaran
Tabel IV.36
Pengujian Black Box Testing Konfirmasi Pembayaran
No. Skenario
Pengujian
Test Case Hasil yang
diharapkan
Hasil
Pengujian
Kesimpulan
108
1. Nama tidak
diisi, dan
mengisikan
email, jumlah
transfer dan
keterangan
Nama :
(kosong)
Email :
yunda@gmail.
com
Jumlah
Transfer :
100,000
Keterangan:
(uraian)
Klik Simpan
Sistem akan
menolak
penambahan
konfirmasi
dengan
menampilkan
pesan * Nama
belum diisi
pada nama
Sesuai
Harapan Valid
2. Klik menu
konfirmasi
pembayaran.
Isikan nama,
email, jumlah
transfer,
keterangan
Nama :
Ayunda
Email :
yunda@gmail.
com
Jumlah
Transfer :
100,000
Keterangan :
(uraian)
Klik Simpan
Sistem
menerima
penambahan
konfirmasi
dengan
menampilkan
konfirmasi di
daftar
konfirmasi
Sesuai
Harapan Valid
4.5 Support
Fungsi tahapan support ini sebagai pendukung sistem penjualan berbasis web
pada kelompok usaha Jati Husada Mulya. Sistem yang telah dibangun dapat terus
berjalan dengan baik melalui dukungan software dan hardware yang sesuai dengan
kebutuhan sistem.
4.5.1 Publikasi Web
Setelah tahap perancangan web selesai, menandakan web sudah dapat
digunakan dengan baik. Namun hal yang paling penting dari membangun sebuah
web adalah mengupayakan agar semua orang dapat mengakses web dan
memperkenalkan usaha Jati Husada Mulya secara meluas. Publikasi web atau yang
sering dikenal dengan hosting, menggunakan media internet sebagai perantaranya.
Berikut ini langkah-langkah dalam menghosting web, antara lain:
109
a. Begitu banyak layanan penyedia server website, baik yang tidak berbayar
maupun berbayar. Penulis memilih pada sebuah situs bernama hosteko.com.
Langkah pertama yang dilakukan adalah mengakses halaman tersebut. Lalu
setelah muncul beranda, pilih paket hosting yang diinginkan.
Sumber: Hosteko.com
Gambar IV.67
Pilih Paket Hosting
b. Penulis memilih paket hosting US. Selanjutnya memilih salah satu paket
hosting yang diinginkan.
c. Setelah menentukan paket hosting, lalu klik tombol order sehingga muncul
halaman seperti di bawah ini.
Sumber: Hosteko.com
Gambar IV.68
Memasukkan Nama Domain
110
d. Masukkan nama domain pada kolom pencarian domain lalu klik tombol Klik
untuk melanjutkan. Bila nama domain yang sudah ditulis tersedia, klik lagi
tombol Klik untuk melanjutkan. Namun bila nama domain yang dimasukkan
tidak tersedia atau sudah dimiliki orang lain, masukkan nama domain lain
hingga status domain tersedia.
e. Setelah itu, pilih siklus penagihan dan klik tombol Order.
Sumber: Hosteko.com
Gambar IV.69
Siklus Penagihan Situs Domain
f. Atur konfirgurasi domain dan masukkan nama server yang diinginkan. Lalu
klik tombol Perbaharui keranjang.
g. Cek kembali data order. Bila telah sesuai, klik tombol Selesai.
h. Lalu kita akan diarahkan pada laman registrasi hosteko.com, klik tombol
Login bila sudah memiliki akun.
i. Setelah berhasil login, pilih metode pembayaran dan setujui syarat dan
ketentuan. Lalu klik tombol Selesai pemesanan.
j. Setelah tahap ini selesai, proses selanjutnya adalah melakukan pembayaran.
Setelah membayar, pihak hosteko.com akan mengaktivasi domain dan
hosting yang sudah kita order. Kita akan mendapatkan informasi melalui
email atau sms berupa username dan password untuk login ke cpanel.
111
k. Cpanel adalah laman pribadi untuk mengatur segala kepentingan pada
website yang ingin kita online-kan. Seperti mengupload file atau script
website.
l. Setelah login pada cpanel hosting, pilih menu Files lalu pilih File Manager.
Sumber: Hosteko.com
Gambar IV.70
Menu Files Pada Cpanel Hosting
m. Pilih domain yang telah kita buat pada Document Root For : lalu klik tombol
Go.
n. Pastikan upload file di dalam folder public_html.
Sumber: Hosteko.com
Gambar IV.71
Cara Upload File Website Pada Cpanel
o. Tools yang berada di atas, dapat digunakan sesuai fungsinya masing-masing.
Bila ingin upload files pilih menu Upload. Sebelum upload, jika files dalam
jumlah banyak, compress terlebih dahulu hingga files berbentuk .zip.
112
p. Semua proses telah selesai, website Jati Husada Mulya sudah dapat diakses
menggunakan internet dengan menuliskan alamat ini pada browser
http://www.jatihusadamulya.top.
4.5.2 Spesifikasi Hardware dan Software
Berikut ini adalah spesifikasi perangkat keras dan perangkat lunak yang
dibutuhkan dan digunakan dalam pembuatan website Jati Husada Mulya adalah
sebagai berikut:
Tabel IV.37
Spesifikasi Hardware dan Software
Kebutuhan Keterangan
Sistem Operasi Windows 8.1 64-bit Single Language
Processor AMD A8-6410 APU AMD Radeon R5 Graphics
RAM 4,00 GB
Monitor Monitor LCD 14”
Keyboard Qwerty Standard, 108 key
Printer Canon PIXMA MP 287
Mouse Standard
Browser Google Chrome, Mozilla Firefox
Software
a. Website Editor: Notepad++, Adobe Dreamweaver
CS6
b. Web Server: XAMPP Control Panel Version 3.2.1
c. Database: phpMyAdmin
d. Bahasa Script: PHP, HTML. Java Script, CSS,
jQuery
e. Design: CorelDraw X5, Adobe Photoshop CS6
4.6 Spesifikasi Dokumen Usulan
Spesifikasi dokumen usulan adalah sekumpulan dari bentuk dokumen
masukan yang mendukung terbentuknya data-data yang diusulkan penulis agar
mendapatkan informasi yang ditampilkan.
113
b. Nama Dokumen : Form Buku Tamu
Fungsi : Sebagai halaman untuk menyampaikan pesan
Sumber : User
Tujuan : Admin
Media : Tampilan
Frekuensi : Setiap user mengisikan laman buku tamu
Format : User Interface Gambar IV.24
c. Nama Dokumen : Form Registrasi Member
Fungsi : Sebagai halaman untuk daftar menjadi member
Sumber : User
Tujuan : Admin
Media : Tampilan
Frekuensi : Setiap user mengisikan laman registrasi
Format : User Interface Gambar IV.27
d. Nama Dokumen : Form Login Member
Fungsi : Sebagai halaman untuk masuk ke ruang member
Sumber : Member
Tujuan : Admin
Media : Tampilan
Frekuensi : Setiap member yang akan masuk ke ruang member
Format : User Interface Gambar IV.28
e. Nama Dokumen : Form Konfirmasi Pembayaran
Fungsi : Sebagai halaman untuk konfirmasi pembayaran
Sumber : Member
114
Tujuan : Admin
Media : Tampilan
Frekuensi : Setiap member yang melakukan konfirmasi
Format : User Interface Gambar IV.34
f. Nama Dokumen : Form Keranjang Belanja
Fungsi : Sebagai halaman untuk menampilkan produk yang
akan dibeli oleh member
Sumber : Member
Tujuan : Admin
Media : Tampilan
Frekuensi : Setiap member melakukan pemesanan produk
Format : User Interface Gambar IV.32
g. Nama Dokumen : Struk Pemesanan
Fungsi : Sebagai bukti pemesanan produk
Sumber : Member
Tujuan : Admin
Media : Tampilan / Kertas
Frekuensi : Setiap terdapat transaksi pemesanan produk
Format : Lampiran B.1
h. Nama Dokumen : Laporan Penjualan
Fungsi : Sebagai bukti laporan penjualan produk
Sumber : Admin
Tujuan : Pemilik
Media : Tampilan
115
Frekuensi : Setiap mengontrol penjualan
Format : User Interface Gambar IV.42 – 45