BAB III

METODOLOGI PENELITIAN

3.1 Tempat dan Waktu Penelitian

Tempat penelitian ini dilakukan di kantor utama UD. Bali
Nirvana Computer yang beralamatkan di jalan Diponegoro No.136,
pertokoan RTC Lt.1 No.48 Denpasar, Bali.

3.2 Metode Pengumpulan Data

Untuk mendukung dan memperoleh data-data yang diperlukan
dalam pembuatan laporam ini, maka digunakan metode pengumpulan
data sebagai berikut:

3.2.1 Data Primer

Sumber data primer pada laporan ini menggunakan dua (2)
metode yaitu
1. Wawancara, yaitu melakukan pengamatan dengan teknik
verbal dengan sumber terkait. Wawancara yang pertama
dilakukan oleh peneliti kepada Komang Adi Wibawa selaku
Kepala toko UD. Bali Nirvana Computer. Adapun hasil yang
didapat yaitu banyaknya kesalahan-kesalahan pencatatan yang
sering terjadi pada saat pencatatan pemesanan barang secara
manual. Kesalahan tersebut salah satunya adalah hilangnya
kertas catatan pesanan oleh pelanggan yang datang ke toko,
kemudian lupa mencatat pesanan pelanggan yang menghubungi
toko via telepon, dan email pemesanan yang tidak di baca oleh
admin.
2. Observasi, yaitu melakukan pengamatan secara langsung.
Adapun hal yang diamati di UD. Bali Nirvana Computer adalah
mulai dari proses pencatatan pembelian dan pemesanan barang
pelanggan yang masih dicatat pada nota tulis tangan. Dari
pengamatan tersebut peneliti memperoleh hasil yaitu belum
adanya sistem untuk mempermudah proses pemesanan barang
dari pelanggan karena semua masih secara manual
pencatatannya..

3.2.2 Data Sekunder

Sumber data sekunder pada penelitian ini menggunakan teknik
sebagai berikut:

27
 1. Dokumentasi, yaitu melakukan dokumentasi berupa memotret
proses pemesanan barang yang dilakukan oleh admin di UD.
Bali Nirvana Computer.
2. Studi Literatur, yaitu Studi literatur yang digunakan pada
penelitian ini adalah karya-karya ilmiah, buku-buku dan
literature internet yang memiliki hubungan dengan e-
commerce, perancangan sistem, dan metode pengujian sistem.

3.3 Analisis Sistem

Tahap analisis akan dilakukan untuk mengumpulkan data yang
dibutuhkan dalam penelitian. Tahap ini bertujuan untuk memperoleh
informasi mengenai harapan dari pengguna sistem yang akan
dikembangkan.

3.3.1 Elemen Sistem

Pada E-Commerce UD. Bali Nirvana Computer terdapat 3
elemen yang berperan dalam berjalannya sistem. Elemen-elemen yang
terdapat pada sistem ini adalah :
1. Admin
2. Pelanggan

3.3.2 Interaksi Antar Elemen

Interaksi/proses kerja yang dilakukan oleh E-Commerce UD.
Bali Nirvana Computer adalah :
1. Admin
Admin bertugas mengelola data pemesanan barang dari
pelanggan, mengecek ketersediaan barang, memvalidasi dan
memberikan feedback barang yang di pesan kepada pelanggan.
2. Pelanggan
Pelanggan adalah seseorang yang memesan barang kepada
admin berupa form pemesanan.

3.4 Analisis Kebutuhan

Terdapat dua analisis kebutuhan yaitu kebutuhan fungsional
yang berhubungan dengan internal sistem dan kebutuhan non fungsional
yang berada diluar sistem.

3.4.1 Kebutuhan Fungsional

1. Adanya fungsi keamanan untuk memproteksi sistem yaitu
proses login untuk pengguna yang harus memasukkan
password berdasarkan otoritas pengguna.
28
 2. Aplikasi mampu mengelola data master yaitu, data barang, data
admin, dan data pelanggan.
3. Aplikasi mampu memproses dan menampilkan laporan data
pemesanan barang serta laporan data pelanggan.
4. Aplikasi mampu menampilkan informasi log barang.

3.4.2 Kebutuhan Non Fungsional

1. Perangkat lunak yang mendukung dalam pengembangan sistem
yaitu :
a. SublimeText3
b. XAMPP v3.2.2
c. SQLyog
d. Power Designer16.5
e. Framework Laravel 5.2
2. Perangkat keras yang mendukung sistem yang dibutuhkan
dengan spesifikasi sebagai berikut :
a. Processor Core i3 3120Ghz
b. Memory Samsung 4Gb
c. Harddisk Toshiba 500Gb
d. VGA Nvidia Geforce GT720
e. LCD Slim 14”

3.5 Statement Of Purpose (SOP)

E-commerce dirancang untuk dapat melakukan pemesanan
barang dari pelanggan ke UD. Bali Nirvana Computer. Pelanggan dapat
memesan barang dengan cara membuat akun di website pemesanan
barang kemudian menginputkan orderan pemesanan. Setelah itu pesanan
akan diproses sampai divalidasi oleh admin. Setelah divalidasi, admin
akan memberikan verifikasi pesanan melalui email yang sudah
didaftarkan pelanggan, serta jumlah tagihan yang perlu dibayar. Website
ini juga dapat mengelola data admin, data barang dan data pelanggan
serta membuat laporan pemesanan barang.

3.6 Use Case Diagram

Use Case Diagram E-Commerce UD. Bali Nirvana Computer
ini dapat dilihat pada gambar 3.1. Use Case Diagram ini memiliki dua
(2) aktor, yaitu admin dan pelanggan serta memiliki delapan (8) use
case, yaitu login, mengelola data admin, mengelola data pelanggan,
mengelola data user, mengelola data barang, mengelola data merk,
mengelola data kategori, mengelola data pemesanan barang, dan
mengelola laporan.
29
 E-Commerce UD. Bali Nirvana Computer

<< include >> Tambah Data

Laporan Admin
Pelanggan << include >>
Ubah Data Admin

Laporan Penjualan
<< include >>
<< include >> Reset Password
Admin
<< include >>
Laporan Barang << include >> Tambah Data
Admin : 2 << include >>
Terlaris Barang

<< include >>

Laporan Barang << include >> Ubah Data Barang
Jarang Laku

<< include >> Cari Data Barang

Register
Pelanggan << include >> Login

Ubah Data
Pelanggan
<< include >> << include >> Admin : 1
Tambah Kategori

Tambah Rating << include >>

Ubah Kategori
<< include >>
<< include >>
Pelanggan Tambah Komentar

Tambah Merk
Tambah Data << include >> << include >>
Pemesanan
<< include >> Ubah Merk

<< include >>

<< include >>
<< include >> Verifikasi Pesanan

Pembayaran
Checkput

Gambar 3.1 Use Case Diagram E-Commerce Bali Nirvana

Computer

3.6.1 Use Case Narrative

Use case narrative menggambarkan bagaimana pengguna
berinteraksi dengan sistem. Use case narative merupakan deskripsi
tekstual tentang kejadian bisnis dan bagaimana pengguna akan
berinteraksi dengan sistem untuk menyelesaikan tugas. Berikut adalah
use case narrative yang terdapat pada e-commerce UD. Bali Nirvana
Computer.
1. Use Case Narrative Login
Tabel 3.1 Use Case Narrative Login
Nama Use Login
Case
Aktor Utama Admin, Pelanggan
Deskripsi Menggambarkan proses login ke dalam sistem yang
dapat dilakukan oleh admin dan pelanggan.
Normal Flow 1. Pelanggan / admin membuka halaman login.
of Event 2. Memasukkan username dan password.
3. Menekan tombol login.
4. Sistem mencocokkan username dan password yang
diinputkan dengan yang ada di database.
5. Jika cocok maka login sukses, jika tidak cocok
maka diberi info login gagal karena username dan
password tidak cocok.

30
 2. Use Case Narrative Reset Password
Tabel 3.2 Use Case Narrative Reset Password
Nama Use Reset Password
Case
Aktor Utama Admin, Pelanggan
Deskripsi Menggambarkan proses reset password ke dalam
sistem yang dapat dilakukan oleh admin dan
pelanggan.
Normal Flow 1. Pelanggan / admin membuka halaman reset
of Event password.
2. Memasukkan email pertama kali mendaftar.
3. Menekan tombol reset password.
4. Sistem akan mengirimkan link reset password
melalui email.
5. Klik link reset password di email.
6. Masukkan password dan password confirm baru
untuk disimpan.
7. Sistem akan melakukan pengecekan inputan.
8. Jika data valid maka password baru akan disimpan
ke dalam database, jika tidak valid maka terdapat
field yang tidak cocok.

3. Use Case Narrative Tambah Data Barang

Tabel 3.3 Use Case Narrative Tambah Data Barang
Nama Use Tambah Data Barang
Case
Aktor Utama Admin
Deskripsi Menggambarkan proses tambah data barang ke dalam
sistem yang dapat dilakukan oleh admin.
Normal Flow 1. Admin membuka halaman index data barang.
of Event 2. Menekan tombol tambah.
3. Masukkan semua field yang terdapat pada halaman
tambah data barang.
4. Menekan tombol simpan.
5. Sistem akan melakukan pengecekan inputan.
6. Jika valid maka data barang akan di simpan
didalam database, jika tidak valid maka akan
diberikan info tambah data barang gagal karena ada
beberapa field tidak terisi atau tidak valid.

31
 4. Use Case Narrative Ubah Data Barang
Tabel 3.4 Use Case Narrative Ubah Data Barang
Nama Use Ubah Data Barang
Case
Aktor Utama Admin
Deskripsi Menggambarkan proses ubah data barang ke dalam
sistem yang dapat dilakukan oleh admin.
Normal Flow 1. Admin membuka halaman index data barang.
of Event 2. Menekan tombol ubah.
3. Input field ingin dirubah.
4. Menekan tombol simpan.
5. Sistem akan melakukan pengecekan inputan.
6. Jika valid maka data barang akan di simpan
didalam database, jika tidak valid maka akan
diberikan info ubah data barang gagal karena ada
beberapa field tidak terisi atau tidak valid.

5. Use Case Narrative Cari Data Barang

Tabel 3.5 Use Case Narrative Cari Data Barang
Nama Use Cari Data Barang
Case
Aktor Utama Admin
Deskripsi Menggambarkan proses cari data barang ke dalam
sistem yang dapat dilakukan oleh admin.
Normal Flow 1. Admin membuka halaman index data barang.
of Event 2. Menginputkan kata kunci pada field pencarian
barang.
3. Menekan tombol cari.
4. Sistem akan melakukan pengecekan inputan.
5. Jika kata kunci yang di inputkan valid, maka sistem
akan memunculkan data yang di cari, jika tidak
kata kunci tidak valid maka akan diberikan info
kata kunci yang dicari tidak ditemukan.

6. Use Case Narrative Tambah Data Kategori

Tabel 3.6 Use Case Narrative Tambah Data Kategori
Nama Use Tambah Data Kategori
Case
Aktor Utama Admin

32
Deskripsi Menggambarkan proses tambah data kategori ke
dalam sistem yang dapat dilakukan oleh admin.
Normal Flow 1. Admin membuka halaman index data kategori.
of Event 2. Menekan tombol tambah.
3. Masukkan semua field yang terdapat pada halaman
tambah data kategori.
4. Menekan tombol simpan.
5. Sistem akan melakukan pengecekan inputan.
6. Jika valid maka data kategori akan di simpan
didalam database, jika tidak valid maka akan
diberikan info tambah data kategori gagal karena
ada beberapa field tidak terisi atau tidak valid.

7. Use Case Narrative Ubah Data Kategori

Tabel 3.7 Use Case Narrative Ubah Data Kategori
Nama Use Ubah Data Kategori
Case
Aktor Utama Admin
Deskripsi Menggambarkan proses ubah data kategori ke dalam
sistem yang dapat dilakukan oleh admin.
Normal Flow 1. Admin membuka halaman index data kategori.
of Event 2. Menekan tombol ubah.
3. Input field ingin dirubah.
4. Menekan tombol simpan.
5. Sistem akan melakukan pengecekan inputan.
6. Jika valid maka data kategori akan di simpan
didalam database, jika tidak valid maka akan
diberikan info ubah data kategori gagal karena ada
beberapa field tidak terisi atau tidak valid.

8. Use Case Narrative Tambah Data Merk

Tabel 3.8 Use Case Narrative Tambah Data Merk
Nama Use Tambah Data Merk
Case
Aktor Utama Admin

Deskripsi Menggambarkan proses tambah data merk ke dalam

sistem yang dapat dilakukan oleh admin.
Normal Flow 1. Admin membuka halaman index data merk.
of Event 2. Menekan tombol tambah.

33
 3. Masukkan semua field yang terdapat pada halaman
tambah data merk.
4. Menekan tombol simpan.
5. Sistem akan melakukan pengecekan inputan.
6. Jika valid maka data merk akan di simpan didalam
database, jika tidak valid maka akan diberikan info
tambah data merk gagal karena ada beberapa field
tidak terisi atau tidak valid.

9. Use Case Narrative Ubah Data Merk

Tabel 3.9 Use Case Narrative Ubah Data Merk
Nama Use Ubah Data Merk
Case
Aktor Utama Admin
Deskripsi Menggambarkan proses ubah data merk ke dalam
sistem yang dapat dilakukan oleh admin.
Normal Flow 1. Admin membuka halaman index data merk.
of Event 2. Menekan tombol ubah.
3. Input field ingin dirubah.
4. Menekan tombol simpan.
5. Sistem akan melakukan pengecekan inputan.
6. Jika valid maka data merk akan di simpan didalam
database, jika tidak valid maka akan diberikan info
ubah data merk gagal karena ada beberapa field
tidak terisi atau tidak valid.

10. Use Case Narrative Tambah Data Admin

Tabel 3.10 Use Case Narrative Tambah Data Admin
Nama Use Tambah Data Admin
Case
Aktor Utama Admin

Deskripsi Menggambarkan proses tambah data admin ke dalam

sistem yang dapat dilakukan oleh admin.
Normal Flow 1. Admin membuka halaman index data admin.
of Event 2. Menekan tombol tambah.
3. Masukkan semua field yang terdapat pada halaman
tambah data admin.
4. Menekan tombol simpan.
5. Sistem akan melakukan pengecekan inputan.

34
 6. Jika valid maka data admin akan di simpan didalam
database, jika tidak valid maka akan diberikan info
tambah data admin gagal karena ada beberapa field
tidak terisi atau tidak valid.

11. Use Case Narrative Ubah Data Admin

Tabel 3.11 Use Case Narrative Ubah Data Admin
Nama Use Ubah Data Admin
Case
Aktor Utama Admin
Deskripsi Menggambarkan proses ubah data admin ke dalam
sistem yang dapat dilakukan oleh admin.
Normal Flow 1. Admin membuka halaman index data admin.
of Event 2. Menekan tombol ubah.
3. Input field ingin dirubah.
4. Menekan tombol simpan.
5. Sistem akan melakukan pengecekan inputan.
6. Jika valid maka data admin akan di simpan didalam
database, jika tidak valid maka akan diberikan info
ubah data admin gagal karena ada beberapa field
tidak terisi atau tidak valid.

12. Use Case Narrative Register Pelanggan

Tabel 3.12 Use Case Narrative Register Pelanggan
Nama Use Register Pelanggan
Case
Aktor Utama Pelanggan

Deskripsi Menggambarkan proses register data pelanggan ke

dalam sistem yang hanya dapat dilakukan oleh
pelanggan.
Normal Flow 1. Pelanggan membuka halaman register pelanggan.
of Event 2. Masukkan field-field yang tertera pada form
register pelanggan.
3. Menekan tombol simpan.
4. Sistem mencocokkan data yang telah di inputkan.
5. Jika cocok maka data akan disimpan ke dalam
database, jika tidak maka akan diberikan info
register gagal karena ada field yang tidak valid.

35
 13. Use Case Narrative Ubah Data Pelanggan
Tabel 3.13 Use Case Narrative Ubah Data Pelanggan
Nama Use Ubah Data Pelanggan
Case
Aktor Utama Pelanggan

Deskripsi Menggambarkan proses ubah data pelanggan yang ke

dalam sistem yang hanya dapat dilakukan oleh
pelanggan.
Normal Flow 1. Pelanggan membuka halaman ubah data pelanggan.
of Event 2. Masukkan field-field yang tertera pada form ubah
data pelanggan.
3. Menekan tombol simpan.
4. Sistem mencocokkan data yang telah di inputkan.
5. Jika cocok maka data akan disimpan ke dalam
database, jika tidak maka akan diberikan info
register gagal karena ada field yang tidak valid.

14. Use Case Narrative Tambah Komentar

Tabel 3.14 Use Case Narrative Tambah Komentar
Nama Use Tambah Komentar
Case
Aktor Utama Pelanggan

Deskripsi Menggambarkan proses tambah komentar ke dalam

sistem yang hanya dapat dilakukan oleh pelanggan.
Normal Flow 1. Pelanggan memilih barang yang akan diberikan
of Event komentar.
2. Inputkan komentar.
3. Menekan tombol simpan.
4. Sistem akan pengecekan inputan dan akan
menyimpan ke dalam database.

15. Use Case Narrative Tambah Rating

Tabel 3.15 Use Case Narrative Tambah Rating
Nama Use Tambah Rating
Case
Aktor Utama Pelanggan

36
Deskripsi Menggambarkan proses tambah rating ke dalam
sistem yang hanya dapat dilakukan oleh pelanggan.
Normal Flow 1. Pelanggan membuka halaman data barang di
of Event halaman front end.
2. Menekan gambar bintang pada bagian bawah
deskripsi barang.
3. Sistem akan pengecekan inputan dan menyimpan
data tambah rating pada database.

16. Use Case Narrative Tambah Data Pemesanan

Tabel 3.16 Use Case Narrative Tambah Data Pemesanan
Nama Use Tambah Data Pemesanan
Case
Aktor Utama Pelanggan

Deskripsi Menggambarkan proses tambah data pemesanan ke

dalam sistem yang hanya dapat dilakukan oleh
pelanggan.
Normal Flow 1. Pelanggan membuka halaman pengunjung.
of Event 2. Memilih barang yang ingin dipesan.
3. Sistem akan memproses inputan dan akan disimpan
ke dalam database.
4. Sistem akan mengarahkan ke halaman keranjang
belanja.

17. Use Case Narrative Checkout

Tabel 3.17 Use Case Narrative Checkout
Nama Use Checkout
Case
Aktor Utama Pelanggan

Deskripsi Menggambarkan proses checkout, yaitu setelah

melakukan proses pemesanan barang ke dalam sistem
yang hanya dapat dilakukan oleh pelanggan.

37
Normal Flow 1. Menekan tombol submit pada keranjang belanja.
of Event 2. Sistem akan mevalidasi inputan dan mengarahkan
ke halaman checkout.
3. Masukkan catatan pembelian.
4. Sistem memproses inputan catatan pembelian dan
menyimpan ke dalam database.

18. Use Case Narrative Pembayaran

Tabel 3.18 Use Case Narrative Pembayaran
Nama Use Pembayaran
Case
Aktor Utama Pelanggan

Deskripsi Menggambarkan proses pembayaran, yaitu setelah

melakukan proses pemesanan barang dan checkout ke
dalam sistem yang hanya dapat dilakukan oleh
pelanggan.
Normal Flow 1. Menekan tombol bayar pada halaman checkout
of Event 2. Sistem akan mevalidasi inputan dan mengarahkan
ke halaman pembayaran.
3. Upload bukti transfer.
4. Sistem memproses inputan bukti transfer,
5. Jika data yang di upload valid maka sistem akan
menyimpan data bukti transfer ke database, jika
tidak valid maka akan diberikan info upload gagal.

19. Use Case Narrative Verifikasi Pemesanan

Tabel 3.19 Use Case Narrative Verifikasi Pemesanan
Nama Use Verifikasi Pemesanan
Case
Aktor Utama Admin
Deskripsi Menggambarkan proses verifikasi pemesanan yang
sudah dilakukan pelanggan ke dalam sistem yang
hanya dapat dilakukan oleh admin.

38
Normal Flow 1. Masuk ke halaman data order.
of Event 2. Menekan tombol detail order pada halaman data
order.
3. Sistem akan menampilkan data detail order.
4. Menekan tombol verify untuk memverifikasi
pemesanan.
5. Sistem memproses data inputan, melakukan ubah
status pemesanan pada data order pelanggan, dan
mengurangi stok pada database.

20. Use Case Narrative Laporan Pelanggan

Tabel 3.20 Use Case Narrative Laporan Pelanggan
Nama Use Laporan Pelanggan
Case
Aktor Utama Admin

Deskripsi Menggambarkan proses laporan pelanggan ke dalam

sistem yang hanya dapat dilakukan oleh admin
Normal Flow 1. Masuk ke halaman data laporan.
of Event 2. Menekan tombol laporan pelanggan
3. Sistem akan menampilkan data laporan pelanggan.
4. Menekan tombol cetak.
5. Sistem akan menampilkan preview laporan
pelanggan.

21. Use Case Narrative Laporan Penjualan

Tabel 3.21 Use Case Narrative Laporan Penjualan
Nama Use Laporan Penjualan
Case
Aktor Utama Admin
Deskripsi Menggambarkan proses laporan penjualan ke dalam
sistem yang hanya dapat dilakukan oleh admin
Normal Flow 1. Masuk ke halaman data laporan.
of Event 2. Menekan tombol laporan penjualan.
3. Sistem akan menampilkan data laporan penjualan.
4. Input range tanggal laporan penjualan yang ingin
dilihat dan dicetak.
5. Sistem akan menampilkan laporan penjualan sesuai

39
 inputan tanggal.
6. Menekan tombol cetak.
7. Sistem akan menampilkan preview laporan
penjualan.

22. Use Case Narrative Laporan Barang Terlaris

Tabel 3.22 Use Case Narrative Laporan Barang Terlaris
Nama Use Laporan Barang Terlaris
Case
Aktor Utama Admin
Deskripsi Menggambarkan proses laporan barang terlaris ke
dalam sistem yang hanya dapat dilakukan oleh admin
Normal Flow 1. Masuk ke halaman data laporan.
of Event 2. Menekan tombol laporan barang terlaris.
3. Sistem akan menampilkan data laporan barang
terlaris.
4. Input bulan apa untuk menampilkan laporan barang
terlaris.
5. Sistem akan menampilkan laporan barang terlaris
sesuai bulan yang diinputkan.
6. Menekan tombol cetak.
7. Sistem akan menampilkan preview laporan barang
terlaris.

23. Use Case Narrative Laporan Barang Jarang Laku

Tabel 3.23 Use Case Narrative Laporan Barang Jarang Laku
Nama Use Laporan Barang Jarang Laku
Case
Aktor Utama Admin
Deskripsi Menggambarkan proses laporan barang terlaris ke
dalam sistem yang hanya dapat dilakukan oleh admin

40
Normal Flow 1. Masuk ke halaman data laporan.
of Event 2. Menekan tombol laporan barang jarang laku.
3. Sistem akan menampilkan data laporan jarang laku.
4. Input bulan apa untuk menampilkan laporan barang
jarang laku.
5. Sistem akan menampilkan laporan barang jarang
laku sesuai bulan yang diinputkan.
6. Menekan tombol cetak.
7. Sistem akan menampilkan preview laporan barang
jarang laku.

3.7 Activity Diagram

Activity Diagram memberikan penggambaran visual dari aliran
kegiatan, baik dalam sistem, bisnis, alur kerja, atau proses lainnya.
Berikut adalah activity diagram yang terdapat pada e-commerce UD.
Bali Nirvana Computer.

3.7.1 Activity Diagram Login Admin

Admin Sistem Web Database

Masuk Ke Halaman Login Menampilkan Form Login

Admin Admin

Input Username &

Password

Kirim Username & Password Validasi Username &

Password

Mengecek Username &

Password

Data Tidak
Ada

Data Ada

Menampilkan Form Menu

Utama

Gambar 3.2 Activity Diagram Login Admin

41
 Pada activity diagram login admin, langkah awal adalah admin
harus masuk ke halaman menu login. Setelah masuk maka admin
diharuskan menginputkan username dan password yang mereka miliki.
Kemudian sistem akan melakukan proses validasi dan pengambilan data
di database, jika username dan password yang diinputkan valid, maka
akan diarahkan ke menu utama halaman admin. Sedangkan jika tidak
sesuai maka admin akan diarahkan kembali ke halaman login untuk
menginputkan ulang username dan passwordnya. Activity diagram login
admin dapat dilihat pada gambar 3.2.

3.7.2 Activity Diagram Reset Password Admin

Pada gambar 3.3 menunjukan Activity Diagram pada proses reset
password admin. Pertama admin memilih halaman reset password
admin, kemudian dapat langsung meninputkan password dan password
confirm baru. Sistem akan memproses data kemudian akan melakukan
update pada database.
Admin Sistem Web Database

Menampilkan Form Reset

Masuk Ke Halaman Reset
Password Admin Password Admin

Input Password dan

Password Confirm

Kirim Password & Password

Update Data Admin
Confirm

Menampilkan Form Data

Admin

Gambar 3.3 Activity Diagram Reset Password Admin

3.7.3 Activity Diagram Tambah Data Admin

Pada proses tambah data admin, pertama admin memilih menu
tambah admin, maka sistem akan mengarahkan ke halaman tambah data
admin. Setelah itu admin menginputkan data admin baru yang kemudian
sistem akan melakukan enkripsi atau menambahkan data admin baru dan
akan disimpan ke database. Setelah sukses maka sistem akan
menampilkan kembali halaman data admin.

42
 Admin Sistem Web Database

Memilih Menu Tambah Menampilkan Form Tambah

Admin Data Admin

Mengisi Data Admin Baru

Membuat Data Admin Baru Menyimpan Data Admin

Menampilkan Form Data

Admin

Gambar 3.4 Activity Diagram Tambah Data Admin

3.7.4 Activity Diagram Ubah Data Admin

Untuk dapat melakukan ubah data admin, pertama admin
memilih dahulu halaman data admin, kemudian pilih data mana yang
akan diubah. Setelah dipilih maka inputkan data yang akan diubah,
sistem akan memproses perubahan data tersebut dan akan melakukan
proses update data pada database. Setelah sukses maka sistem akan
menampilkan halaman data admin. Proses ubah data admin dapat dilihat
pada gambar 3.5.
Admin Sistem Web Database

Memilih Menu Ubah Data Menampilkan Form Ubah Data

Admin Admin

Mengisi Perubahan Data

Admin

Memproses Perubahan Data

Update Data Admin
Admin

Menampilkan Form Data

Admin

Gambar 3.5 Activity Diagram Ubah Data Admin

43
3.7.5 Activity Diagram Tambah Data Barang
Pada proses tambah data barang, pertama admin memilih menu
tambah barang, maka sistem akan mengarahkan ke halaman tambah data
barang. Setelah itu admin menginputkan data barang baru yang
kemudian sistem akan melakukan enkripsi atau menambahkan data
barang baru dan akan disimpan ke database. Setelah sukses maka sistem
akan menampilkan kembali halaman data barang.
Admin Sistem Web Database

Memilih Menu Tambah Menampilkan Form Tambah

Barang Data Barang

Mengisi Data Barang Baru

Membuat Data Barang Baru Menyimpan Data Barang

Menampilkan Form Data

Barang

Gambar 3.6 Activity Diagram Tambah Data Barang

3.7.6 Activity Diagram Ubah Data Barang

Admin Sistem Web Database

Memilih Menu Ubah Data Menampilkan Form Ubah Data

Barang Barang

Mengisi Perubahan Data

Barang

Memproses Perubahan Data Update Data Barang

Barang

Menampilkan Form Data

Barang

Gambar 3.7 Activity Diagram Ubah Data Barang

44
 Untuk dapat melakukan ubah data barang, pertama admin
memilih dahulu halaman data barang, kemudian pilih data mana yang
akan diubah. Setelah dipilih maka inputkan data yang akan diubah,
sistem akan memproses perubahan data tersebut dan akan melakukan
proses update data pada database. Setelah sukses maka sistem akan
menampilkan halaman data barang. Proses ubah data barang dapat
dilihat pada gambar 3.7.

3.7.7 Activity Diagram Cari Data Barang

Pada proses pencarian data barang, dilakukan dengan mengisi
pencarian pada halaman data barang. Sistem akan membaca inputan dan
mengecek di database, jika inputan valid maka akan menampilkan hasil
inputan, jika tidak valid maka isi kembali data pencariannya.
Admin Sistem Web Database

Mengisi Pencarian Data

Membaca Inputan Pencarian Validasi Kata Pencarian
Merk

Mengecek Inputan Pencarian

Data Tidak
Ada

Data Ada

Menampilkan Data Hasil

Pencarian

Gambar 3.8 Activity Diagram Cari Data Barang

3.7.8 Activity Diagram Tambah Data Kategori

Pada proses tambah data kategori, pertama admin memilih
menu tambah kategori, maka sistem akan mengarahkan ke halaman
tambah data kategori. Setelah itu admin menginputkan data kategori
baru yang kemudian sistem akan melakukan enkripsi atau
menambahkan data kategori baru dan akan disimpan ke database.
Setelah sukses maka sistem akan menampilkan kembali halaman data
kategori.

45
 Admin Sistem Web Database

Memilih Menu Tambah Menampilkan Form Tambah

Kategori Data Kategori

Mengisi Data Kategori

Baru

Membuat Data Kategori Baru Menyimpan Data Kategori

Menampilkan Form Data

Kategori

Gambar 3.9 Activity Diagram Tambah Data Kategori

3.7.9 Activity Diagram Ubah Data Kategori

Untuk dapat melakukan ubah data kategori, pertama admin
memilih dahulu halaman data kategori, kemudian pilih data mana yang
akan diubah. Setelah dipilih maka inputkan data yang akan diubah,
sistem akan memproses perubahan data tersebut dan akan melakukan
proses update data pada database. Setelah sukses maka sistem akan
menampilkan halaman data kategori. Proses ubah data barang dapat
dilihat pada gambar 3.10.
Admin Sistem Web Database

Memilih Menu Ubah Data Menampilkan Form Ubah Data

Kategori Kategori

Mengisi Perubahan Data

Kategori

Memproses Perubahan Data

Update Data Kategori
Kategori

Menampilkan Form Data

Kategori

Gambar 3.10 Activity Diagram Ubah Data Kategori

46
3.7.10 Activity Diagram Tambah Data Merk
Pada proses tambah data merk, pertama admin memilih menu
tambah merk, maka sistem akan mengarahkan ke halaman tambah data
merk. Setelah itu admin menginputkan data merk baru yang kemudian
sistem akan melakukan enkripsi atau menambahkan data merk baru dan
akan disimpan ke database. Setelah sukses maka sistem akan
menampilkan kembali halaman data merk.
Admin Sistem Web Database

Memilih Menu Tambah Menampilkan Form Tambah

Merk Data Merk

Mengisi Data Merk Baru

Membuat Data Merk Baru Menyimpan Data Merk

Menampilkan Form Data Merk

Gambar 3.11 Activity Diagram Tambah Data Merk

3.7.11 Activity Diagram Ubah Data Merk

Admin Sistem Web Database

Memilih Menu Ubah Data Menampilkan Form Ubah Data

Merk Merk

Mengisi Data Merk Yang

Diubah

Membuat Data Merk Yang Update Data Merk

Diubah

Menampilkan Form Data Merk

Gambar 3.12 Activity Diagram Ubah Data Merk

47
 Untuk dapat melakukan ubah data merk, pertama admin
memilih dahulu halaman data merk, kemudian pilih data mana yang
akan diubah. Setelah dipilih maka inputkan data yang akan diubah,
sistem akan memproses perubahan data tersebut dan akan melakukan
proses update data pada database. Setelah sukses maka sistem akan
menampilkan halaman data merk. Proses ubah data barang dapat dilihat
pada gambar 3.12.

3.7.12 Activity Diagram Mengelola Komentar

Pada proses mengelola komentar dapat dilakukan oleh
pelanggan dengan menginputkan pada form komentar pada halaman
detail barang. Selanjutnya komentar tersebut akan disimpan ke
database, lalu di filter oleh admin yang mana yang akan dipublikasi
secara manual.
Pelanggan Si stem Web Admin Database

Memi li h Menu Detail Barang

Menampilkan Form Detail

Barang

Input Komentar

Memproses Komentar Menyimpan Komentar

Memfilter Komentar

Menampil kan Komentar Publish Komentar

Gambar 3.13 Activity Diagram Mengelola Komentar

3.7.13 Activity Diagram Mengelola Rating

Dalam mengelola data rating, dapat dilakukan dengan
menginputkan atau memilih tanda bintang pada barang oleh pelanggan,
kemudian sistem akan memproses inputan dan akan disimpan di dalam
database.

48
 Pelanggan Sistem Web Database

Memproses Inputan Rating Menyimpan Rating

Input Rating Pada Barang

Menampilkan Rating Barang

Gambar 3.14 Activity Diagram Mengelola Rating

3.7.14 Activity Diagram Login Pelanggan

Pelanggan Sistem Web Database

Masuk Ke Halaman Login Menampilkan Form Login

Pegunjung Pengunjung

Input Username &

Password

Validasi Username &

Kirim Username & Password Password

Mengecek Username &

Password

Data Tidak
Ada

Data Ada

Menampilkan Beranda
Website

Gambar 3.15 Activity Diagram Login Pelanggan

Untuk dapat melakukan transaksi pembelian, hendaknya

pelanggan melakukan login dahulu ke sistem. Untuk dapat login,
pelanggan dapat masuk ke menu login pada halaman beranda website,
selanjutnya inputkan username dan password yang valid. Jika valid
maka akan langsung redirect ke halaman beranda, sedangkan jika tidak
49
valid, maka lakukan penginputan ulang. Proses login pelanggan dapat
dilihat pada gambar 3.15.

3.7.15 Activity Diagram Register Pelanggan

Jika pelanggan belum memiliki akun, dapat melakukan register
dahulu. Pelanggan harus menginputkan data yang valid, kemudian data
tersebut diproses oleh sistem dan disimpan dalam database. Terakhir
sistem akan langsung redirect ke halaman beranda. Proses register
pelanggan dapat dilihat pada gambar 3.16.
Pelanggan Sistem Web Database

Masuk Ke Halaman Menampilkan Form Register

Register Pengunjung Pengunjung

Mengisi Data Pelanggan

Baru

Membuat Data Pelanggan Menyimpan Data Pelanggan

Baru

Menampilkan Beranda
Website

Gambar 3.16 Activity Diagram Register Pelanggan

3.7.16 Activity Diagram Reset Password Pelanggan

Pel anggan Si stem Web

Masuk Ke Hal aman Reset M enampi l kan Form Reset

Password Pel anggan Password Admin

Input Em ai l Val i d

Ki ri m Password Baru Lewat

Emai l

Gambar 3.17 Activity Diagram Reset Password Pelanggan

50
 Pada gambar 3.17 menunjukan Activity Diagram pada proses
reset password pelanggan. Pertama pelanggan memilih halaman reset
password admin, kemudian pelanggan diharuskan menginputkan email
pertama yang didaftarkan saat register. Setelah itu sistem akan mengirim
password baru pada email yang sudah diinputkan.

3.7.17 Activity Diagram Ubah Data Pelanggan

Untuk dapat melakukan ubah data pelanggan, pertama
pelanggan memilih dahulu halaman ubah data pelanggan. Setelah dipilih
maka inputkan data yang akan diubah, sistem akan memproses
perubahan data tersebut dan akan melakukan proses update data pada
database. Setelah sukses maka sistem akan menampilkan halaman
beranda. Proses ubah data pelanggan dapat dilihat pada gambar 3.18.
Pelanggan Sistem Web Database

Memilih Menu Ubah Data Menampilkan Form Ubah Data

Pelanggan Pelanggan

Mengisi Perubahan Data

Pelanggan

Memproses Perubahan Data

Pelanggan Update Data Pelanggan

Menampilkan Beranda
Website

Gambar 3.18 Activity Diagram Ubah Data Pelanggan

3.7.18 Activity Diagram Tambah Data Pemesanan

Pada proses tambah data pemesanan, pertama pelanggan harus
memilih dahulu barang mana yang ingin di pesan. Setelah dipesan maka
akan disimpan sementara di dalam keranjang belanja. Setelah memilih
barang, tentukan jumlah pembeliannya. Sistem akan memproses inputan
jumlah pembelian dan disimpan ke dalam database. Proses tambah data
pemesanan dapat dilihat pada gambar 3.19.

51
 Pelanggan Sistem Web Database

Memilih Barang Yang

Akan Dipesan

Mengarahkan Ke Form
Keranjang Belanja

Input Jumlah Pembelian

Menambahkan Jumlah
Menyimpan Data Pemesanan
Pembelian

Gambar 3.19 Activity Diagram Tambah Data Pemesanan

3.7.19 Activity Diagram Checkout

Setelah melakukan submit pada halaman keranjang belanja
maka sistem akan mengarahkan ke halaman checkout. Pada tampilan
halaman checkout, pelanggan diharapkan menginputkan catatan
pembelian dan sistem akan langsung menambahkan catatan yang di
inputkan.
Pel anggan Si stem Web

Kl i k Subm i t P ada Form Menampl i kan Hal am an

Keranj ang Bel anj a Checkout

Input Catatan P embel ian

M enambahkan Catatan

Gambar 3.20 Activity Diagram Checkout

3.7.20 Activity Diagram Pembayaran

Tahap terakhir dalam transaksi pemesanan adalah melakukan
pembayaran dan upload bukti transfer. Saat pelanggan mengklik bayar,
sistem akan mengarahkan ke halaman upload bukti transfer. Untuk
mempercepat proses pemesanan, pelanggan diharuskan mengupload
bukti transfer. Selanjutnya sistem akan mengirimpkan data bukti transfer
52
dan disimpan ke database. Setelah sukses sistem langsung redirect ke
halaman akun saya.
Pelanggan Sistem Web Database

Menamplikan Halaman
Klik Metode Pembayaran
Metode Pembayaran
Pada Form Checkout

Klik Bayar

Menampilkan Halaman
Upload Bukti T ransfer

Upload Bukti Transfer

Memproses Upload Bukti

Menyimpan Bukti Transfer
Transfer

Menampilkan Halaman Akun

Saya

Gambar 3.21 Activity Diagram Pembayaran

3.7.21 Activity Diagram Verifikasi Data Pemesanan

Pada proses verifikasi data pemesanan, pertama admin
memilih menu data pemesaan, lalu sistem akan memproses data pesanan
yang ada, mengambil data di database dan menampilkan data
pemesanan yang ada. Kemudian admin mengecek bukti transfer dari
pelanggan secara manual. Jika bukti tidak valid maka pemesanan tidak
akan di proses. Sedangkan jika valid, maka admin akan melakukan
verifikasi pemesanan yang diproses oleh sistem dan akan disimpan di
database. Setelah sukses maka sistem akan mengubah status pemesanan
lalu menampilkan data pemesanan serta memberikan info status
pemesanan ke pelanggan. Proses verifikasi data pemesanan dapat dilihat
ada gambar 3.22.

53
 Admin Sistem Web Database Pelanggan

Memilih Menu Data Memproses Data

Select Data Pemesanan
Pemesanan Pemesanan

Menampilkan Menu Data

Cek Bukti Transfer Pemesanan

Belum

Sudah

Memproses Verifikasi
Verifikasi Pemesanan Simpan Data Pemesanan
Pemesanan

Mengubah Status
Pemesanan

Menampilkan Form Data Info Status Pemesanan

Pemesanan

Gambar 3.22 Activity Diagram Verifikasi Data Pemesanan

3.7.22 Activity Diagram Laporan Pemesanan Barang

Admin Sistem Web Database

Memilih Menu Laporan Menampilkan Menu Laporan

Memilih Menu Laporan

Pemesanan Barang

Menampilkan Form Laporan

Pemesanan Barang

Memproses Periode Select Data Pemesanan,

Input Periode Laporan Pengambilan Data Data Barang, Data Merk,
Data Kategori

Menampilkan Laporan
Pemesanan Barang

Gambar 3.23 Activity Diagram Laporan Pemesanan Barang

54
 Pada proses laporan pemesanan barang, pertama pemilik
memilih menu laporan. Setelah memilih menu laporan maka sistem akan
menampilkan menu laporan yang ada. Kemudian pilih menu laporan
pemesanan barang maka sistem otomatis mengarahkan ke halaman
laporan pemesanan barang. Untuk menampilkan data yang ada,
dilakukan dengan menginputkan berupa periodenya. Pemilik perusahaan
dapat memilih berdasarkan periode awal dan akhir, jika sudah
diinputkan sistem akan memproses data dan melakukan pengambilan
data pada database. Setelah sukses barulah sistem menampilkan laporan
pemesanan barang tersebut. Proses laporan pemesanan barang dapat
dilihat pada gambar 3.23.

3.7.23 Activity Diagram Laporan Pelanggan

Pada proses laporan pelanggan, pertama pemilik memilih menu
laporan. Setelah memilih menu laporan maka sistem akan menampilkan
menu laporan yang ada. Kemudian pilih menu laporan pelanggan, maka
sistem akan menampilkan halaman laporan pelanggan dengan
mengambil data dari database. Setelah sukses sistem menampilkan
laporan pelanggan.
Admin Sistem Web Database

Memili h Menu Laporan Menampi lkan Menu Laporan

Memili h Menu Laporan

Pelanggan

Mengambi l Data Dari

Select Data Pelanggan
Database

Menampilkan Laporan
Pelanggan

Gambar 3.24 Activity Diagram Laporan Pelanggan

3.7.24 Activity Diagram Laporan Barang Terlaris

Pada proses laporan barang terlaris, pertama pemilik memilih
menu laporan. Setelah memilih menu laporan maka sistem akan
menampilkan menu laporan yang ada. Kemudian pilih menu laporan
barang terlaris, maka sistem otomatis mengarahkan ke halaman laporan
barang terlaris. Untuk menampilkan data yang ada, dilakukan dengan
55
menginputkan berupa periodenya. Pemilik perusahaan dapat memilih
berdasarkan per bulan, jika sudah diinputkan sistem akan memproses
data dan melakukan pengambilan data pada database. Setelah sukses
barulah sistem menampilkan laporan barang terlaris tersebut.
Admin Si stem Web Database

Memilih Menu Laporan Menampilkan Menu Laporan

Memilih Menu Laporan

Barang T erlaris
Menampilkan Form Laporan
Barang Terlaris

Input Periode Laporan

Select Data Pemesanan,

Memproses Periode
Data Barang, Data Merk,
Pengambi lan Data
Data Kategori

Menampil kan Laporan

Barang Terlaris

Gambar 3.25 Activity Diagram Laporan Barang Terlaris

3.7.25 Activity Diagram Laporan Barang Jarang Laku

Admin Sistem Web Database

Memilih Menu Laporan Menampilkan Menu Laporan

Memilih Menu Laporan

Barang Jarang Laku

Menampilkan Form Laporan

Input Periode Laporan Barang Jarang Laku

Select Data Pemesanan,

Memproses Periode
Data Barang, Data Merk,
Pengambilan Data
Data Kategori

Menampilkan Laporan
Barang Jarang Laku

Gambar 3.26 Activity Diagram Laporan Barang Jarang Laku

56
 Pada proses laporan barang terlaris, pertama pemilik memilih
menu laporan. Setelah memilih menu laporan maka sistem akan
menampilkan menu laporan yang ada. Kemudian pilih menu laporan
barang jarang laku, maka sistem otomatis mengarahkan ke halaman
laporan barang jarang laku. Untuk menampilkan data yang ada,
dilakukan dengan menginputkan berupa periodenya. Pemilik perusahaan
dapat memilih berdasarkan per bulan, jika sudah diinputkan sistem akan
memproses data dan melakukan pengambilan data pada database.
Setelah sukses barulah sistem menampilkan laporan barang jarang aku
tersebut. Proses laporan barang jarang laku dapat dilihat pada gambar
3.26.

3.8 Sequence Diagram

Sequence diagram adalah sebuah diagram yang menggambar-
kan interaksi dari antar objek yang ada pada suatu event (kejadian) dan
dimodelkan dalam urutan sekuensial. Berikut adalah sequence diagram
yang terdapat pada e-commerce UD. Bali Nirvana Computer.

3.8.1 Sequence Diagram Login Admin

Pada proses login admin, tahap pertama adalah admin harus
menginputkan username dan password pada form login. Setelah
penginputan akan ada proses login checker dan pengambilan data dari
tabel user, dimana setelah pengambilan data sistem akan melakukan
validasi, jika valid maka akan redirect ke form menu utama, jika gagal
akan ada notifikasi error pada form login.
SequenceDiagram_1

Form Login Login Checker T abel User Form Menu Utama

Admin

1: Input Username & Password

2: Set Username Password
3: Ambil Username Password

4: Data Admin

5: Validasi

alt Sukses
6: Redirect

Gagal
7: Notifikasi Pesan Error

Gambar 3.27 Sequence Diagram Login Admin

57
3.8.2 Sequence Diagram Reset Password Admin
Pada proses reset password admin, pertama yang dilakukan
adalah memilih id admin yang akan diubah di form index admin, setelah
dipilih, maka sistem akan mengecek datanya yang diambil dari tabel
user, lalu akan mengirimkan notifikasi ke form reset password admin.
Setelah menampilkan form reset password admin, admin dapat
menginputkan username dan password baru pada form reset password
admin, dimana akan ada proses validasi di sistem, jika data valid akan
disimpan di dalam tabel user, terakhir mengirimkan notifikasi ke form
reset password admin dan ke actor.
SequenceDiagram_1

Index Admin Form Reset Password Admin Proses Reset Password Tabel User

Admin
1: Select Id Admin
2: Checking Data
3: Cek Data Admin

4: Kirim Data Admin

5: Notifikasi Data Admin
6: Hasil

7: Input Username & Password

8: Set Username & Password

9: Validasi

opt [Data Valid]

11: Notifikasi Data Reset 10: Simpan Data

12: Notifikasi

Gambar 3.28 Sequence Diagram Reset Password Admin

3.8.3 Sequence Diagram Tambah Data Admin

Pada proses tambah data admin, pertama yang dilakukan adalah
admin menginputkan data admin pada form tambah data admin, setelah
menambahkan, sistem akan memasukkan dan memvalidasi data, jika
valid maka langsung simpan data ke dalam tabel admin. Setelah sukses,
maka sistem akan memberikan notifikasi ke form tambah admin dan
form ke actor.

58
SequenceDiagram_1

T ambah Admi n Proses Data T abel Admin

Admin
1: Input Data Admin
2: Set Data Admin

3: Validasi

opt [Data Valid]

4: Simpan Data

5: Konfirmasi

6: Konfirmasi

Gambar 3.29 Sequence Diagram Tambah Data Admin

3.8.4 Sequence Diagram Ubah Data Admin

Dalam proses mengubah data admin, harus dilakukan dengan
memilih terlebih dahulu id yang mana yang akan diubah. Setelah dipilih
dilakukan pengecekan di sistem dan pengambilan data di tabel admin
yang akan dikirimkan nantinya ke form ubah admin. Setelah
mendapatkan data, admin dapat langsung mengubah datanya pada form
ubah data admin. Saat mengirimkan perubahan data, sistem akan
melakukan proses validasi lagi, jika valid maka update tabel admin, lalu
sistem akan mengirimkan notifikasi ke form admin dan ke actor.
SequenceDiagram_1

Index Admi n Ubah Admin Proses Data T abel Adm in

Admi n
1: Sel ect Id Admi n
2: Checking Data
3: Cek Data Admin

4: Kirim Data Admin

5: Notifikasi Data Admi n

6: Hasi l
7: Ubah Data Admin
8: Set Data Adm in

9: Val idasi

opt [Data Val i d]

10: Update Data

11: Konfi rmasi

12: Konfirmasi

Gambar 3.30 Sequence Diagram Ubah Data Admin

59
3.8.5 Sequence Diagram Tambah Data Barang
Pada proses tambah data barang, pertama yang dilakukan
adalah admin menginputkan data barang pada form tambah data barang,
setelah menambahkan, sistem akan memasukkan dan memvalidasi data,
jika valid maka langsung simpan data ke dalam tabel barang. Setelah
sukses, maka sistem akan memberikan notifikasi ke form tambah barang
dan form ke actor.
Sequ ence Di ag ram_ 1

T a mb ah Barang Proses Da ta T a bel Baran g

Adm i n
1 : In put Da ta Barang
2 : Se t Data Barang

3: Val i dasi

opt [Da ta Val i d]

4: Si m pan Data

5: K onfi rm asi

6: Ko nfi rm asi

Gambar 3.31 Sequence Diagram Tambah Data Barang

3.8.6 Sequence Diagram Ubah Data Barang

SequenceDiagram_1

Index Barang Ubah Barang Proses Data Tabel Barang

Admin
1: Select Id Barang
2: Checking Data
3: Cek Data Barang

4: Kirim Data Barang

5: Notifikasi Data Barang

6: Hasil

7: Ubah Data Barang

8: Set Data Barang

9: Validasi

opt [Data Valid]

10: Update Data

11: Konfirmasi

12: Konfirmasi

Gambar 3.32 Sequence Diagram Ubah Data Barang

60
 Dalam proses mengubah data barang, harus dilakukan dengan
memilih terlebih dahulu id yang mana yang akan diubah. Setelah dipilih
dilakukan pengecekan di sistem dan pengambilan data di tabel barang
yang akan dikirimkan nantinya ke form ubah barang. Setelah
mendapatkan data, admin dapat langsung mengubah data barang pada
form ubah data barang. Saat mengirimkan perubahan data, sistem akan
melakukan proses validasi lagi, jika valid maka update tabel barang, lalu
sistem akan mengirimkan notifikasi ke form ubah barang dan ke actor.

3.8.7 Sequence Diagram Cari Data Barang

Pada proses pencarian data barang, dilakukan dengan
penginputan id barang dahulu. Setelah menginputkan sistem akan
melakukan pengecekan data dan pengambilan data di dalam tabel
barang. Jika data yang dicari tidak ditemukan, maka sistem akan
menampilkan pesan error bahwa id tidak ditemukan, sedangkan jika
ditemukan maka akan menampilkan data barang pada form index barang
serta notifikasi ke actor.
SequenceDiagram_1

Index Barang Retrive Data Barang T abel Barang

Admin

1: Input Id Barang 2: Checking Data

3: Select Data

alt T idak Valid 4: Kirim Pesan Error

5: Id T idak Ditemukan

Valid
6: Kirim Data Barang

7: Menampilkan Data Barang

8: Notifikasi Data Barang

Gambar 3.33 Sequence Diagram Cari Data Barang

3.8.8 Sequence Diagram Tambah Data Kategori

Pada proses tambah data kategori, pertama yang dilakukan
adalah admin menginputkan data kategori pada form tambah data
kategori, setelah menambahkan, sistem akan memasukkan dan
memvalidasi data, jika valid maka langsung simpan data ke dalam tabel
61
kategori. Setelah sukses, maka sistem akan memberikan notifikasi ke
form tambah kategori dan form ke actor.
SequenceDiagram_1

T ambah Kategori Proses Data T abel Kategori

Admin
1: Input Data Kategori
2: Set Data Kategori

3: Vali dasi

opt [Data Val id]

4: Simpan Data

5: Konfirmasi

6: Konfirmasi

Gambar 3.34 Sequence Diagram Tambah Data Kategori

3.8.9 Sequence Diagram Ubah Data Kategori

SequenceDiagram_1

Index Kategori Ubah Kategori Proses Data Tabel Kategori

Admin

1: Select Id Kategori
2: Checking Data
3: Cek Data Kategori

4: Kirim Data Kategori

5: Notifikasi Data Kategori

6: Hasil

7: Ubah Data Kategori

8: Set Data Kategori

9: Validasi

opt [Condition]
10: Update Data

11: Konfirmasi

12: Konfirmasi

Gambar 3.35 Sequence Diagram Ubah Data Kategori

62
 Dalam proses mengubah data kategori, harus dilakukan dengan
memilih terlebih dahulu id yang mana yang akan diubah. Setelah dipilih
dilakukan pengecekan di sistem dan pengambilan data di tabel kategori
yang akan dikirimkan nantinya ke form ubah kategori. Setelah
mendapatkan data, admin dapat langsung mengubah data kategori pada
form ubah data kategori. Saat mengirimkan perubahan data, sistem akan
melakukan proses validasi lagi, jika valid maka update tabel kategori,
lalu sistem akan mengirimkan notifikasi ke form ubah kategori dan ke
actor.

3.8.10 Sequence Diagram Tambah Data Merk

Pada proses tambah data merk, pertama yang dilakukan adalah
admin menginputkan data merk pada form tambah data merk, setelah
menambahkan, sistem akan memasukkan dan memvalidasi data, jika
valid maka langsung simpan data ke dalam tabel merk. Setelah sukses,
maka sistem akan memberikan notifikasi ke form tambah merk dan form
ke actor.
Sequ enceDi agram _1

T amba h Merk Proses Data T abe l M erk

Ad mi n

1: In put Da ta Me rk
2: Set Da ta Me rk

3 : Val i d asi

op t [Data Val i d]

4: Sim pan Data

5: Kon fi rmasi

6: K on fi rma si

Gambar 3.36 Sequence Diagram Tambah Data Merk

3.8.11 Sequence Diagram Ubah Data Merk

Dalam proses mengubah data merk, harus dilakukan dengan
memilih terlebih dahulu id yang mana yang akan diubah. Setelah dipilih
dilakukan pengecekan di sistem dan pengambilan data di tabel merk
yang akan dikirimkan nantinya ke form ubah merk. Setelah
mendapatkan data, admin dapat langsung mengubah data merk pada
form ubah data merk. Saat mengirimkan perubahan data, sistem akan
melakukan proses validasi lagi, jika valid maka update tabel merk, lalu
sistem akan mengirimkan notifikasi ke form ubah merk dan ke actor.

63
SequenceDiagram_1

Index Merk Ubah Merk Proses Data Tabel Merk

Admin

1: Select Id Merk
2: Checking Data
3: Cek Data Merk

4: Kirim Data Merk

5: Notifikasi Data Merk

6: Hasi l

7: Ubah Data Merk

8: Set Data Merk

9: Validasi

opt [Condi tion]

10: Update Data

11: Konfi rmasi

12: Konfirmasi

Gambar 3.37 Sequence Diagram Ubah Data Merk

3.8.12 Sequence Diagram Tambah Komentar

SequenceDiagram_1

List Barang Form Komentar Proses Data Tabel Barang

Pelanggan
1: Pilih Data Barang
2: Request Data Barang
3: Select Data Barang

4: Data Komentar
5: Noti fikasi Data Komentar

6: Input Komentar
7: Set Data Komentar

8: Validasi

opt [Data Valid]

9: Simpan Data

10: Notifikasi

11: Notifikasi

Gambar 3.38 Sequence Diagram Tambah Komentar

64
 Pada proses tambah data komentar dilakukan oleh data actor
pelanggan dimana pelanggan memilih data barang pada form list barang,
kemudian form akan meminta request pada sistem dan sistem akan
melakukan pengambilan barang ke tabel barang. Setelah mendapatkan
data barang, barulah pelanggan dapat menginputkan komentar pada
form komentar. Sistem akan melakukan validasi pada saat penginputan,
jika valid maka akan langsung menyimpan pada tabel barang dan akan
memberikan notifikasi pada form komentar dan pelanggan.

3.8.13 Sequence Diagram Rating

Pada proses tambah data rating dilakukan oleh data actor
pelanggan dimana pelanggan memilih data barang pada form list barang,
kemudian form akan meminta request pada sistem dan sistem akan
melakukan pengambilan barang ke tabel barang. Setelah mendapatkan
data barang, barulah pelanggan dapat menginputkan rating pada form
detail barang. Sistem akan melakukan validasi pada saat penginputan,
jika valid maka akan langsung menyimpan pada tabel barang dan akan
memberikan notifikasi pada detail barang dan pelanggan.
SequenceDiagram_1

Form Detail Barang Proses Data Tabel Barang

Pelanggan
1: Pilih Barang

2: Request Data Barang

3: Select Data Barang
5: Notifikasi
4: Data Barang

6: Input Rating

7: Set Data Rating

8: Validasi

opt [Data Valid]

11: Notifikasi 9: Simpan Data
10: Notifikasi

Gambar 3.39 Sequence Diagram Rating

65
3.8.14 Sequence Diagram Login Pelanggan
SequenceDiagram_1

Form Login Login Checker Tabel User Form Menu Utama

Pelanggan

1: Input Username & Password

2: Set Username Password
3: Ambil Username Password

4: Data Pelanggan

5: Validasi

alt Sukses
6: Redirect

Gagal
7: Notifikasi Pesan Error

Gambar 3.40 Sequence Diagram Login Pelanggan

Pada proses login pelanggn, tahap pertama adalah pelanggan

harus menginputkan username dan password pada form login. Setelah
penginputan akan ada proses login checker dan pengambilan data dari
tabel user, dimana setelah pengambilan data sistem akan melakukan
validasi, jika valid maka akan redirect ke form menu utama, jika gagal
akan ada notifikasi error pada form login.

3.8.15 Sequence Diagram Register Pelanggan

Pada proses register data pelanggan, pertama yang dilakukan
adalah pelanggan menginputkan data pelanggan pada form register data
pelanggan, setelah menambahkan, sistem akan memasukkan dan
memvalidasi data, jika valid maka langsung simpan data ke dalam tabel
pelanggan. Setelah sukses, maka sistem akan memberikan notifikasi ke
form tambah pelanggan dan form ke actor.

66
SequenceDi agram_1

T ambah Pel anggan Proses Data T abel Pelanggan

Pelanggan

1: Input Data Pel anggan

2: Set Data Pel anggan

3: Vali dasi

opt [Data Val i d]

4: Si mpan Data

5: Konfi rmasi

6: Konfirmasi

Gambar 3.41 Sequence Diagram Register Pelanggan

3.8.16 Sequence Diagram Reset Password Pelanggan

SequenceDiagram_1

Index Pelanggan Form Reset Password Pelanggan Proses Reset Password Tabel Pelanggan

Pelanggan

1: Select Id Pelanggan
2: Checking Data

3: Cek Data Pelanggan

4: Kirim Data Pelanggan

5: Notifikasi Data Pelanggan
6: Hasil

7: Input Username & Password

8: Set Username & Password

9: Validasi

opt [Data Valid]

10: Simpan Data

11: Notifikasi Data Reset

12: Notifikasi

Gambar 3.42 Sequence Diagram Reset Password Pelanggan

67
 Pada proses reset password pelanggan, pertama yang dilakukan
adalah memilih id pelanggan yang akan diubah di form index pelanggan,
setelah dipilih, maka sistem akan mengecek datanya yang diambil dari
tabel user, lalu akan mengirimkan notifikasi ke form reset password
pelanggan. Setelah menampilkan form reset password pelanggan,
pelanggan dapat menginputkan username dan password baru pada form
reset password pelanggan, dimana akan ada proses validasi di sistem,
jika data valid akan disimpan di dalam tabel user, terakhir mengirimkan
notifikasi ke form reset password pelanggan dan ke actor.

3.8.17 Sequence Diagram Ubah Data Pelanggan

SequenceDiagram_1

Ubah Pelanggan Proses Data Tabel Pelanggan

Pelanggan

1: Ubah Data Pelanggan

2: Set Data Pelanggan

3: Val idasi

opt [Data Valid]

4: Update Data

5: Konfirmasi

6: Konfirmasi

Gambar 3.43 Sequence Diagram Ubah Data Pelanggan

Dalam proses mengubah data, pelanggan dapat langsung

menginputkan perubahan data yang diinginkan. Saat mengirimkan
perubahan data, sistem akan melakukan proses validasi lagi, jika valid
maka update tabel pelanggan, lalu sistem akan mengirimkan notifikasi
ke form pelanggan dan ke actor.

3.8.18 Sequence Diagram Tambah Data Pemesanan

Pada proses tambah data pemesanan barang, pertama yang
dilakukan yaitu form pemesanan barang menampilkan atau melakukan
request data barang pada sistem, kemudian sistem akan meminta data
pada tabel barang dan akan dikembalikan lagi sampai form pemesanan
barang. Setelah mendapatkan list data barang, pelanggan baru dapat
68
menginputkan pemesanan. Setelah melakukan input pemesanan, sistem
akan melakukan menambahkan dan memvalidasi pesanan, jika data
valid maka akan disimpan ke tabel pemesanan, kemudian sistem akan
mendapat notifikasi.
SequenceDiagram_1

Form Pemesanan Barang Proses Pemesanan T abel Barang T abel Pemesanan

Pelanggan

1: Request Data Barang 2: Select Data Barang

3: Data Barang
4: List Data Barang

5: Input Data Pemesanan

6: Set Data Pemesanan

7: Validasi

opt [Data Valid]

8: Simpan Data Pemesanan

9: Notifikasi
10: Notifikasi

Gambar 3.44 Sequence Diagram Tambah Data Pemesanan

3.8.19 Sequence Diagram Checkout

SequenceDiagram_1

Form Checkout Proses Pemesanan Tabel Pemesanan Form Pembayaran

Pelanggan

1: Request Data Pemesanan 2: Select Data Pemesanan

3: Data Pemesanan
4: List Data Pemesanan

5: Input Catatan Pembelian

6: Set Catatan

7: Validasi

8: Notifikasi

9: Notifikasi

Gambar 3.45 Sequence Diagram Checkout

69
 Proses checkout adalah proses yang dilakukan setelah
menambahkan pemesanan barang. Form akan meminta pada sistem
menampilkan data pemesanan yang sesuai, kemudian mengharuskan
pelanggan dalam penginputan catatan pembelian. Sistem akan
memvalidasi dan menampilkan notifikasi ke form pembayaran dan
pelanggan

3.8.20 Sequence Diagram Pembayaran

SequenceDiagram_1

Form Pembayaran Form Bukti Transfer Proses Pembayaran Proses Bukti T ransfer T abel Pemesanan

Pel anggan

1: Pil ih Bayar
2: Set Data Pembayaran
3: Notifikasi
4: Noti fikasi

5: Upload Bukti Transfer

6: Set Bukti Transfer

7: Validasi

opt [Conditi on]

8: Simpan Data

9: Notifi kasi
10: Notifikasi

Gambar 3.46 Sequence Diagram Pembayaran

Tahap terakhir dalam transaksi pemesanan adalah melakukan

pembayaran dan upload bukti transfer. Saat pelanggan mengklik bayar
pada form pembayaran, sistem akan menambahkan proses pemesanan
dan memberikan notifikasi pemesanan. Untuk mempercepat proses
pemesanan, pelanggan dapat melakukan upload bukti transfer pada form
upload bukti transfer. Selanjutnya sistem akan mengirimkan data bukti
transfer dan disimpan ke tabel pemesanan. Setelah sukses sistem
mengirimkan notifikasi kepada form dan pelanggan.

3.8.21 Sequence Diagram Verifikasi Data Pemesanan

Pada proses verifikasi data pemesanan, pertama yang dilakukan
adalah mecari data pelanggan yang melakukan pemesanan barang. Form
akan meminta file data pelanggan pada sistem, kemudian sistem
meneruskan ke tabel pelanggan, setelah diambil maka dikirim ke sistem
dan sistem akan memberikan notifikasi ke form dan admin. Admin
70
kemudian melakukan verifikasi pemesanan, sistem akan melakukan
pengecekan data dan pengambilan data dari tabel pemesanan, jika data
tidak valid maka sistem akan mengirimkan pesan notifikasi belum
terverifikasi, jika data valid maka sistem akan mengubah pesan status
terverifikasi ke form data pemesanan.
SequenceDiagram_1

Form Data Pemesanan Proses Data Proses Verifikasi Pemesanan Tabel Pemesanan

Admin Pelanggan

1: Cek Bukti Transfer

2: Request Bukti Transfer
3: Select Bukti Transfer

4: Data Bukti TRansfer

5: Notifikasi
6: Notifikasi

7: Verifikasi Data Pemesanan

8: Checking Data
9: Select Data Pemesanan

alt Tidak Valid

10: Kirim Pesan Status
11: Notifikasi Status Belum Terverifikasi

Valid

12: Kirim Pesan Status

13: Notifikasi Status Tervierifikasi

14: Notifikasi Status Pemesanan

15: Notifikasi

Gambar 3.47 Sequence Diagram Verifikasi Data Pemesanan

3.8.22 Sequence Diagram Laporan Pemesanan Barang

Pada proses laporan pemesanan barang, pertama pemilik memilih
menu laporan pemesanan barang maka sistem otomatis mengarahkan ke
halaman laporan pemesanan barang. Untuk menampilkan data yang ada,
dilakukan dengan menginputkan berupa periodenya. Pemilik perusahaan
dapat memilih berdasarkan periode awal dan akhir, jika sudah
diinputkan sistem akan memproses data dan melakukan pengambilan
data pada tabel barang, tabel merk, tabel kategori, dan tabel pemesanan
barang. Setelah sukses barulah sistem menampilkan laporan pemesanan
barang tersebut.

71
SequenceDiagram_1

Form Laporan Penjualan Proses Data Tabel Barang Tabel Kategori Tabel Merk Tabel Pemesanan

Admin

1: Input Periode Laporan

2: Set Periode Laporan

3: Validasi

4: Request Data Barang

5: Data Barang
6: Request Data Kategori

7: Data Kategori

8: Request Data Merk

9: Data Merk

10: Request Data Pemesanan

11: Data Pemesanan

12: Menampilkan Laporan

13: Laporan Pemesanan Barang

Gambar 3.48 Sequence Diagram Laporan Pemesanan Barang

3.8.23 Sequence Diagram Laporan Pelanggan

Pada proses laporan pelanggan, pemilik pertama melakukan
input periode laporan, kemudian sistem akan melakukan validasi dan
akan melakukan pengambilan data pelanggan pada tabel pelanggan.
Terakhir tabel pelanggan akan memerikan data pelanggan dan
dikirimkan ke sistem yang akan ditampilkan pada form laporan
pelanggan.
SequenceDiagram_1

Form Laporan Pelanggan Proses Data Tabel Pelanggan

Admin
1: Input Periode Laporan
2: Set Periode Laporan

3: Validasi

4: Request Data Pelanggan

5: Data Pelanggan

6: Menampilkan Laporan
7: Laporan Pelanggan

Gambar 3.49 Sequence Diagram Laporan Pelanggan

72
3.8.24 Sequence Diagram Laporan Barang Terlaris
SequenceDiagram_1

Form Laporan Barang Terlaris Proses Data Tabel Barang Tabel Kategori Tabel Merk Tabel Pemesanan

Admin

1: Input Periode Laporan

2: Set Periode Laporan

3: Validasi

4: Request Data Barang

5: Data Barang
6: Request Data Kategori

7: Data Kategori

8: Request Data Merk

9: Data Merk

10: Request Data Pemesanan

11: Data Pemesanan

12: Menampilkan Laporan
13: Laporan Pemesanan Barang Terlaris

Gambar 3.50 Sequence Diagram Laporan Barang Terlaris

Pada proses laporan barang terlaris, pemilik pertama

melakukan input periode laporan, kemudian sistem akan melakukan
validasi dan akan melakukan pengambilan data barang terlaris pada
tabel barang, tabel merk, tabel kategori, dan tabel pemesanan. Terakhir
semua tabel akan memerikan data request yang diminta sistem dan
dikirimkan ke sistem yang akan ditampilkan pada form laporan barang
terlaris.

3.8.25 Sequence Diagram Laporan Barang Jarang Laku

SequenceDi agram_1

Form Laporan Barang Jarang Laku Proses Data Tabel Barang Tabel Kategori Tabel Merk Tabel Pemesanan

Admin

1: Input Peri ode Laporan

2: Set Periode Laporan

3: Val idasi

4: Request Data Barang

5: Data Barang

6: Request Data Kategori

7: Data Kategori

8: Request Data Merk

9: Data Merk

10: Request Data Pemesanan

11: Data Pemesanan

12: Menampilkan Laporan

13: Laporan Pemesanan Barang Jarang Laku

Gambar 3.51 Sequence Diagram Laporan Barang Jarang laku

73
 Pada proses laporan barang jarang laku, pemilik pertama
melakukan input periode laporan, kemudian sistem akan melakukan
validasi dan akan melakukan pengambilan data barang jarang laku pada
tabel barang, tabel merk, tabel kategori, dan tabel pemesanan. Terakhir
semua tabel akan memerikan data request yang diminta sistem dan
dikirimkan ke sistem yang akan ditampilkan pada form laporan barang
jarang laku.

3.9 Class Diagram

Class diagram pada E-Commerce UD. Bali Nirvana Computer
terdapat sembilan (9) class yang digunakan, antara lain pelanggan,
admin, user, barang, kategori, merk, komentar, pemesanan barang, dan
detail pemesanan. Pada setiap class memiliki beberapa method masing-
masing. Setiap class juga memiliki relasi dengan class lainnya sehingga
dapat saling terhubung dalam memanggil class lainnya ataupun
pengambilan data pada class lainnya. Berikut adalah class diagram e-
commerce UD. Bali Nirvana Computer digambarkan pada gambar 3.52.
User
Pelanggan
- Id_User : int Admin
- Id_Pelanggan : int
- Username : String - Id_Admin : int
- Nama_Pelanggan : String
- Password : String - Nama_Admin : String
- Telpon_Pelanggan : String 1..1 - Level : int 0..1 - Alamat_Admin : String
- Alamat_Pelanggan : String
+ Store () : void - Telpon_Admin : String
- Email_Peanggan : String 0..1 1..1 -
+ Update () : void Email_Admin : String
+ Index () : void
+ Reset () : void + Index () : void
+ Create () : void
+ getUsername () : String + Create () : void
+ Store () : void
+ getPassword () : String + Store () : void
+ Update () : void
+ Update () : void

1..1

Detail Barang
- Id_Detail : int Barang
- Qty : int - Id_Barang : String Komentar
- Harga : int - Nama_Barang : String - Id_Komentar : int
1..* + Index () : void 1..* - Stok_Barang : int - Komentar : String
+ Show () : void 1..1 - Harga_Barang : int - Created_At : Date
0..1
+ Shop () : void - Rating : int - Updated_At : Date
0..*
+ Checkout () : void + Index () : void
+ Index () : void
0..* 1..1 + getPemesanan () : String + Create () : void
+ Create () : void
1..* + Store () : void
+ Store () : void
+ Update () : void
Pemesanan Barang
- Id_Pemesanan : int
- Tgl_Pemesanan : Date 1..*
- Verify_At : Date
- Bukti_Pembayaran : String Merk 1..1
- Status_Pemesanan : String
- Id_Merk : int 1..1
+ Index () : void - Nama_Merk : String Kategori
+ Store () : void
+ Index () : void - Id_Kategori : int
+ Verify () : void
+ Create () : void - Nama_Kategori : String
+ getSave () : String
+ Store () : void
+ getBayar () : String + Index () : void
+ Update () : void
+ Create () : void
+ Store () : void
+ Update () : void

Gambar 3.52 Class Diagram E-Commerce Bali Nirvana Computer

74
3.10 Struktut Tabel
Pada hasil generate Physical Data Model maka mendapatkan
struktur tabel seperti berikut.
1. Tabel 3.24 Tabel Data Admin
Merupakan tabel yang dipergunakan untuk menampung admin
yang terdaftar dalam sistem.
Penjelasan Tabel Admin
Field Data Type Length Keterangan
Id_Admin Integer - Primary Key, untuk admin.
Nama_Admin Varchar 50 Untuk menyimpan nama
admin.
No_Tlp_Admin Varchar 13 Untuk menyimpan nomor
telepon admin.
Alamat_Admin Text - Untuk menyimpan alamat
admin.
Email_Admin Varchar 50 Untuk menyimpan email
admin.

2. Tabel 3.25 Tabel Barang

Merupakan tabel yang dipurgunakan untuk menampung data
barang yang terdaftar dalam sistem.
Penjelasan Tabel Barang
Field Data Type Length Keterangan
Kode_Barang Varchar 10 Primary Key, untuk setiap
data barang.
Id_Kategori Integer - Sebagai foreign key.
Id_Merk Integer - Sebagai foreign key.
Nama_Barang Varchar 100 Untuk menyimpan nama
barang.
Harga_Barang Integer - Untuk menyimpan harga
barang.
Stok_Barang Integer - Untuk menyimpan stok
barang.
Gambar Varchar 255 Untuk menyimpan gambar
barang.

Deskripsi Text - Untuk menyimpan deskripsi

barang.
Tampil Text - Untuk menyimpan detail
barang.

75
 Field Data Type Length Keterangan
Rating Integer - Untuk menyimpan rating
barang.

3. Tabel 3.26 Tabel Kategori

Merupakan tabel yang dipergunakan untuk menampung data
kategori barang yang terdaftar dalam sistem.
Penjelasan Tabel Kategori
Field Data Type Length Keterangan
Id_Kategori Integer - Primary Key, untuk setiap
kategori barang.
Nama_Kategori Varchar 50 Untuk menyimpan nama
kategori barang.

4. Tabel 3.27 Tabel Merk

Merupakan tabel yang dipergunakan untuk menampung data
kategori barang yang terdaftar dalam sistem.
Penjelasan Tabel Merk
Field Data Type Length Keterangan
Id_Merk Integer - Primary Key, untuk setiap
merk barang.
Nama_Merk Varchar 50 Untuk menyimpan nama
merk barang.

5. Tabel 3.28 Tabel User

Merupakan tabel yang dipergunakan untuk menampung data user
yang terdaftar di dalam sistem.
Penjelasan Tabel User
Field Data Type Length Keterangan
Id_User Integer - Primary Key, untuk setiap
tipe prosesor.
Nama_User Varchar 50 Untuk menyimpan nama
user.
Password Varchar 60 Untuk menyimpan password
user.
Email Integer - Untuk menyimpan email
user.
Level Integer - Untuk menyimpan level
user.

76
 Field Data Type Length Keterangan
Remember_Tok Varchar 60 Untuk menyimpan
en remember token user.
Created_At Timestamp - Untuk menyimpan
created_at.
Updated_At Timestamp - Untuk menyimpan
updated_at.
Usertable_Id Integer - Untuk menyimpan
usertable_id.
Usertable_Leve Varchar 20 Untuk menyimpan
l usertable_level.
Level Integer - Untuk menyimpan level.

6. Table 3.29 Tabel Pelanggan

Merupakan tabel yang dipergunakan untuk menampung
pelanggan yang terdaftar di dalam system.
Penjelasan Tabel Pelanggan
Field Data Length Keterangan
Type
Id_Pelanggan Integer - Primary Key, untuk setiap
data pelanggan.
Nama_Pelanggan Varchar 50 Untuk menyimpan nama
perusahaan.
Telpon_Pelanggan Varchar 13 Untuk menyimpan nomor
telepon pelanggan.

Alamat_Pelanggan Text - Untuk menyimpan alamat

pelanggan.

7. Tabel 3.30 Tabel Pemesanan Barang

Merupakan tabel yang dipergunakan untuk menampung data
pemesanan barang yang terdaftar dalam sistem.
Penjelasan Tabel Pemesanan Barang
Field Data Type Length Keterangan
Id_Pemesanan Varchar 10 Primary Key, untuk
setiap pemesanan
barang.
77
 Field Data Type Length Keterangan
Id_Pelanggan Integer - Sebagai foreign key.
Id_User Integer - Sebagai foreign key.
Id_Kota Integer - Sebagai foreign key.
Verify_At Timestamp - Untuk menyimpan
tanggal verifikasi.
Catatan Text - Untuk menyimpan
catatan.
Bukti_Pembayaran Varchar 50 Untuk menyimpan
bukti pembayaran.
Ongkir Integer - Untuk menyimpan
ongkir
Created_At Timestamp - Untuk menyimpan
created_at.
Updated_At Timestamp - Untuk menyimpan
updated_at.

8. Tabel 3.31 Tabel Detail Pemesanan Barang

Merupakan tabel yang dipergunakan untuk menampung data
detail pemesanan barang yang terdaftar dalam sistem.
Penjelasan Tabel Detail Pemesanan Barang
Field Data Type Length Keterangan
Id_Detail Integer - Primary Key, untuk setiap
detail barang.
Id_Pemesanan Varchar 10 Sebagai foregin key.
Id_Barang Varchar 20 Sebagai foreign key.
Qty Integer - Untuk menyimpan qty
pemesanan.

Harga_Barang Integer - Untuk menyimpan harga

barang.

9. Tabel 3.32 Tabel Komentar

Merupakan tabel yang dipergunakan untuk menampung data
detail pemesanan barang yang terdaftar dalam sistem.
Penjelasan Tabel Detail Pemesanan Barang
Field Data Type Length Keterangan
Id_Komentar Integer - Primary Key, untuk setiap
komentar.
Id_Barang Varchar 10 Sebagai foregin key.
78
 Field Data Type Length Keterangan
Id_Pelanggan Integer 20 Sebagai foreign key.
Komentar Text - Untuk menyimpan komentar

Created_At Timestamp - Untuk menyimpan created_at.

Updated_At Timestamp - Untuk menyimpan updated_at.

3.11 User Interface

Berikut ini perancangan user interface dari E-Commerce pada
UD. Bali Nirvana Computer. Merancang antarmuka merupakan bagian
yang penting dari merancang sistem. Biasanya hal tersebut juga
merupakan bagian yang cukup sulit, karena harus menerapkan apa yang
telah dibuat pada gambaran logical. Berikut adalah user interface
lengkapnya.

3.10.1 Halaman Back End

Halaman back end adalah halaman yang hanya dapat diakses
oleh administrator sistem.

1. Halaman Login Admin

Gambar 3.53 Halaman Login Admin

Merupakan halaman login admin. Pada halaman login, admin
harus memasukkan sesuai email dan password yang sesuai. Jika
lupa dengan password atau emailnya, dapat menggunakan fitur
lupa password yang telah disediakan. Tampilannya seperti
dibawah ini.

2. Halaman Beranda
79
 Jika login sukses maka akan diteruskan ke menu utama
halaman admin. Pada menu utama ini terlihat user mana yang
telah login. Pada halaman beranda admin terdapat beberapa menu
pengolahan data seperti data admin, data barang, data pesanan,
data merk, data kategori serta menu laporan yang dapat
menampilkan laporan pelanggan dan laporan pemesanan barang.
Terdapat juga menu logout yang terletak di kanan atas web.

Gambar 3.54 Halaman Beranda Admin

3. Halaman Data Barang

Masuk ke menu data barang, disini kita dapat menambahkan
data barang dan mengubahnya. Terdapat beberapa field yang
ditampilkan yaitu kode barang, merk, nama barang, stok, harga
barang, kategori. Untuk menambahkan barang dapat mengklik
tombol tambah di bawah tabel, maka akan di arahkan menuju
halaman tambah data barang. Untuk mengubah data barang, dapat
mengklik tombol ubah pada tiap – tiap barang yang ada maka
akan di arahkan langsung ke halaman ubah data barang.

80
 Gambar 3.55 Halaman Data Barang

4. Halaman Tambah Data Barang

Kemudian jika kita mengklik button tambah pada halaman
data barang, maka akan masuk ke halaman dibawah ini. Disini
tertera semua field yang terdapat dalam tabel barang di dalam
database, yaitu kode barang, merk barang, nama barang, stok
barang, harga barang, gambar, kategori, dan deskripsi dari barang
tersebut. Semua field harus terisi dan tidak boleh ada yang kosong.
Jika sudah mengisi dapat menekan tombol simpan dan kemudian
akan di arahkan ke menu utama data barang. Gambar dapat dilihat
dibawah ini.

Gambar 3.56 Halaman Tambah Data Barang

81
5. Halaman Ubah Data Barang
Selanjutnya ada halaman ubah data barang. Disini fieldnya
sama dengan tambah barang, hanya saja kode barang saja yang
tidak dapat dirubah karena merupakan primary key dari data barang
tersebut. Semua field juga harus di inputkan, tidak boleh ada yang
kosong. Jika sudah selesai menginputkan bisa mengklik tombol
simpan dan akan diarahkan langsung ke menu utama data barang.

Gambar 3.57 Halaman Ubah Data Barang

6. Halaman Data Merk

Gambar 3.58 Halaman Data Merk

82
 Pada halaman data merk, terdapat dua (2) field saja yaitu
kode merk dan nama merk. Merk yang dimaksud adalah merk dari
jenis barang yang dijual di e-commerce Bali Nirvana Computer.

7. Halaman Tambah Data Merk

Pada halaman tambah data merk, terdapat dua (2) field yaitu
kode merk sebagai primary key dan nama merk. Kedua field harus
terisi. Jika sudah bisa klik simpan dan di arahkan ke menu utama data
merk.

Gambar 3.59 Halaman Tambah Data Merk

8. Halaman Ubah Data Merk

Pada halaman ubah data merk, hanya nama merk yang dapat
dirubah, karena kode merk merupakan primary key dari tabel merk.

Gambar 3.60 Halaman Ubah Data Merk

83
9. Halaman Data Kategori
Pada halaman data merk, terdapat dua (2) field saja yaitu
kode kategori dan nama kategori. Kategori yang dimaksud adalah
jenis barang yang dijual di e-commerce Bali Nirvana Computer.

Gambar 3.61 Halaman Data Kategori

10. Halaman Tambah Data Kategori

Pada halaman tambah data kategori, terdapat dua (2) field
yaitu kode kategori sebagai primary key dan nama kategori. Kedua
field harus terisi. Jika sudah bisa klik simpan dan di arahkan ke menu
utama data kategori.

Gambar 3.62 Halaman Tambah Data Kategori

11. Halaman Ubah Data Kategori
84
 Pada halaman ubah data kategori, hanya nama kategori
yang dapat dirubah, karena kode kategori merupakan primary key
dari tabel kategori.

Gambar 3.63 Halaman Ubah Data Kategori

12. Halaman Data Admin

Jika ingin menampilkan, menambah, dan mengubah data
admin dapat dilakukan pada menu ini. Terdapat tiga field saja yang
ditampilkan yaitu kode admin, alamat admin dan telepon.

Gambar 3.64 Halaman Data Admin

13. Halaman Tambah Data Admin

85
 Pada menu tambah admin, masukkan nama admin, alamat
admin dan no telpon sedangkan kode admin karena auto increment
langsung dibuat secara otomatis. Berikut tampilannya.

Gambar 3.65 Halaman Tambah Data admin

14. Halaman Ubah Data Admin

Pada ubah data admin, kode admin tidak dapat diubah
karena merupakan primary key, sedangkan yang lainnya dapat di
ubah.

Gambar 3.66 Halaman Ubah Data Admin

15. Halaman Daftar Pesanan
86
 Proses pemesanan yang dilakukan oleh pelanggan akan
masuk ke menu daftar pesanan pada halaman admin. Disini admin
dapat melakukan verifikasi pada tiap pelanggan.

Gambar 3.67 Halaman Daftar Pesanan Barang

16. Halaman Detail Daftar Pesanan

Pada halaman detail pemesanan, dapat kita lihat melalui
mengklik tombol detail di halaman daftar pesanan barang pada tiap
transaksi. Setelah diklik maka akan tampil detail pesanan dari barang
yang sudah dibeli oleh pelanggan. Yang ditampilkan adalah nama
pelanggan, nama barang, qty, harga barang, total harga dan status
pembayaran yang berupa bukti slip transfer pembayaran barang. Jika
sudah sesuai dengan jumlah tagihan maka akan di verifikasi
langsung oleh admin.

Gambar 3.68 Halaman Detail Daftar Pesanan Barang

17. Halaman Laporan Pelanggan
87
 Pada laporan pelanggan berisi data – data pelanggan yang
sudah register pada website Bali Nirvana Computer. Isi tabel sama
dengan data pada tabel pelanggan di dalam database.

Gambar 3.69 Halaman Laporan Pelanggan

18. Halaman Laporan Pemesanan Barang

Pada laporan pemesanan barang, terdapat beberapa field
yang ditampilkan, yaitu kode barang, nama barang, nama
perusahaan, qty, harga dan total harga. Laporan pemesanan dapat
ditampilkan dengan memilih periode awal dan akhir dari tanggal
pemesanan, lalu mengklik tombol tampilkan. Maka akan muncul
transaksi yang terjadi antara periode yang di inputkan.

Gambar 3.70 Halaman Laporan Pemesanan Barang

19. Halaman Laporan Barang Terlaris
88
 Pada halaman laporan barang terlaris, admin dapat melihat
barang yang sering laris terjual sehingga memudahkan dalam
menjaga stok barang tetap ready.

Gambar 3.71 Halaman Laporan Barang Terlaris

20. Halaman Laporan Barang Jarang Laku

Pada halaman laporan barang jarang laku, admin dapat
melihat barang yang jarang terjual sehingga akan dikurangi
pembelian stoknya.

Gambar 3.72 Halaman Laporan Barang Jarang Terjual

89
 21. Halaman Reset Password Admin
Halaman ini adalah halaman reset password admin jika
admin lupa akan passwordnya sendiri. Password baru akan
dikirimkan melalui email yang diinputkan pertama kali oleh admin.

Gambar 3.73 Halaman Reset Password Admin

3.10.2 Halaman Front End

Halaman Front end adalah halaman yang dapat diakses oleh
administrator sistem dan juga pengunjung untuk dapat melakukan proses
pemesanan barang.

1. Halaman Utama Website

Pindah ke menu utama web pemesanan, dapat kita lihat
terdapat sebuah slider barang yang di filter berdasarkan kategori
barang yang paling populer, ada juga barang yang merupakan
barang hot feature dibawahnya. Ada juga menu login, produk dan
keranjang belanja, juga menu-menu barang seperti notebook,
printer, dan yang lainnya yang dijual disini. Terakhir ada fitur
search untuk memudahkan mencari barang yang diinginkan.
Berikut gambarannya.

90
 Gambar 3.74 Halaman Beranda Website

2. Halaman Register Website

Untuk dapat memesan barang, hendaknya harus melakukan
login terlebih dahulu. Sehingga dapat dicatat nama pemesannya dan
dapat melakukan proses verifikasi barang ready atau tidaknya.
Untuk proses cepatnya dapat langsung mengklik pilihan login diatas
kanan website. Jika kita tidak punya akun, ada juga pilihan di dalam
halaman login untuk membuat akun baru. Berikut data yang
diperlukan dapat dilihat pada gambar 3.75 bagian kanan gambar.

Gambar 3.75 Halaman Register Website

91
3. Halaman Reset Password Pelanggan
Halaman ini adalah halaman reset password pelanggan jika
pelanggan lupa akan passwordnya sendiri. Password baru akan
dikirimkan melalui email yang diinputkan pertama kali oleh
pelanggan.

Gambar 3.76 Halaman Reset Password Pelanggan

4. Halaman Login Website

Kemudian, jika telah mempunyai akun, maka langsung saja
melakukan proses login dengan menginputkan email dan password
yang valid. Jika berhasil maka langsung diarahkan kembali ke menu
utama website.

Gambar 3.77 Halaman Login Website

92
5. Halaman Utama Setelah Login
Setelah melakukan proses login, maka label login yang terdapat
diatas berubah menjadi akun saya yang menampilkan informasi dari
akun tersebut.

Gambar 3.78 Halaman Website Setelah Login

6. Halaman Menu Jenis Barang

Untuk dapat masuk ke menu jenis barang dapat memilih menu
yang tersedia di bawah header. Misalkan mencari menu notebook,
pilih menu notebook maka akan keluar pilihan kategori yang
tersedia. Selain itu juga terdapat beberapa filter yang memudahkan
dalam mengidentifikasi barang yang diinginkan sesuai brands.
Tidak lupa juga ada fitur pencariannya. Gambar dapat dilihat
dibawah ini.

Gambar 3.79 Halaman Menu Merk

93
7. Halaman Menu Produk
Tampilan pada menu produk hampir sama dengan menu merk.
Karena barang yang tampil di menu produk adalah semua barang.

Gambar 3.80 Halaman Menu Produk

8. Halaman Tentang Kami

Fitur selanjutnya adalah Tentang Kami (Contact) yang terletak
di header web. Pada menu ini dapat diketahui letak kantor pusat dari
Bali Nirvana Computer dan juga cabang-cabang yang ada di seluruh
Bali.

Gambar 3.81 Halaman Tentang Kami

94
9. Halaman Hasil Pencarian
Selain filter, ada juga fungsi pencarian dalam website ini.
Dengan menginputkan kata kunci yang benar pada textfield
searching maka akan menampilkan hasil dari pencarian tersebut.
Jika tidak ada maka juga aka nada feedback berupa pesan bahwa
barang yang dicari tidak ada. Berikut kedua tampilannya.

Gambar 3.82 Halaman Pencarian Terdapat Barang

Gambar 3.83 Halaman Pencarian Tidak Terdapat Barang

95
10. Halaman Detail Barang
Setelah memilih barang yang ingin dipesan, maka akan muncul
sebuah halaman baru yang menjelaskan secara detail dari notebook
tersebut. Terdapat juga pilihan komentar untuk menginputkan
komentar dan meihat komentar yang ada, dan rating, untuk
menginputkan rating untuk dapat ditampilkan pada web.

Gambar 3.84 Halaman Detail Pemesanan Barang

11. Halaman Keranjang Belanja

Barang-barang yang disudah dipesan akan masuk ke menu
keranjang belanja terlebih dahulu. Disini terlihat barang apa yang
dipesan, jumlah yang ingin dibeli dan harganya. Jika semua barang
sudah dipesan bisa mengklik button checkout dan akan muncul
pesan bahwa pesanan sudah dikirim dan akan diproses.

Gambar 3.85 Halaman Keranjang Belanja

96
12. Halaman Detail Pembelanjaan
Halaman ini merupakan terusan dari keranjang belanja. Pada
halaman ini tertera detail pembeli, ringkasan belanja, kurir
pengiriman dan catatan belanja. Setelah menginputkan semua maka
akan diarahkan ke halaman metode pembayaran.

Gambar 3.86 Halaman Detail Pembelanjaan

13. Halaman Metode Pembayaran

Halaman ini menambahkan interface metode pembayaran, yaitu
berupa transfer bank. Jika tidak melakukan pembayaran dalam 1x24
jam maka pesanan akan dianggap batal.

Gambar 3.87 Halaman Metode Pembayaran

97
14. Halaman Bukti Pembayaran
Pada halaman ini hanya menginputkan bukti transfer untuk
mempermudah proses admin dalam mencari data pembayaran yang
dilakukan pelanggan. Terdapat juga button upload yang akan
diarahkan ke halaman utama web.

Gambar 3.88 Halaman Bukti Pembayaran

15. Halaman Akun Saya

Pada halaman akun saya akan ditampilkan detail dari
pemesanan yang sudah dilakukan. Yang paling penting adalah
verifikasi bahwa barang yang dipesan sudah terverifikasi atau
belum. Gambar dapat dilihat dibawah ini.

Gambar 3.89 Halaman Akun Saya

98
3.11 Skenario Pengujian Sistem Black Box
Berikut adalah skenario Pengujian Sistem dengan metode Black
Box.
Tabel 3.32 Tabel Skenario Pengujian Sistem Black Box.
No Form Skenario Input Hasil yang
diharapkan
1. Login dan Pendaftaran Semua field Muncul pesan
Sign Up customer. pada form pendaftaran
Customer. terisi. sukses dan
masuk ke menu
utama.
Salah satu Muncul pesan
field kosong. error.
Melakukan Semua field Muncul pesan
login terpenuhi dan login sukses dan
customer. sesuai dengan masuk ke menu
data login. utama.
Username Muncul pesan
atau error.
password
salah.
2. Halaman Melihat detail Klik gambar Menuju ke
Utama. produk. produk yang halaman detail
terdapat pada produk.
menu utama.
3. Halaman Memasukkan Jumlah Muncul pesan
detail produk. jumlah produk produk yang error.
yang ingin ingin dibeli
dibeli. melebihi stok
produk yang
dijual,
Lanjut ke form Semua field Menuju ke
shopping cart terisi dan klik halaman
tombol add shopping cart.
to cart.

99
No Form Skenario Input Hasil yang
diharapkan
4. Halaman Menghapus Klik tombol Produk yang
Shopping data produk hapus pada dihapus akan
Cart. pesanan produk yang hilang dari list
pada ingin dihapus. shopping cart.
shopping
cart.
Lanjut ke Klik tombol Menuju ke
form checkout. halaman
checkout. checkout.
5. Halaman Mengecek Klik tombol Muncul daftar
Checkout. harga cek harga. layanan
ongkos pengiriman JNE
kirim JNE. beserta ongkos
kirimnya.
6. Halaman Melihat Klik detail Menuju ke
Order. detail pada kolom halaman detail
order. aksi. order.
7. Halaman Mengirim Klik tombol Gambar bukti
detail order. bukti pilih file dan transfer muncul
transfer. memilih pada halaman
gambar bukti detail order.
transfer lalu
klik simpan.
8. Halaman edit Mengubah Mengubah Data customer
akun data data yang berubah.
customer. customer. ingin diubah
lalu klik
tombol ubah.
9. Halaman Melihat Klik link Menuju ke
Tentang Kami. info tentang kami halaman tentang
perusahaan. di pojok kami.
kanan bawah
website.

100
No Form Skenario Input Hasil yang
diharapkan
10. Halaman Melihat Menginputkan Barang yang
Pencarian barang nama barang dicari sesuai
Barang. yang ingin yang ingin kata kunci akan
dicari. dicari pada muncul.
box pencarian.
11. Halaman Melihat Klik link Muncul semua
Menu Produk. semua produk. daftar barang
barang yang tersedia di
yang dijual website UD.
di website. Bali Nirvana
Computer.
12. Halaman Melihat Klik salah Menuju ke
Menu Jenis barang satu menu halaman jenis
Barang yang dijual jenis barang barang yang di
di website di menubar. klik.
sesuai
jenisnya.
13. Halaman login Melakukan Username dan Masuk ke menu
admin. login password utama admin.
admin. benar.
Username dan Muncul pesan
password error.
salah.
14. Halaman Menambah Klik tombol Menuju ke
mengelola data admin tambah. halaman tambah
data admin. baru. data admin.
Mengubah Klik tombol Menuju
data admin ubah. halaman ubah
data admin.
15. Halaman Menambah Semua field Data admin
tambah data data admin pada form baru masuk ke
admin. baru. terpenuhi lalu tabel data
di klik admin.
simpan.
Field tidak Muncul pesan
terpenuhi atau error.
kosong.

101
No Form Skenario Input Hasil yang
Diharapkan
16. Halaman Mengubah Semua field Data admin
ubah data data admin. pada form berubah pada
admin. terpenuhi lalu tabel data
klik simpan. admin.
Field tidak Muncul pesan
terpenuhi atau error.
kosong.
17. Halaman Menambah Klik tombol Menuju
mengelola data produk tambah. halaman
data produk. baru. tambah data
produk.
Mengubah Klik tombol Menuju
data produk. ubah. halaman ubah
data produk.
Menambah Klik tombol Menuju
data stok tambah produk. halaman
produk. tambah data
stok produk.
18. Halaman Menambah Semua field Data produk
tambah data data produk pada form baru masuk
produk. baru. terpenuhi lalu ke tabel data
klik tambah. produk.
Field tidak Muncul pesan
terpenuhi atau error.
kosong.
19. Halaman Mengubah Semua field Data produk
tambah ubah data produk. pada form berubah pada
data produk. terpenuhi lalu tabel data
klik ubah. produk.
Field tidak Muncul pesan
terpenuhi atau error.
kosong.
20. Halaman Menambah Masukan Jumlah stok
tambah data data stok jumlah stok produk
stok produk. produk. yang ingin bertambah.
ditambahkan
lalu klik
tambah.

102
No. Form Skenario Input Hasil yang
diharapkan
21. Halaman Menambah Klik tombol Menuju
mengelola data kategori. tambah. halaman
data kategori. tambah data
kategori.
Mengubah Klik tombol Meunju
data kategori. ubah. halaman ubah
data kategori.
22. Halaman Menambah Semua field Data kategori
tambah data data kategori pada form baru masuk ke
kategori. baru. terpenuhi lalu tabel data
klik tambah. kategori.
Field tidak Mucnul pesan
terpenuhi atau error.
kosong.
23. Halaman Mengubah Semua field Data kategori
Ubah Data data kategori. pada form berubah pada
Kategori. terpenuhi lalu tabel data
klik ubah. kategori.
Field tidak Muncul pesan
terpenuhi atau error.
kosong.
24. Halaman Menambah Klik tombol Menuju
Mengelola data merk tambah. halaman
Data Merk. baru. tambah data
merk.
Klik tombol Menuju
ubah. halaman ubah
data merk.
25. Halaman Menambah Semua field Data merk baru
Tambah Data data merk pada form masuk ke tabel
Merk. baru. terpenuhi lalu data merk.
klik tambah.
Field tidak Muncul pesan
terpenuhi atau error.
kosong.

103
No Form Skenario Input Hasil yang
Diharapkan
26. Halaman Mengubah Semua field Data merk
Ubah Data data merk. pada form berubah pada
Merk terpenuhi lalu tabel data
klik ubah. merk.
Field tida Muncul pesan
terpenuhi atau error.
kosong.
27. Halaman Melihat data Klik tombol Munuju ke
Mengelola pesanan. pemesanan. halaman data
Data Pesanan. pesanan.
28. Halaman Meilhat detail Klik tombol Munuju ke
Detail Data data pesanan. detail. halaman detail
Pesanan. pesanan.
29. Halaman Melihat data Pilih status Data pesanan
Laporan pesanan lalu klik cari. ditampilkan
Pesanan. berdasarkan berdasarkan
status. status yang
dipilih.
Mencetak Klik tombol Tampil laporan
laporan cetak. transaksi UD.
pesanan. Bali Nirvana
Computer.
30. Halaman Mencetak Klik tombol Tampil laporan
Laporan laporan cetak. customer UD.
Customer. customer. Bali Nirvana
Computer.
31. Halaman Mencetak Klik tombol Tampil laporan
Laporan laporan cetak. barang terlaris
Barang barang UD. Bali
Terlaris. terlaris Nirvana
Computer.
32. Halaman Menceak Klik tombol Tampil laporan
Laporan laporan cetak. barang jarang
Barang barang jarang laku UD. Bali
Jarang Laku. laku. Nirvana
Computer.
104
No Form Skenario Input Hasil yang
Diharapkan
33. Halaman Mengubah Menginputkan Mengirim
Reset password email lalu klik email lalu
Password admin baru. send email. memberikan
Admin. password baru
ke admin.
34. Halaman Mengubah Menginputkan Mengirim
Reset password email lalu klik email lalu
Password pelanggan send email. memberikan
Pelanggan. baru. password baru
pelanggan.

105
HALAMAN INI SENGAJA DIKOSONGKAN

106