## PENERAPAN DESAIN UI/UX PADA APLIKASI E-COMMERCE HERBAL JAMUPURI MENGUNAKAN METODE USER CENTERED DESIGN (UCD)
Muhammad Sony Maulana 1 , Agung Sasongko 2 , Richo Dwi Wardiyanto Romadhon 3
1,2,3 Program Studi Sistem Informasi Kampus Kota Pontianak, Universitas Bina Sarana Informatika Jl. Abdurahman Saleh No.18A, Negara
e-mail: 1 muhammad.sony.mom@bsi.ac.id, 2 agung.ako@bsi.ac.id, 3 richowardiyanto1@gmail.com
Abstrak - Herbal Jamupuri merupakan badan usaha bergerak di bidang kesehatan yang menjual produk–produk herbal dengan harapan bisa membuat tubuh lebih sehat dan alami. Produk herbal yang dijual seperti minyak kemiri untuk  ketombe  pada  rambut,  minyak  kelapa  untuk  menjaga  kesehatan  jantung,  dan  lain  sebagainya.  Untuk meningkatkan penjualan maka perlu dikembangkan sebuah aplikasi penjualan yang dapat mengukuhkan keaslian produk dan lokasi toko selain berjualan di marketplace. Tujuan penilitian ini adalah membuat aplikasi e-commerce pada toko jamupuri. Sistem dirancang dengan metode User Centered Design (UCD) agar pengguna mendapatkan hasil User  Interface  (UI) dan User  Experience  (UX) yang  maksimal.  Penerapan  UI/UX  diharapkan  dapat membantu penjualan produk herbal jamupuri dengan menampilkan informasi lengkap berupa komposisi produk, harga  jual  dan  aturan  pakai  agar  dapat  dilihat  dan  diminati  oleh  pembeli  lokal  maupun  nasional.  Hasil  dari penelitian ini UI/UX yang telah diuji dan dapat diterima pengguna dengan baik dan siap diimplementasikan secara daring melalui laman jamupuri.com.
Kata Kunci: sistem informasi, UCD, herbal, UI, UX

## PENDAHULUAN
E-commerce  adalah  sebuah  teknik  untuk mengatur, memasarkan dan melacak semua transaksi penjualan  produk  atau  jasa  secara  digital(Alwendi, 2020). Di tengah kondisi ekonomi saat ini, aplikasi e- commerce dapat membantu usaha agar tetap berjalan dengan baik dikarenakan pengusaha dapat mengelola inventaris  produk  atau  jasa  dengan  lebih  baik, melacak transaksi pelanggan, dan menganalisis data penjualan  untuk  mengambil  keputusan  yang  lebih baik. Aplikasi e-commerce memungkinkan pelanggan  untuk  dengan  mudah  membeli  produk herbal mereka dari rumah, tanpa harus pergi ke toko fisik(Kristania, 2019). Tidak hanya aman, tetapi juga nyaman,  serta  aplikasi  e-commerce  membantu menjangkau lebih banyak pelanggan, bahkan di luar wilayah lokal tempat usaha itu berdomisili. Ini berarti peningkatan penjualan dan pertumbuhan bisnis, yang sangat penting untuk menghadapi tantangan ekonomi saat  ini.  Jadi,  aplikasi  e-commerce  adalah  alat  yang sangat penting bagi pengusaha untuk menjaga bisnis mereka tetap sukses dan berkembang.
Herbal  Jamupuri  merupakan  badan  usaha bergerak di bidang kesehatan yang menjual produk– produk  herbal  dengan  harapan  bisa  membuat  tubuh lebih  sehat  dan  alami.  Produk  herbal  yang  dijual seperti  minyak  kemiri  untuk  ketombe  pada  rambut, minyak kelapa untuk menjaga kesehatan jantung, dan lain  sebagainya.  Untuk  meningkatkan  penjualan maka perlu dikembangkan aplikasi e-commerce yang
dapat mengukuhkan keaslian produk dan lokasi toko yang berbeda konsep dengan berjualan di marketplace.
Berdasarkan  latar  belakang  diatas,  perlu dirancang  sebuah  aplikasi  e-commerce  yang  dapat membantu  usaha  Herbal  Jamupuri.  Agar  rancangan yang  dihasilkan  mudah  untuk  digunakan  tentunya diperlukan rancangan desain UI/UX untuk aplikasi e- commerce  Herbal  Jamupuri  yang  bertujuan  untuk membantu  dan  mempermudah  pihak  pengusaha dalam  mengatur,  memasarkan  dan  melacak  semua transaksi penjualan produk secara digital. Rancangan UI yang sulit dipahami akan memberikan pengalaman buruk dan mempengaruhi UX pengguna sehingga menurunkan produktifitas pengguna terhadap  aplikasi(Yaputra,  2023).  UX  merupakan faktor yang sangat mempengaruhi  seorang  pengguna pada  saat  berinteraksi  dengan  aplikasi    karena prioritas  dari  teknologi  yang  diciptakan  sudah seharusnya    mendukung  kemudahan  pengguna (Norman & Nielsen, 2023).
Selain  itu,  rancangan  aplikasi  e-commerce yang  dibangun  menggunakan  model  pengembangan sistem  UCD  (User  Centered  Design)  agar  aplikasi yang  dirancang  sesuai  tujuan  dan  memenuhi kebutuhan  pengguna(Rizal  &  Saputra,  2023). Dimana rancangan aplikasi tersebut ditujukan  untuk memenuhi  4  aspek  permasalahan  yaitu  keamanan, kualitas produk, keaslian produk, dan pengiriman(Prabowo, 2022)

## METODE PENELITIAN
Metode  pengumpulan  data  yang  dilakukan penulis adalah Observasi (Observation) dan Wawancara  (Interview).  (Grizelda  &  Dwi  Septiani,
2020)
Observasi: Penulis mengamati secara langsung mengenai kegiatan-kegiatan yan dilakukan tentang  sistem  penjualan  obat  herbal  dari  tahapan awal  sampai tahapan  akhir pada toko Jamupuri dari observasi  atau  pengamatan  langsung  akan  dicatat. Penulis  juga  mengetahui  setiap  tahapan  dari  sistem penjualan  obat  herbal  sebagai  upaya  untuk memahami  prosedur  sistem  dan  permasalahan  yang terjadi  serta  telah  diuraikan  pada  latar  belakang masalah.
Wawancara:  digunakan  sebagai  sarana  untuk mendapatkan  informasi  penting  tentang  sistem penjualan  obat  herbal  pada  Toko  Jamupuri.  Penulis melakukan wawancara dengan Bapak Khairul Anwar selaku  pemilik  toko  Jamupuri  penulis  selama melakukan  penelitian  untuk  mengetahui  proses  atau tahapan  dari  sistem  penjualan  obat  herbal  yang diterapkan pada Toko Jamupuri.
Studi  Pustaka:  dalam  penelitian  ini  penulis mengumpulkan literatur dari web dan jurnal, penulis menerapkan metode studi pustaka. Pendekatan studi pustaka  ini  merujuk  pada  informasi  yang  diperoleh dari  sumber-sumber  web  dan  artikel  ilmiah  yang didapat  secara  digital  terkait  dengan  metode  User Centered Design (UCD).
Penelitian  ini  menggunakan  metode  UCD yang  berfokus  pada  pengguna  sebagai  pusat pengembangan aplikasi, seperti menentukan konteks penggunaan, menentukan Persyaratan Pengguna dan Organisasi, menghasilkan  solusi  desain,  dan mengevaluasi desain.(Supardianto & Binsar Tampubolon, 2020)
Terdapat   5   tahapan   dalam   aktivitas   UCD yang  saling  ketergantungan  (Albani  &  Lombardi, 2011), tahapan tersebut dapat dilihat pada gambar 1.
Sumber: (Albani & Lombardi, 2011)
Gambar 1. Tahapan UCD
Hasil perancangan aplikasi e-commerce dengan melakukan  analisis  UCD  berdasarkan  5  tahapan sebagai berikut:
1) Tahap Perencanaan pada UCD
Tahap ini riset dimulai dari diskusi dengan pihak pemangku  kepentingan  terkait  rancangan  aplikasi  e- commerce berdasarkan kebutuhan pengguna baik dari konten maupun fungsional aplikasi. Hasil dari diskusi ini  digunakan  sebagai  perencanaan  pengembangan aplikasi e-commerce berbasis UCD.
2) Tahap menentukan konteks pengguna
Tahap ini riset untuk menentukan bahwa aplikasi yang akan dirancang merupakan aplikasi berbasis web, dimana  aplikasi  web  mudah  untuk  diakses  oleh customer dan bagian pengelola    aplikasi e-commerce Herbal  Jamupuri.  Identifikasi  pengguna  aplikasi dilakukan dengan diskusi kepada pemangku kepentingan selaku pihak yang memberikan gambaran aplikasi  e-commerce  yang  akan  akan  dikembangkan dan  menjelaskan  fungsi-fungsinya  serta  kebutuhan disisi  penguna  sistem.  Pengguna  aplikasi  sesuai dengan kebutuhan aplikasi e-commerce  yaitu:3 (tiga) level akses yaitu admin, owner dan customer.
3) Tahap  menentukan  kebutuhan  pengguna  dan organisasi
Tahap  ini  riset  yang  dilakukan  pada  Herbal
Jamupuri  Pontianak  meliputi  pembuatan  aplikasi  e- commerce yang dapat melakukan pengelolaan produk yang tersedia, mengelola transaksi penjualan, merekap data pesanan dan data penjualan. Kebutuhan aplikasi e- commerce obat herbal ini memiliki 3 (tiga) level akses yaitu  admin,  owner  dan  customer.  Admin  dapat melakukan login, mengelola data kategori, mengelola data produk, verifikasi pemesanan, mencetak laporan pemesanan,  dan  melakukan  transaksi  penjualan. Owner dapat mengakses data produk, mengelola data produk,  mengelola  data  kategori,  mencetak  laporan transaksi, mengelola data pengguna, mengecek laporan transaksi harian, bulanan dan tahunan. Customer dapat mengakses  produk  setelah  terlebih  dahulu  membuat akun,  melihat  detail  produk,  memasukkan  produk  ke keranjang  belanja,  membeli  produk,  melakukan checkout,  melakukan  pembayaran,  melihat  status pemesanan, mengubah profil, dan mengecek transaksi dan keluar dari aplikasi untuk keamanan
4) Tahap solusi desain yang dihasilkan Tahap  ini  perancangan  untuk  menghasilkan antarmuka aplikasi e-commerce herbal jamupuri yang dibuat dengan berbasis website.
Website  merupakan  sekumpulan  halaman  situs yang  saling  bertautan  dalam  menyajikan  berbagai informasi  dalam  bentuk  teks,  gambar  diam  maupun bergerak, animasi, suara, video, maupun gabungan dari kesemuanya  yang  dapat  diakses  melalui  koneksi internet.(Putra et al., 2023)
Desain  interface  aplikasi  e-commerce  jamupuri berbasis  website    telah  disesuaikan  dengan  metode UCD. Adapun tampak desain interface aplikasi sebagai berikut ini:
Gambar 3. Tampilan Beranda Aplikasi
Tampilan  didesain  sesuai  dengan  kebutuhan pemangku  kepentingan  dan  kebutuhan  pengguna. Kebutuhan pemangku kepentingan adalah menampilkan  produk,  detail  produk,  keranjang belanja, pendaftaran akun sebelum transaksi, perbandingan  produk  dan  like  dari  customer  sebagai bukti  bahwa  produk  tersebut  berkualitas  dan  disukai oleh customer.
Gambar 4. Tampilan Pendaftaran Akun
Gambar 4 menampilkan didesain sesuai dengan kebutuhan  pemangku  kepentingan  untuk  mendata pengguna sebelum melakukan transaksi di aplikasi.
Gambar 5. Tampilan Halaman Admin
Gambar  5  menampilkan  desain  halaman  admin yang  disesuaikan  dengan  kebutuhan  pengolahan produk  oleh  pemangku  kepentingan  yaitu  sebagai contoh bagian admin.
Gambar 6. Tampilan Halaman List Pesanan
Gambar 6, menampilkan desain halaman admin untuk list pesanan yang disesuaikan dengan kebutuhan pengolahan pesanan oleh pemangku kepentingan yaitu sebagai contoh bagian admin.
5) Tahap evaluasi desain terhadap kebutuhan pengguna.
Pengujian  dilakukan  kepada  5  pengguna  yang dipilih  secara  acak.  Pengujian  menggunakan  laptop pengguna  untuk  menjalankan  aplikasi  e-commerce. Pengguna diminta untuk menjalankan rancangan user interface dan merasakan user experience dari aplikasi e-commerce herbal jamupuri. Pada pengujian terdapat tiga  skenario  yang  harus  dijalankan  oleh  pengguna aplikasi.  Kelima  pengguna  tentunya  tidak  diajarkan terlebih  dahulu  tentang  tata  cara  menggunakan rancangan aplikasi e-commerce agar hasil yang dicapai lebih optimal. Pengguna akan dinyatakan berhasil jika menyelesaikan skenario kurang dari atau sama dengan 30 (tiga puluh) detik dan kesalahan dalam melakukan skenario  kurang  dari  atau  sama  dengan  tiga  kali kesalahan.  Pada  setiap  skenario  batas  minimal kesalahan  adalah  50%  jika  lebih  dari  itu  akan dilakukan  perbaikan  kembali  rancangan  tampilan UI/UX. Berikut ini beberapa skenario evaluasi desain kebutuhan pengguna:
1. Skenario 1: Pengguna diminta untuk membuat akun baru dan login pada aplikasi e-commerce.
Tabel 1. Hasil Pengujian Skenario 1 Pengguna Indikator Pengujian Registrasi Login Waktu (detik) Kesalahan 1   21 0 2   19 0 3   15 0 4   13 0 5   18 0 Jumlah Pengguna yang Berhasil 5 5 Waktu Rata- rata: 17,2 detik Persentase Kesalahan: 0% Persentase Keberhasilan Keseluruhan 100% 100%
2. Skenario  2:  pengguna  dapat  memilih  barang, melihat  details  produk  dan  memasukkan  barang ke keranjang belanja.

## Tabel 2. Hasil Pengujian Skenario 2
Pengguna Indikator Pengujian Memilih barang dan melihat detail produk Masukkan barang yang dipilih ke keranjang belanja Waktu (detik) Kesalahan 1   13 0 2   11 0 3   9 0 4   12 0 5   10 0 Jumlah Pengguna yang Berhasil 5 5 Waktu Rata- rata: 11 detik Persentase Kesalahan: 0% Persentase Keberhasilan Keseluruhan 100% 100%
3. Skenario 3: pengguna dapat memilih pembayaran dan melanjutkan upload data transaksi pembelian.

## Tabel 3. Hasil Pengujian Skenario 3
Pengguna Indikator Pengujian Memilih metode pembayara n Upload transaksi pembelia n Wakt u (detik ) Kesalahan 1   13 0 2   11 0 3   9 0 4   12 0 5   10 0 Jumlah Pengguna yang Berhasil 5 5 Wakt u Rata- rata: 11 detik Persentas e Kesalahan : 0% Persentase Keberhasila n Keseluruha n 100% 100%

## KESIMPULAN
Aplikasi  e-commerce  yang  dibangun  dengan metode  UCD  dapat  memberikan  aksesibilitas  yang lebih  luas  bagi  customer,  memungkinkan  untuk menjelajahi  berbagai  produk  obat  herbal  kapan  saja dan  di  mana  saja  sesuai  kebutuhan  sehingga meningkatkan kenyamanan dan kepuasan pelanggan dan keluasan pemasaran herbal.
Aplikasi  e-commerce  dibuat  dalam  tiga  level pengguna agar mempermudah pemangku kepentingan  dalam  mengimplementasikan  aplikasi dan  melakukan  monitoring  terhadap  penggunaan aplikasi.  Hasil  akhirnya  telah  diimplementasikan dalam domain jamupuri.com

## REFERENSI
Albani,  L.,  &  Lombardi,  G.  (2011). User  Centred Design for EASYREACH . Alwendi.  (2020). Penerapan  E-Commerce  Dalam Meningkatkan . 17 (3). http://journal.undiknas.ac.id/index.php/magist er-manajemen/
Grizelda,  I.,  &  Dwi  Septiani,  W.  (2020). PENERAPAN  USER  CENTERED  DESIGN (UCD) UNTUK SISTEM INFORMASI PERIJINAN  PADA  PT.  ALFA  GOLDLAND REALTY TANGERANG SELATAN. JURNALILMU PENGETAHUAN DAN
TEKNOLOGI  KOMPUTER , 5 (2),  205–210. www.bsi.ac.id
Kristania, Y. M. (2019). PEMANFAATAN
APLIKASI E-COMMERCE BERBASIS WEB MENGGUNAKAN FRAMEWORK CODEIGNITER  (STUDI  KASUS :  DISTRO PAK EKO) Yustina Meisella Kristania. Jurnal Sains Dan Manajemen , 7 (2).
Norman, D., & Nielsen, Y. (2023). The Definition of User Experience (UX) . Https://Www.Nngroup.Com/Articles/Definitio n-User-Experience/.
Prabowo,  G.  (2022). Inilah  3  Aspek  Penting  yang Bikin Pelanggan e-Commerce Puas, Gak Cuma Promo . Https://Nextren.Grid.Id/Read/013607618/Inila h-3-Aspek-Penting-Yang-Bikin-Pelanggan-e- Commerce-Puas-Gak-Cuma-Promo?Page=all.
Putra, R. R., Kom, S., Kom, M., & Putra, E. (2023).
Design  User  Interface  Sistem  Informasi Pengelompokan  Data  Warga  Dengan  Metode Human Centered Design . http://tahtamedia.co.id/index.php/issj/article/vi ew/145/146
Rizal, S., & Saputra, S. A. (2023). PERANCANGAN
UI/UX  DESIGNPADA  APLIKASI  JASA FREELANCERBERBASIS ANDROIDMENGGUNAKAN METODE USER  CENTERED  DESIGN. Jurnal  Ilmiah MATRIK , 25 (1).
Supardianto,  R.,  &  Binsar  Tampubolon,  A.  (2020). Penerapan UCD (User Centered Design) Pada Perancangan  Sistem  Informasi.  In Journal  of Applied  Informatics  and  Computing  (JAIC) (Vol. 4, Issue 1). http://jurnal.polibatam.ac.id/index.php/JAIC Yaputra,  M.  (2023).  Peran  User-Centered  Design terhadap Perancangan User Experience Aplikasi  Community  Marketplace. JDMIS: Journal  of  Data  Mining  and  Information System , 1 (1), 48–55. https://doi.org/10.54259/jdmis.v1i1.1525