Anda di halaman 1dari 28

BAB 1V

HASIL DAN PEMBAHASAN

4.1 Pengembangan Sistem

4.1.2 Halaman Pelanggan

User interface system merupakan tampilan sistem yang berfungsi

sebagai perantara dalam menghubungkan user dengan proses yang dibangun.

1. Halaman Utama Pelanggan Sebelum Login

Halaman sebelum login ditampilkan pada saat pengguna pertama kali

mengakses website. Pada halaman ini terdapat beberapa menu, yaitu home,

produk, dan login.Tampilan halaman pelanggan sebelum login di sajikan pada

Gambar 4.1

Gambar 4.1 Halaman Utama Pelanggan Sebelum Login

2. Halaman Login Pelanggan

Halaman login pelanggan tampil setelah pengguna mengklik button login.

Pada halaman ini pelanggan dapat menginputkan username dan password yang

telah terdaptar di sistem. Halaman login pelanggan terdapat pada Gambar 4.2
Gambar 4.2 Halaman Login Pelanggan

3. Halaman Daftar Pelanggan

Halaman daftar pelanggan ditampilkan setelah pengguna mengakses

button Buat Akun. Pada halaman ini pengguna dapat mendaftarkan data dirinya,

berupa nama, alamat, telepon, email, username, dan password. Halaman daftar

pelanggan terdapat pada Gambar 4.3

Gambar 4.3 Halaman Daftar Pelanggan


4. Halaman Utama Pelanggan Setelah Login

Halaman utama pelanggan setalah login ditampilkan setelah pelanggan

melakukan login. Halaman ini dapat di akses oleh pelanggan.Pada halaman ini

juga terdapat beberapa menu, yaitu home, produk, logout, profilku, keranjang

dan daftar pesanan. Halaman utama pelanggan setelah login terdapat pada

Gambar 4.4.
Gamabar 4.4 Halaman Utama Pelanggan Setelah Login

5. Halaman Detail Profil Pelanggan

Gambar 4.5 menggambarkan halaman detail profil pelanggan. Halaman ini

di tampilkan setelah pelanggan mengklik button profilku. Pada halaman ini

pelanggan dapat melihat data diri yang telah terdaftar di sistem.

Gambar 4.5 Halaman Detail Profil Pelanggan

6. Halaman Ubah Profil

Halaman Ubah Profil Pelanggan Dapat di akses oleh Pelanggan itu sendiri.

Pada halaman ini Pelanggan dapat mengubah data diri yang di

inginkan.Halaman ubah profil pelanggan disajikan pada Gambar 4.6


Gambar 4.6 Halaman Ubah Profil Pelanggan.

7. Halaman Barang Pelanggan

Halaman Barang Pelanggan ditampilkan setelah pelanggan menekan button

produk. Pada halaman ini pelanggan dapat melihat berbagai produk dari Lovlar

Store, dari baju, celana, dan tas. Halaman barang pelanggan terdapat pada

Gambar 4.7.

Gambar 4.6 Halaman Ubah Profil Pelanggan.

8. Halaman Detail Barang Pelanggan


Gambar 4.8 menggambarkan halaman detail barang pelanggan. Halaman

detail barang pelanggan ditampilkan setelah pelanggan mengklik button deail.

Dimana pada halaman ini pelanggan dapat melihat barang secara detail,

mulai dari nama produk, harga, stok, ukuran dan keterangan

Gambar 4.8 Halaman Detail Barang Pelanggan

9. Halaman Pemesanan Pelanggan

Gambar 4.9 menggambarkan halaman pemesanan pelanggan. Pada

halaman ini menampilkan barang yang akan di beli oleh pelanggan. Untuk

melakukan pemesanan, pelanggan terlebih dahulu menginputkan jumlah

pesanan.
Gambar 4.9 Halaman Pemesanan Pelanggan

10. Halaman Transaksi Pembayaran

Halaman transaksi pembayaran ditampilkan setelah pelanggan mengklik

button kranjang lalu CekOut. Pada halaman ini pelanggan dapat mengupload

bukti transaksi yang sudah dilakukan. Halaman transaksi pembayaran terdapat

pada Gambar 4.10

Gambar 4.10 Halaman Transaksi Pembayaran


4.1.3 Halaman Admin

1. Halaman Login Admin

Halaman login admin ditampilkan pertama kali setelah admin

mengakses website. Pada halaman ini admin dapat menginputkan username dan

password untuk login. Halaman login admin disajikan pada gambar 4.11.

Gambar 4.11 Halaman Logi Admin

2. Halaman Utama Admin

Gambar 4.12 menggambarkan halaman utama admin. Pada halaman

ini terdapat beberapa menu yang akan di akses oleh admin, yaitu home, produk,

stok, pelanggan, pesanan, pembayaran, dan logout. Halaman ini hanya dapat

diakses oleh admin.


Gambar 4.12 Halaman Utama Admin

3. Halaman Tambah Data Barang

Halaman tambah data barang ditampilkan setelah admin mengklik

button produk. Pada halamn ini admin dapat menambah data barang. Halaman

tambah data barang disajikan pada Gambar 4.13.

Gambar 4.13 Halaman Tambah data Barang


4. Halaman Cari Data Stok Barang

Halaman cari data stok barang ditampilkan setelah admin mengklik

menu stok lalu cari. Di halaman ini admin dapat mencari data stok barang yang

kosong. Halaman cari data stok barang disajikan pada Gambar 4.15

Gambar 4.14 Halaman Ubah Data Barang

5. Halaman Cari Data Stok Barang

Halaman cari data stok barang ditampilkan setelah admin mengklik

menu stok lalu cari. Di halaman ini admin dapat mencari data stok barang yang

kosong. Halaman cari data stok barang disajikan pada Gambar 4.15
Gambar 4.15 Halaman Cari Data Stok Barang

6. Halaman Tambah Data Stok Barang

Gambar 4.16 menggambarkan halaman tambah data stom barang.

Pada halaman ini admin dapat menambah stok barang setelah melakukan

pencarian stok yang kosong. Admin menginputkan jumlah stok barang yang aka

di tambahkan.
Gambar 4.16 Halaman Tambah Data Stok Barang

7. Halaman Data Pelanggan

Halaman data pelanggan ditampilkan setelah admin mengklik menu

pelanggan. Pada halaman ini admin dapat melihat data pelanggan berupa,

nama, telepon, alamat, dan email. Halaman data pelanggan di sajikan pada

Gambar 4.17

Gambar 4.17 Halaman Data Pelanggan

8. Halaman Data Pesanan

Halaman data pesanan ditampilkan setelah admin mengklik menu

pesanan. Dimana pada halaman ini admin dapat melihat pelanggan yang sudah

melakukan pemesanan. Halaman data pesanan disajikan pada Gambar 4.18


. Gambar 4.18 Gambar Data pesanan

9. Halaman Data Pembayaran

Halaman data pembayaran ditampilkan setelah admin mengklik menu

pembayaran. Pada halaman ini admin dapat melihat pelanggan yang

sudah melakukan pembayaran. Halaman data pembayaran disajikan

pada Gambar 4.19

Gambar 4.19 Halaman Data Pembayaran


4.1.4 Halaman Owner

1. Halaman Login Owner

Halaman login owner ditampilkan saat pertama kali owner

mengakses website. Pada halaman ini owner dapat menginputkan username dan

password untuk logi ke sistem. Halaman login owner disajikan pada Gambar

4.20.

Gambar 4.20 Halaman Logi Owner

2. Halaman Utama Owner

Setelah owner melakukan login, langsung diarahkan ke menu utama

owner. Di halaman initerdapat beberapa menu, yaitu pegawai, laporan, laporan

stok, dan logout. Halaman utama owner disajikan pada Gambar 4.21.
Gambar 4.21 Halaman Utama Owner

3. Halaman Data Pegawai

Hamalan data pegawai ditampilkan setelah owner mengakses

menu pegawai. Pada halaman ini owner dapat menambah data pegawai dengan

menginputkan nama, email, status, username, dan password. Halaman data

pegawai disajikan pada Gambar 4.22

Gambar 4.22 Halaman Data Pegawai


4. Halaman Ubah Data Pegawai

Mengubah data pegawai dapat dilakukan setelah owner mengakses

button option.Setelah itu, owner dapat mengubah data pagawai. Halaman ubah

data pegawai disajikan pada Gambar 4.23.

Gambar 4.22 Halaman Data Pegawai

5. Halaman Laporan Penjualan

Halaman laporan penjualan ditampilkan setelah owner mengakses

menu laporan. Pada halaman ini owner dapat melihat laporan penjualan

harian/bulanan/tahun, dengan menginputkan tanggal awal dan tanggal akhir.

Halaman laporan penjualan disajikan pada Gambar 4.24.


Gambar 4.22 Halaman Laporan Penjualan

8. Halaman Laporan Stok Barang

Halaman laporan stok barang ditampilkan setelah owner mengakses menu

laporan stok. Pada halaman ini owner dapat melihat sisa stok barang dari hasil

penjualan. Halaman laporan stok barang disajikan pada gambar 4.23

Gambar 4.23 Halaman Ubah Data Pegawai

4.2 Pengujian Sistem


Untuk memastikan bahwa sistem yang dibangun telah memenuhi

kebutuhan pengguna maka diperlukan proses pengujian sistem. Pengujian E-

Marketplace pada UMKM, dilakukan dengan menggunakan pengujian

menggunakan teknik black box testing. Pengujian dengan teknik black box yaitu

dengan memperhatikan hasil output sistem apakah sudah sesuai dengan yang

diharapkan.

Fungsi Skenari Hasil pengujian Hasil yang

o di harapkan

Hasil pengujian Semua field

sistem login pada form


Pemesa
ditunjukkan dalam sudah
nan
Gambar 4.26 dan dilengkapi,

Gambar 4.27. maka sistem

Pengisi Ketika sistem mengeluark

an valid berhasil, sistem an pesan,

akan memberikan berhasil

notifikasi seperti login.

yang di tunjukkan

dalam Gambar

4.26.

Pengisi Hasil pengujian Semua field

an sistem login pada form

invalid ditunjukkan dalam belum


Gambar 4.26 dan dilengkapi,

Gambar 4.27. maka sistem

Ketika sistem mengeluark

berhasil, sistem an pesan,

akan memberikan kata sandi

notifikasi seperti yang anda

yang di tunjukkan masukkan

dalam Gambar salah!

4.27. Silahkan

login ulang

Gambar 4.26 Pengujian Sistem Login Valid

Gambar 4.27 Pengujian Sistem Login Invalid

4.2.1 Pengujian Sistem Pemesanan Barang

Pada pengujian pemesanan terdiri dari dua skenario yaitu, pengujian

valid dan invalid. Pengujian valid dapat dilihat pada Gambar 4.28, dan pengujian

invalid dapat dilihat pada Gambar 4.29. Detail pengujian dapat dilihat pada Table

4.2.
Table 4.2 Pengujian Sistem Pemesanan Barang

Fungsi Skenari Hasil pengujian Hasil yang di

o harapkan

Hasil pengujian Semua field

sistem pada form


Pemesa
pemesanan sudah
nan
ditunjukkan dilengkapi,

dalam Gambar maka sistem

4.28 dan Gambar mengeluarka

Pengisi 4.29. Ketika n pesan,

an valid sistem berhasil, berhasil

sistem akan masuk ke

memberikan keranjang

notifikasi seperti belanja.

yang di tunjukkan

dalam Gambar

4.28

Pengisi Hasil pengujian Semua field

an sistem pada form

invalid pemesanan belum

ditunjukkan dilengkapi,

dalam Gambar maka sistem

4.28 dan Gambar mengeluarka

4.29. Ketika n pesan,


sistem berhasil, maaf! Stock

sistem akan baang

memberikan kosong.

notifikasi seperti

yang di tunjukkan

dalam Gambar

4.29.

Gambar 4.28 Pengujian Sistem Pemesanan Barang Valid

Gambar 4.29 Pengujian Sistem Pemesanan Barang Invalid

4.2.2 Pengujian Sistem Pembayaran

Pada pengujian pembayaran terdiri dari dua skenario yaitu,

pengujian valid dan invalid. Pengujian valid dapat dilihat pada Gambar 4.230, dan

pengujian invalid dapat dilihat pada Gambar 4.31. Detail pengujian dapat dilihat

pada Table 4.3.

Table 4.3 Pengujian Sistem Pembayaran

Fungsi Skenar Hasil Hasil Yang


io pengujian Diharapkan

Pembay Hasil Semua field

aran pengujian pada form

sistem sudah

pembayaran dilengkapi,

ditunjukkan maka sistem

dalam mengeluarka

Gambar 4.30 n pesan,

dan Gambar berhasil!


Pengisi
4.31. Ketika Pembayaran
san
sistem sedang di
valid
berhasil, konfirmasi,

sistem akan silahkan

memberikan menunggu.

notifikasi

seperti yang

di tunjukkan

dalam

Gambar 4.30.

Pengisi Hasil Semua field

an pengujian pada form

invalid sistem sudah

pembayaran dilengkapi,

ditunjukkan maka sistem

dalam mengeluarka
Gambar 4.30 n pesan,

dan Gambar berhasil!

4.31. Ketika Pembayaran

sistem sedang di

berhasil, konfirmasi,

sistem akan silahkan

memberikan menunggu.

notifikasi

seperti yang

di tunjukkan

dalam

Gambar 4.31

Gambar 4.30 Pengujian Sistem Pembayaran

Gambar 4.31 pengujian Sistem Pembayaran

4.2.3 Pengujian Sistem Pembayaran


Pada pengujian pembayaran terdiri dari dua skenario yaitu,

pengujian valid dan invalid. Pengujian valid dapat dilihat pada Gambar 4.230, dan

pengujian invalid dapat dilihat pada Gambar 4.31. Detail pengujian dapat dilihat

pada Table 4.3.

Table 4.3 Pengujian Sistem Pembayaran

Fungsi Skenar Hasil Hasil Yang

io pengujian Diharapkan

Pembay Pengisi Hasil Semua field

aran san pengujian pada form

valid sistem sudah

pembayaran dilengkapi,

ditunjukkan maka sistem

dalam mengeluarka

Gambar 4.30 n pesan,

dan Gambar berhasil!

4.31. Ketika Pembayaran

sistem sedang di

berhasil, konfirmasi,

sistem akan silahkan

memberikan menunggu.

notifikasi

seperti yang

di tunjukkan

dalam
Gambar 4.30.

Hasil Semua field

pengujian pada form

sistem sudah

pembayaran dilengkapi,

ditunjukkan maka sistem

dalam mengeluarka

Gambar 4.30 n pesan,

dan Gambar berhasil!


Pengisi
4.31. Ketika Pembayaran
an
sistem sedang di
invalid
berhasil, konfirmasi,

sistem akan silahkan

memberikan menunggu.

notifikasi

seperti yang

di tunjukkan

dalam

Gambar 4.31

Gambar 4.30 Pengujian Sistem Pembayaran


Fungsi Skena Hasil Pengujian Hasil

rio Yang

Diharapka

n
4.2.4 Pengujian
Hasil pengujian Semua Sistem
sistem tambah field pada Tambah

Data data barang form sudah Barang


ditunjukkan dalam dilengkapi
Pada
Gambar 4.32 dan maka
pengujian tambah data
Pengis Gambar 4.33. sistem
barang terdiri dari dua
isan Ketika sistem mengeluar
skenario yaitu,
valid berhasil, sistem kan pesan,
pengujian valid dan
akan memberikan Posting
invalid. Pengujian
notifikasi seperti sudah di
valid dapat dilihat pada
yang di tunjukkan simpan.
Gambar 4.32, dan
dalam Gambar
pengujian invalid dapat
4.32.
dilihat pada Tambah Gambar

4.33. Detail Data Hasil pengujian Semua pengujian

dapat dilihat Barang sistem tambah field pada pada Table

4.1. data barang form belum

ditunjukkan dalam dilengkapi,

Gambar 4.32 dan maka

Gambar 4.33. sistem


Pengis
Ketika sistem mengeluar
ian
berhasil, sistem kan pesan,
invalid
akan memberikan Please fill

notifikasi seperti out this

yang di tunjukkan field.

dalam Gambar

4.3.3.
Gambar 4.32 Pengujian Sistem Tambah Data Barang Valid

Gambar 4.33 Pengujian Sistem Tambah Data

Barang Inv

4.2.5 Pengujian Sistem Ubah Data Barang

Pada pengujian tambah data barang terdiri dari dua skenario yaitu,

pengujian valid dan invalid. Pengujian valid dapat dilihat pada Gambar 4.32, dan

pengujian invalid dapat dilihat pada Gambar 4.33. Detail pengujian dapat dilihat

pada Table 4.1.

Table 4.5 Pengujian Sistem Ubah Data Barang


Fungsi Skena Hasil Pengujian Hasil

rio Yang

Diharapka

Hasil pengujian Semua

sistem ubah data field pada

barang ditunjukkan form sudah

dalam Gambar dilengkapi,


Gambar 4.34 Pengujian
4.34 dan Gambar maka
Sistem Ubah Pengis Data Barang
4.35. Ketika sistem sistem
Valid isan
berhasil, sistem mengeluar
valid
akan memberikan kan pesan,
Gambar 4.35 Pengujian
notifikasi seperti produk
Sistem Ubah Data Barang
yang di tunjukkan sudah di
Invalid
dalam Gambar update

4.34.

Hasil pengujian Semua

sistem ubah data field pada

barang ditunjukkan form belum


Ubah
dalam Gambar dilengkapi,
Data
4.34 dan Gambar maka
Barang Pengis
4.35. Ketika sistem sistem
ian
berhasil, sistem mengeluar
invalid
akan memberikan kan pesan,

notifikasi seperti Please fill

yang di tunjukkan out this

dalam Gambar field.

4.35.

Anda mungkin juga menyukai