18

3.2.1 Use Case Diagram

Use Case Diagram memperlihatkan hubungan yang terjadi antara seseorang
dengan sistem. Terdapat 2 aktor yang digunakan dalam Diagram Use Case yaitu
Admin dan Pelanggan.
Penjelasan pada Gambar 3.1. Admin dapat mengelola gambar pada home,
mengelola data barang, mengelola kategori, mengelola bukti pembayaran,
mengelola status pembayaran dan mengelola data data pelanggan. Namun dengan
catatan admin harus melakukan login terlebih dahulu.

Gambar 3.1 Use Case Diagram Admin

Gambar 3.2 Use Case Diagram User

Penjelasan pada Gambar 3.2. User dapat melihat produk dan informasi yang
ada di website Dayatrik namun, jika user ingin membeli produk user diharuskan
 19

melakukan login atau daftar akun member Dayatrik terlebih dahulu, jika sudah
terdaftar user bisa login akun dan melakukan transaksi.

3.2.2 Activity Diagram

Activity Diagram menggambarkan alur aktivitas yang terjadi pada sistem
yang sedang dirancang. Activity Diagram memiliki komponen dengan bentuk
tertentu yang dihubungkan dengan tanda panah. Panah tersebut mengarah ke-urutan
aktivitas yang terjadi dari awal hingga akhir. Website ini memiliki dua Activity
Diagram yaitu Activity Diagram admin dan Activity Diagram pelanggan.

3.2.2.1. Login sebagai Admin

Pada saat admin ingin menggunakan sistem ini diharuskan login terlebih
dahulu dengan menggunakan username dan password. Setelah memasukkan
username dan password maka sistem akan memeriksa data yang dimasukkan. Jika
sesuai maka admin dapat mengelola data dengan meng input, menghapus dan
mengedit data yang ada di daftar produk, daftar pembelian data pelanggan dan
laporan pembelian. Dari uraian tersebut dapat dibuat diagram aktivitas seperti
Gambar 3.3
Tabel 3.1 Activity Diagram Admin
 20

3.2.2.2. Pelanggan sebagai pengguna website

Ada Pula Activity Diagram pengguna seperti pada gambar 3.4 menjelaskan
saat pelanggan mengunjungi website, bisa melihat informasi dan produk yang ada
di Dayatrik Store. Namun ketika pelanggan ingin melakukan pemesanan maka
harus terdaftar sebagai member Dayatrik apabila tidak terdaftar user dapat
melakukan pendaftaran dan login akun, dengan menggunakan username dan
password. Setelah itu maka sistem akan memeriksa data yang dimasukan. Jika
sesuai, maka user dapat melakukan pemesanan. Namun, bila tidak sesuai maka user
tidak bisa melakukan pemesanan dan konfirmasi pembelian.
Tabel 3.2 Activity Diagram Pelanggan
 21

3.2.3 Class Diagram

Class Diagram digunakan untuk menggambarkaan relasi antara tabel satu
dengan tabel lainnya. Berikut adalah skema basis data yang bentuk dalam class
diagram.
Tabel 3.3 Class Diagram

3.3 Struktur Navigasi

Untuk menentukan struktur website, struktur navigasi sangatlah penting.
Pada pembuatan website Dayatrik Store ini menggunakan struktur navigasi
campuran untuk struktur navigasi admin dan struktur navigasi pelanggan.

3.3.1 Struktur Navigasi Admin

Struktur navigasi admin yang digunakan dalam website Dayatrik
menggunakan struktur navigasi campuran dimana merupakan gabungan dari ketiga
struktur navigasi yaitu, linier, non-linier dan hirarki. Pada gambar 3.5. pada struktur
navigasi admin, seorang admin dapat mengakses tampilan yang berada di data
master, data pelanggan dan data toko dengan melakukan aksi tambah, edit atau
hapus.
 22

Gambar 3.5 Struktur Navigasi Admin

3.3.2 Struktur Navigasi Pelanggan

Struktur navigasi pelanggan yang digunakan dalam website Dayatrik
menggunakan struktur navigasi campuran. Pada gambar 3.6 jika pelanggan hanya
ingin melihat lihat informasi dan produk dari Dayatrik dapat langsung menuju ke
website, namun jika pelanggan ingin melakukan transaksi dengan membeli produk,
pelanggan diwajibkan memiliki akun member dengan login akun atau jika belum
punya akun pengguna bisa melakukan pendaftaran terlebih dahulu Jika ada produk
yang disuka pelanggan bisa langsung memasukkannya ke keranjang dan melakukan
pembayaran.

Gambar 3.6 Struktur Navigasi Pelanggan