## SISTEM INFORMASI PENJUALAN SAYUR MAYUR BERBASIS WEBSITE MENGGUNAKAN METODE USER CENTERED DESIGN
Aprilia Tika Rahayu 1 , Septi Andryana 2
1,2 Sistem Informasi, Fakultas Teknologi Komunikasi dan Informatika, Universitas Nasional email :  apriliatikarahayu2019@student.unas.ac.id 1
Abstrak: Toko Sayur Mayur Om Hendrik melakukan penjualan dan pembelian sayur mayur yang dilakukan secara langsung antara  penjual  dan  pembeli.  Seringkali  kenaikan  harga  sayur  mayur  yang  tiba-tiba  naik  membuat  Toko  Om  Hendrik mendapatkan komplain dari pembelinya. Oleh karena itu, dibutuhkan sebuah platform untuk promosi, sistem informasi yang dapat digunakan untuk transaksi penjualan, dan pemesanan melalui WhatsApp. Sisi client dan server dari sistem ini dibangun. Fondasi sistem ini adalah sebuah situs web yang ditulis dalam bahasa pemrograman PHP dan basis data MySQL. Metode UCD ( User Centered Design ) digunakan untuk membuat website ini, dan diagram UML ( Unified Modeling Language ) digunakan untuk menjelaskan studi perancangan sistem. Sistem informasi penjualan sayuran yang dibangun meliputi pembuatan laporan berkala secara otomatis, informasi ketersediaan stok sayuran, dan layanan pesan sayuran secara online yang terhubung dengan chatting WhatsApp . Sistem informasi ini dikembangkan untuk meningkatkan Toko Sayur Om Hendrik secara signifikan.
Kata Kunci : Sistem Informasi, Sayuraan, Penjualan, Website, UCD
Abstract:  Toko  Sayur  Mayur  Om  Hendrik  runs  a  vegetable  shopping  transaction  between seller  and buyer  directly.  Uncle Hendrik's store often get many complaints because of sudden cost increase of vegetable. Therefore, we need a platform for promotion, an information system that can be used for sales transactions, and ordering via WhatsApp. The client and server sides of this system are constructed. The system's foundation is a website written in the PHP programming language and a MySQL database. The UCD (User Centered Design) method was utilized to create this website, and a UML (Unified Modeling Language)  diagram  was used  to  explain the system design  study.  The built-in  vegetable sales  information system  includes automatic periodic report production, information on the availability of vegetable stock, and online vegetable message services linked to WhatsApp chat. This information system is intended to give a huge contribution for Toko Sayur Mayur Om Hendrik
Keywords : Information Systems, Vegetables, Sale , Website UCD

## PENDAHULUAN
Sayur  merupakan  sumber  mata  pencaharian untuk  petani  sayur  maupun  masyarakat  diberbagai skala sebab sayur memiliki nilai tinggi disegi ekonomi [1].  Sayuran  kini  dapat  memenuhi  permintaan konsumen  domestik  baik  melalui  pasar  modern maupun pasar tradisinal seiring dengan meningkatnya potensi penyerapan pasar [2] . Pada era globalisasi saat ini perubahan banyak terjadi di kehidupan masyarakat yang menjadikan tunututan bagi manusia untuk dapat beradaptasi  dan  mengikuti  perkembangan  zaman tersebut.  Dampak  baik  dari  globalisasi  terhadap masyarakat  adalah  kemudahan  untuk  mendapatkan pengetahuan  di  mana  saja  dan  kapan  saja,  yang merupakan hasil langsung dari kemajuan teknis yang terjadi dalam beberapa dekade terakhir [3].
Toko  Om  Hendrik  merupakan  bisnis  yang bergerak  dalam  bidang  jual  beli  sayur  mayur  segar. Disini  Toko  Om  Hendrik  berperan  sebagai  suplier sayuran langsung pada pembeli atau customer . Produk sayuran yang disediakan sendiri dijual segar dan telah melewati  pemeriksaan  mutu  untuk  menjaga  kualitas produk.  Tidak  hanya  mengantarkan  pesanan  dalam jumlah banyak ke lokasi pembeli, Toko Om Hendrik juga menerima pembeli yang datang langsung secara ecer.
Transaksi  jual-beli  di  Toko  Om  Hendrik  untuk keseharian  masihlah  menggunakan  cara  manual dengan  perhitungan  dilakukan  oleh  pemilik  sendiri. Hal  ini  sering  menimbulkan  kesalahan  baik  salah memberi harga maupun saat menghitung total belanja pembeli. Terlebih jika toko sedang ramai dan pembeli telah  antri  untuk  melakukan  pembayaran.  Pemilik membutuhkan sebuah alat bantu transaksi yang cepat, efisien,  dan  mampu  meminimalisir  kesalahan.  Akan lebih bagus jika mampu juga memperikan eksposure untuk  bisnis  yang  kini  masihlah  bersifat  lokal  atau jangkauannya terbatas.
Penulis membuat  sistem informasi  penjualan ini menggunakan  metodologi  desain  yang  dikenal sebagai User  Centered  Design (UCD),  yang menekankan  pada  kebutuhan  pengguna  akhir. Pendekatan UCD mengoptimalkan  pada  bagian kebutuhan dan keinginan end-user pada pengunggunaan  produk  maka  dari  itu  produk  dapat berkembang  dan  bermanfaat  yang  akan  membuat pengguna lebih mudah menggunakannya [4].
Pengujian dalam penelitian melibatkan penentuan aspek positif dan negatif dari sebuah sistem dengan  menggunakan  teknik System  Usability  Scale (SUS  digunakan  untuk  menentukan  seberapa  baik sistem ini digunakan). Pendekatan SUS telah terbukti
valid  dalam  menentukan  apakah  sistem  dapat digunakan  secara  efektif,  dan  penelitian  yang dilakukan  oleh  James  R.  Lewis  menemukan  bahwa teknik ini memiliki manfaat  karena mudah dipahami dan diterima oleh responden [5].
Jadi, saya mempertimbangkan untuk menjadikan isu-isu  ini,  bersama  dengan  temuan-temuan  dari analisis  penelitian  sebelumnya,  sebagai  subjek  dari tugas  akhir  dengan  tajuk: “SISTEM  INFORMASI PENJUALAN  SAYUR  MAYUR  BERBASIS WEBSITE  MENGGUNAKAN  METODE  USER CENTERED DESIGN” . .

## TINJAUAN PUSTAKA Konsep Dasar Sistem
System  merupakan  keterkaitan  antar  elemen untuk melakukan proses ( Input) sisitem tersebut yang menjadi  tujuan  dan  masuknya  data  kemudian  diolah sampai  memperoleh  hasil  informasi  ( Output) yang pengguna  harapkan  [6].  Sesuatu  yang  digunakan untuk  mengubah input menjadi output .  Merupakan efek akhir dari beberapa tindakan sebelumnya. Semua sistem  memiliki input,  output ,  batasan,  tujuan,  dan feedback [7] .

## Sistem Informasi
Sistem  informasi  adalah  suatu  solusi  dalam sebuah  organisasi  dalam  memcecahkan  suatu permasalahan hal tersebut sangat penting bagi anggota organisasi  dalam  menghadapi  tantangan  dimasa sekarang dan depan. Sistem informasi memiliki peran sebagai  pengambilan  keputusan  maka  organisasi sangat penting informasi bersakutan dengan kebutuhannya.  Sistem  informasi  bertujuan  sebagai cara  untuk  membantu  sesorang  dalam  mengambil keputusan organisasi secara menyeluruh [8].

## Sayur Mayur
Sayuran  adalah  makanan  pokok  dalam  menu kebanyakan orang, oleh karena itu sayuran memiliki nilai  moneter  yang  tinggi  sebagai  akibat  dari permintaan  yang  konstan.  Nilai  ekonomi  produk hortikultura bagi  petani dan masyarakat  cukup besar karena harga jual yang tinggi, keragaman, aksesibilitas  lahan  dan  teknologi,  serta  masa  depan yang  menjanjikan  baik  di  pasar  domestik  maupun global.  Bahkan  salah  satu  pemasok  kebutuhan konsumen di dalam negri yaitu sayur [9].

## Website
Website  merupakan  suatu  kumpulan  dari beberapa  elemen  seperti  tekss,  animsi  suara,  dan gambar,  dll.  Maka  dari  itu  media  yang  banyak digunakan  sebagai  informasi  dikarenakan  informasi yang  menarik  adalah  web.  Cara  kerja  web  yaitu dengan  identifikasi,  pengumpulan,  pengelola  juga penyediaan akses bersama-sama hal tersebut merupakan cara web mengolah suatu informasi [10].
User Centered Design (UCD) UCD, atau user-centered design , adalah pendekatan baru untuk membuat sistem berbasis web. Menurut  definisi  lain  yang  diberikan  oleh  Saputri dkk.,  user-centered  design  adalah  proses  desain antarmuka  yang  mengutamakan  tujuan  kegunaan, karakteristik  pengguna,  lingkungan,  tugas,  dan  alur kerja. Definisi ini didasarkan pada 1SO 13407 (1999). Peningkatan  berkelanjutan  merupakan  ciri  khas  dari UCD,  yang  merupakan  proses  berulang  di  mana desain dan penilaian dibangun dari bawah ke atas [10].

## Perancangan Sistem
UML  ( Unified  Modeling  Language )  merupakan bahasa  simple  biasanya  diperuntukan  sebagai  bahan menganalisis daan desain, mendefinisikan requirement,  dan  sebagai  gambaran  arsitekrut  dalam pemrograman  kearah  objek.  Pemodelan  system informasi  yang  akan  di  buat  merupakan  yaitu penjelasan dari Use case interaksi antara suatu system dengan  systemnya  sendiri  berkerja  dengan  cara mendeskripsikan  tipikal  interaksi  antar  pengguna system  [11] . Activity  Diagram adalah  representasi visual  dari  alur kerja berbasis menu perangkat  lunak atau  sistem  proses  bisnis . Activity  Diagram tidak seperti flowchart tradisional  yang  digerakkan  oleh aktor,  karena  sistem  itu  sendiri  yang  melakukan aktivitas, bukan actor [12]. Gambaran umum struktur sistem dalam hal menspesifikasikan kelas-kelas yang akan digunakan untuk membangun sistem ditunjukkan  oleh class  diagr.am.  Balsamiq  mockups adalah software yang  banyak  digunakan  guna membuat  suatu  tampilan  antar  muka  pengguna  juga interface user aplikasi.
PHP yaitu singkatan dari (Hypertext Prepocessor) merupakan  bahasa  pemograman  berbasis  web  yang memiliki kemampuan untuk memproses dan mengolah  data  secara  dinamis.  PHP  adalah  server- side embedded script language artinya, semua sintaks dan  perintah,  program  yang  ditulis  akan  sepenuhnya dijalankan  oleh  server,  tetapi  dapat  disertakan  pada halaman HTML biasa [13].
MYSQL  biasa  juga  disebut  Structured  query languange  (SQL).  Pengolahan  database  salah  satu bahasa  yang  dapat  digunakan  yaitu  SQL.  Database dari  managemen  MYSQL  memiliki  syifat  rasional. Hal  tersebut  dapat  diartikan  bahwa  manipulasi  data jauh  lebih  cepat  pada  pengelolaan  data  base  yang tabelnya terpisah [14].
Codeigniter  merupakan  sebuah  framework  PHP yang  membantu  developer  mempercepat  proses pengembangan aplikasi web berbasis PHP [15]

## Pengujian
System  Usability  Scale  (SUS) merupakan metode  pengukuran  pada  aplikasi  dengan  melihat kepuasan pada pengguna.. Kuesioner pada SUS berisi pertanyaan  positif  dan  negatif  dengan  menggunakan 10  pertanyaan  yang  berbeda  untuk  perbandingan. Bernilai  positif  merupakan  pertanyaan  ganjil  dan
bernilai  negative  merupakan  pertanyaan  genap.  Poin responden dikurangi satu ketika pertanyaan bernomer urut  ganjil.  Poin  reponden  digunakan  untuk mengurangi  lima  ketika  pertanyaan  bernomor  urut genap.
Poin ganjil = ∑Px –  1 Poin genap = 5 − ∑𝑃𝑥 Pertanyaan ganji dan genap merupakan penyesuaian untuk  nilai  pertanyaan, nilai  pertanyaan sama dengan P. Setelah penjumlahan semua hasil dari pertanyaan kemudian dibagi 2,5. ( ∑ poin ganjil + ∑ poin genap ) x 2,5 Hasil  semua  responden  di rata-ratakan.  Setelah itu  penjumlahan  semua  poin  dibagi  dengan  jumlah reponden.
X ̅= ∑ x n Dimana nilai rata-rata dinyatakan dengan simbol X. Dengan begitu nilai poin akhir dari kuesioner SUS berada  pada  rentang  0-100.  Tinggi  rendahnya usability dan acceptable dari  desain  sisitem  aplikasi yang  dikembangkan dapat  dilihat  dari  nilai  akhir kuesioner SUS.

## Populasi
Semua tujuh puluh lima pelanggan Toko Sayur Mayur Om Hendrik termasuk dalam populasi. Ketika jumlah sampel yang lebih besar dari populasi saat ini lebih  disukai,  peneliti  tetap  diharuskan  untuk mengumpulkan  setidaknya  30  sampel.  Menurut Baley,  ukuran  sampel  penelitian  harus  minimal  30 orang agar analisis statistik menjadi valid.

## METODE
Subyek penelitian dapat berupa orang, lokasi, atau benda  itu  sendiri.  Toko  Sayur  Mayur  Om  Hendrik menjadi  subyek  penelitian  ini.  Para  peserta  dalam penelitian ini berfungsi sebagai kelompok beta untuk fungsionalitas  informasi  situs  web.  Penelitian  ini bertujuan  untuk  menganalisis  efektivitas  Sistem Informasi  Penjualan  Sayuran.  Berikut  ini  adalah rincian  lokasi  penelitian  penulis  dan  waktu pelaksanaannya:
Tempat Penelitian : Lapak Toko Sayur Mayur Om Hendrik.
Alamat : Pasar Palmeriam BLOK ALB1 121-122 Lapak Jl.  Kayu  Manis  Lama  1  No.14, RT.13/RW.7,  Palmeriam,  Kec.
Matraman,  Kota  Jakarta  Timur,
Daerah  Khusus  Ibukota  Jakarta
13140.
Waktu Penelitian : Penelitian ini dilakukan dalam waktu 3 bulan (September- November 2022).

## Diagram Alir Penelitian
Gambaran  umum  dari  proses  penelitian  yang terlibat dalam pembuatan Sistem Informasi Penjualan Sayuran  dengan  menggunakan  pendekatan  yang berpusat  pada  pengguna  disediakan  di  bagian  ini.
Langkah-langkah  investigasi  ini,  yang  ditunjukkan pada Gambar 1, adalah sebagai berikut:

## Gambar 1. Diagram Alir Penelitian Pengujian
Metode System Usability Scale (SUS) digunakan sebagai alat pengujian kepuasan user dimana terdapat 10  pertanyaan  yang  disiapkan  dengan  bobot  yang berbeda  antara  pertanyaan  ganjil  dan  genap.  Jika sistem  yang  dibangun  adalah  perangkat  lunak  yang siap  pakai,  sistem  tersebut  harus  diuji  sebelum digunakan  untuk  memastikan  pengoperasian  yang tepat.  Penelitian  ini  menguji  kegunaan  dengan menggunakan SUS.

## HASIL DAN PEMBAHASAN A. HASIL

## Specify The Content of Use
Pada  Sistem  Informasi  Penjualan  Sayur  Mayur ini memiliki 2 (dua) pengguna atau actor, yaitu Admin dan Konsumen .
Specify The User & Organizational Requirements Berdasarkan hasil wawancara dengan Om Hendrik maka  didapatkan  beberapa  kesimpulan  untuk pengembangan sistem, diantaranya yaitu :
a. Toko lapak sayur Om Hendrik masih menggunakan  sistem  offline  sehingga  untuk mengetahui  informasi  harga  dan  stok  sayur  yang tersedia  konsumen  masih  harus  datang  langsung ke toko.Untuk mempermudah dan
b. Memperluas  jangkauan  pemasaran  diperlukan sistem jual beli online berbasis website.
c. Sistem  informasi  penjualan  sayur  mayur  terdiri dari 2 aktor yaitu Admin dan Konsumen.
d. Ongkir  disesuaikan  oleh  toko  sayur  om  Hendrik saat proses pembayaran.
e. Model bisnis yang terdapat pada toko sayur mayur om  Hendrik  bersifat  B2B  dan  B2C,  dimana  B2B (Bussines to Bussines) berarti penyediaan produk om Hendrik dapat dijual ke pebisnis lain. Dan B2C (Bussines to Customer) yang artisnya produk toko sayur mayur om Hendrik juga di jual ke konsumen

## Perancangan

## Produce Design Solution
Sebelum  merancang  website  peneliti  terlebih dahulu  membuat  rancangan  antarmuka  berdasarkan dari hasil wawancara yang sudah dilakukan. Tahap ini dilakukan  untuk  memberikan  gambaran  kepada pengguna agar lebih mudah memahami website yang akan  dirancang.  Pada  penelitian  ini  menggunakan beberapa jenis design diantaranya yaitu, desain UML, desain  basis  data (database) ,  desain  Antarmuka (interface) dalam bentuk low fidelity .
a. Desain Unified Modelling Language (UML)
• Use Case
Sistem  informasi  penjualan  sayur  mayur memiliki dua actor yang masing-masing memiliki keistimewaannya  sendiri,  dua  actor  tersebut antara lain adalah admin dan konsumen.
Tabel 1. Deskripsi Actor Pada Use Case Diagram No  Aktor Deskripsi 1. Admin Pengguna dari toko lapak sayur om Hendrik yang memiliki akses penuh terhadap pengelolaan sistem.
2. Konsumen  Pengguna yang memiliki akses terbatas dalam sistem.
Gambar 2. Use Case Diagram
• Activity Diagram Activity diagram  merupakan gambaran aktivitas yang  ada  didalam  suatu  sistem.  Berikut  ini merupakan activity  diagram yang  terdapat  pada sistem informasi penjualan sayur mayur.

## Gambar 3. Activity Diagram Login
Activity  diagram  dari  aktivitas  login  pengguna sistem  informasi  penjualan  sayur  mayur  dengan menginputkan  username  dan  password  untuk  akses kedalam sistem.
a. Activity Diagram Admin
Gambar 4. Activity Diagram Kelola Produk
Admin  dapat  melakukan  kegiatan  menambah, melihat,  mengedit,  dan  menghapus  data.  Untuk melakukan  hal  tersebut  admin  harus  login  ke  dalam sistem terlebih dahulu.
Gambar 5. Activity Diagram Kelola Kategori Sayur
Gambar  5.  merupakan  aktivitas  mengolah  data kategori  sayur  yang  mana  hanya  admin  yang  dapat melakukan  kegiatan,  tambah,  edit,  hapus,  dan  lihat data.  Admin  diharuskan  untuk  login  terlebih  dahulu untuk melakukan aksi tersebut.
Gambar 6. Activity Diagram Buat Transaksi Penjualan
Gambar  6,  merupakan  aktivitas  menginputkan transaksi  pembelian  dari  customer  yang  datang  ke toko.  Admin  akan  memilih  produk,  memasukan jumlah pembelian, hingga mencetak bukti belanja  di sistem.

## Gambar 7. Activity Diagram Cetak Laporan Penjualan
Gambar  7.  merupakan aktifitas mencetak laporan penjualan  pada  sistem  informasi  penjualan  sayur mayur, Untuk dapat mencetak laporan diperlukan hak akses sebagai admin.

## b. Activity Diagram Konsumen

## Gambar 8. Activty Diagram Lihat Produk
Gambar 8, merupakan aktifitas ini adalah saat user atau  konsumen  membuka  website  dan  melihat  list sayur  yang  dijual.  Dengan  cara  klik  pada  gambar sayur  yang  ingin  dilihat,  maka  konsumen  dapat membaca  detail  barang  serta  stock  yang  ada.  Stock bersifat live artinya itu adalah stock sebenarnya yang ada ditoko.

## Gambar 9. Activity Diagram Memesan Produk
Gambar  9.  merupakan  gambaran  aktifitas/proses konsumen  dalam  melakukan  memesan  produk  sayur dari website. Sistem akan menyambungkan customer ke penjual atau admin melalui button Whatsapp , dan akan  diarahkan  ke  chatroom  untuk  dapat  langsung melakukan transaksi bersama penjual.
• Class Diagram
Dalam  membangun  system  perlu  adanya Class diagram sebagai  penggambaran  struktur  untuk mendefinisikan  kelas-kelas.  Berikut  ini  adalah  kelas diagram  dari  sistem  penjualan  sayur  mayur  pada penelitian ini.
Gambar 10. Class Diagram
b. Desain Antarmuka (Interface) Dalam  pembangunan  sistem  informasi  penjualan sayur  mayur  diperlukan  wireframe  desain  interface sebagai gambaran untuk pengguna bagaimana sistem akan  berjalan,  pada  penelitian  ini  desain  interface akan dibuat dalam bentuk low fidelity .
a) Halaman Login Form  login ,  terdiri  dari  inputan username , password ,  dan combobox untuk  memilih level user . Kemudian ada button ‘Masuk’ untuk login .
Gambar 11. Perancangan Halaman Login
b) Perancangan Halaman Home Halaman  Home  adalah  halaman  utama  ketika membuka  website  Penjualan  Sayur  Om  Hendrik. Dalam halaman ini terdiri dari profil Lapak sayur Om Hendrik dan List sayur yang dijual.
Gambar 12. Perancangan Halaman Home
c) Perancangan Halaman Tentang Kami
Halaman  ini  adalah  halaman  berisi  informasi mengenai  sejarah  berdirinya  Lapak  Sayur  Om Hendrik.
d) Perancangan Halaman Informasi Sayur
Halaman ini adalah halaman untuk melihat semua list  produk  yang  dijual.  Disini  produk  akan ditampilkan  semua,  beserta  stock  dan  informasinya. User  dapat  meng-klik  setiap  produk  untuk  dapat melihat detail.
Gambar 14. Perancangan Halaman Informasi Sayur
e) Perancangan Halaman Kontak kami
Halaman  ini  berisi  informasi  lokasi  dengan google  maps,  nomor  telepon,  dan  alamat  lengkap toko.  User  dapat  menggunakan  halaman  ini  untuk melihat informasi cara menghubungi pemilik ataupun jika ingin mendatangi toko secara langsung.
Gambar 15. Perancangan Halaman Kontak kami
f) Perancangan Halaman Keranjang (admin)
Halaman  ini  adalah  halaman  untuk  melihat  list sayur yang telah diinput oleh Admin saat ada transaksi pembelian.  Disini  admin  dapat  memilih  produk  dan menambahkan produk pada list belanja.
Gambar 16. Perancangan Halaman Keranjang
g) Perancangan Halaman Dashboard (Admin) Halaman  dashboard  adalah  halaman  yang pertama  kali  muncul  Ketika  admin  berhasil melakukan  login.  Halaman  ini  berisi  jumlah keseluruhan  sayur,  konsumen,  dan  transaksi  yang telah dilakukan.
Gambar 17. Perancangan Halaman Dashboard h) Perancangan Halaman Kategori (Admin)
Halaman kategori adalah halaman yang digunakan untuk melakukan Kelola data kagori sayur. Admin  dapat  melakukan  tambah  kategori,  mengedit data yang sudah disimpan dan menghapusnya.
Gambar 18. Perancangan Halaman Kategori
i) Perancangan Halaman Sayur (Admin)
Halaman  kategori  yaitu  tempat  yang  digunakan untuk  malakukan  kelola  data  sayur.  Admin  dapat
melakukan  tambah  sayur  baru,  mengedit  data  yang sudah disimpan dan menghapusnya.
Gambar 19. Perancangan Halaman Kelola Sayur
j) Perancangan Halaman Pembelian Masuk
(Admin)
Halaman  ini  digunakan  admin  untuk  melihat rekam  transaksi  yang  dilakukan.  Disini  akan ditampilkan  detail  tarnsaksi  seperti  tanggal,  produk, dan total belanja.
Gambar 20.  Perancangan Halaman Pembelian Masuk
k) Perancangan Halaman Laporan (Admin)
Halaman laporan adalah halaman yang digunakan admin  untuk  melakukan  atau  mencetak  histori penjualan yang telah dilakukan.
Gambar 21. Perancangan Halaman Laporan
l) Perancangan Halaman Ubah Password (Admin) Halaman  ubah  password  adalah  halaman  yang digunakan  user  untuk  melakukan  ubah  password. Halaman  ini  digunakan  user  ketika  password  lama yang digunakan lupa atau ingin menggantinya.

## Gambar 22. Perancangan Halaman Ubah Password

## Implementasi
Berikut  adalah  hasil  implementasi  sistem penjualan sayur mayur pada Lapak Sayur Om Hendrik menggunakan PHP dan MySQL :
a) Halaman Login
Form  login ,  terdiri  dari  inputan username , password ,  dan combobox untuk  memilih level user . Kemudian ada button ‘Masuk’ untuk login .

## Gambar 23. Halaman Login
b) Halaman Home Halaman  Home  adalah  halaman  utama  Ketika membuka  website  Penjualan  Sayur  Om  Hendrik. Dalam halaman ini terdiri dari profil Lapak sayur Om Hendrik  dan  List  sayur  yang  dijual.  Jika  status konsumen  sudah  login,  maka  konsumen  bisa Memasukan sayuran tersebut untuk dipilih.
c) Halaman Tentang Kami
Halaman  ini  adalah  halaman  berisi  informasi mengenai  sejarah  berdirinya  Lapak  Sayur  Om Hendrik.
Gambar 25. Halaman Tentang Kami
d) Halaman Keranjang
Halaman  ini  adalah  halaman  untuk  melihat  list sayur  yang  diinput  oleh  Admin  saat  ada  transaksi pembelian.  Disini  admin  dapat  memilih  produk  dan menambahkan produk pada list belanja.
Gambar 26.  Halaman Keranjang
e) Halaman Dashboard
Halaman dashboard yaitu halaman yang menjadi tampilan awal ketika admin berhasail masuk. Isi dari halaman  ini  yaitu  jumlah  keseluruhan  sayur, konsumen, dan transaksi yang telah dilakukan.
f) Halaman Kategori (Admin) Halaman kategori adalah halaman yang digunakan untuk melakukan Kelola data kagori sayur. Admin  dapat  melakukan  tambah  kategori,  mengedit data yang sudah disimpan dan menghapusnya.
Gambar 28. Halaman Kategori
g) Halaman Sayur (Admin)
Halaman kategori adalah halaman yang digunakan  untuk  melakukan  Kelola  data  sayur. Admin dapat melakukan tambah sayur baru, mengedit data yang sudah disimpan dan menghapusnya.

## Gambar 29. Halaman Kelola Sayur
h) Halaman Pembelian Masuk
Halaman  ini  digunakan  admin  untuk  melihat semua transaksi. Dalam halaman ini admin bisa total pertransaksi,  tanggal,  bahkan  detail  barang  yang dijual.
i) Halaman Laporan (Admin)
Halaman laporan adalah halaman yang digunakan admin  untuk  melakukan  atau  mencetak  histori penjualan yang telah dilakukan.
Gambar 31. Halaman Laporan
j) Halaman Ubah Password
Halaman  ubah  password  adalah  halaman  yang digunakan  user  untuk  melakukan  ubah  password. Halaman  ini  digunakan  user  Ketika  password  lama yang digunakan lupa atau ingin menggantinya.

## Gambar 32. Halaman Ubah Password

## Hasil Pengujian
Pengujian  pada  penelitian  ini  menggunakan System  Usability  Scale (SUS),  Rata-rata  nilai kuesioner System  Usability  Scale (SUS)  yang  telah dilakukan  oleh  pengguna merupakan  tolak  ukur  dari kepuasan  pengguna.  Analisis  dilakukan  berdasarkan rumus perhitungan kuesioner System Usability Scale (SUS)  dan  uji  statistic.  Untuk  menilai  tingkat kepuasan  user/pengguna  saat  menggunakan  Sistem Penjualan  Toko  Lapak  Sayur  Mayur  Berbasis Website.  Ressponden  yang  sudah  menggunakan system kemudian diberikan kuesioner SUS ini.
Setelah rekaptulasi kuesioner SUS telah dilaksanakan,  maka  dilakukan  perhitungan  sesuai dengan  rumus  kuesioner  SUS  yaitu  untuk  nomor ganjil poin yang diberikan kepada user yaitu dikurang 1  kemudian  untuk  pertanyaan  genap  yaitu  dengan mengurangkan  lima  dengan  poin  yang  diberikan kepada  user  yaitu  skor  responden.  Setelah  itu dilakukan penjumlahan untuk semua hasil pertanyaan
setiap  responden  kemudian  semua  hasil  dibagi  2,5. Kemudian hasilnya di rata-rata dari semua responden. Hasil  akhir  yaitu  menjumlahakan  semua  hasil  skor lalu dibagi dengan banyaknya jumlah responden.
Dengan  menggunakan  rumus  SUS  diatas didapatkan hasil total rata-rata keseluruhan yaitu 74,5. Nilai tersebut dapat dikategorikan sebagai acceptable . Perhitungan  diatas  merupakan  skor  nilai  SUS  yang dilakukan oleh 45 responden.

## KESIMPULAN DAN SARAN
A. Kesimpulan Penelitian ini mempunyai tujuan yaitu menyediakan  platform  bagi  penjual  sayur  mayur berbasis  website.  Maka  dari  itu  peneliti  dalat mengambil  kesimpulan  bahwa  setelah  adanya perancangan desain  user  interface menggunakan metode user centred desain, setelah itu dilakukan uji kepuasan  user  atau  pengguna  hasil  yang  diperoleh yaitu  74,5%  hal  tersebut  masuk  kedalam  kategori acceptable dengan  arti  bahwa  pengguna  memiliki respon positif.

## B. Saran
Saran  dari  penelitian  sebagai  referensi  untuk peneliti selanjutnya berdasarkan hasil dan kesimpulan, berikut adalah saran dari peneliti : a) Pembuatan desain lebih inovatif dengan menggunakan  metode  yang  lain  seperti human centered design atau design thinking .
b) Pengembangan  lebih  lanjut  sepeti  pembuatan desain  yang  dibuat  dalam  bentuk  mobile,  agar responsive untuk digunakan di mobile.

## DAFTAR PUSTAKA
[1] Ekawati, R., Saputri, L. H., Kusumawati, A., Paonganan, L., & Ingesti, P. S. V. R. (2021). Optimalisasi  Lahan  Pekarangan  dengan Budidaya  Tanaman  Sayuran  sebagai  Salah Satu  Alternatif  dalam  Mencapai  Strategi Kemandirian  Pangan.  PRIMA:  Journal  of Community Empowering and Services, 5(1),
19.
https://doi.org/10.20961/prima.v5i1.42397
[2] N.  Zuraika,  T.  Sebayang,  and  T.  Supriana, “Analisis  Pengaruh  Bauran  Pemasaran  dan Karakteristik  Konsumen  Terhadap  Volume Pembelian Sayuran Hijau di Pasar Modern di Kota Medan,” J. Soc. Econ. Agric. Agribus., vol. 9, no. 10, pp. 1–15, 2018.
[3] A. Hermawanto and M. Anggraini,
Globalisasi, Revolusi Digital dan Lokalitas : Dinamika Internasional dan Domestik di Era Borderless  World .  Yogyakarta:  LPPM  UPN VY PRESS, 2020.
[4] R.  B.  Utomo,  “Aplikasi  Pembelajaran Manasik Haji dan Umroh berbasis Multimedia  dengan  Metode  User  Centered
Design (UCD),” J. Sains Komput. Inform. , vol. 3, no. 1, pp. 68–79, 2019, [Online]. Available: http://tunasbangsa.ac.id/ejurnal/index.php/jsa kti .
[5] J. R. Lewis and J. Sauro, “Can I Leave This One  Out?  The  Effect  of  Dropping  an  Item From the SUS,” J. Usability Stud. , vol. 13, no. 1, pp. 38–46, 2017.
[6] A.  Kristanto, Perancangan  Sistem  Informasi dan  Aplikasinya .  Yogyakarta:  Gava  Media, 2018.
[7] N.  Kristanto,  “Analisa  Dan  Perancangan
Sistem Informasi E-Booking Property
Berbasis  Android,” JUSIBI  (Jurnal  Sist.  Inf. dan E-Bisnis) , vol. 2, no. 5, pp. 540–556, 2021, doi: 10.54650/jusibi.v2i5.231 . [8] M.  Rakhmadian,  S.  Hidayatullah,  and  H.
Respati,  “Analisis  Kualitas  Sistem  Dan Kualitas  Informasi  Terhadap  Kepuasan
Pemakai Sistem Informasi Akademik Dosen,” in Seminar Nasional Sistem Informasi , 2017,
pp. 665–675.
[9] D.  Syahputra,  “Analisis  Perilaku  Konsumen
Sayur  Mayur  Pada  Pasar  Modern  Di Kecamatan Medan Sunggal,” J. Ilm. Mhs. , vol.
1, no. 2, 2021.
[10] Y.  Wahyudin  and  D.  N.  Rahayu,  “Analisis Metode  Pengembangan  Sistem  Informasi Berbasis  Website:  A  Literatur  Review,” J. Interkom  J.  Publ.  Ilm.  Bid.  Teknol.  Inf.  dan Komun. , vol. 15, no. 3, pp. 26–40, 2020, doi: 10.35969/interkom.v15i3.74 .
[11] I.  S.  Y.  Saputri,  M.  Fadli,  and  I.  Surya, “Implementasi  E-Commerce  Menggunakan
Metode  UCD  (User  Centered  Design)
Berbasis  Web,” J.  Aksara  Komput.  Terap. , vol.  6,  no.  2,  pp.  269–278,  2017,  [Online]. Available: https://jurnal.pcr.ac.id/index.php/jakt/article/ view/1378 . [12] D.  W.  T.  Putra  and  R.  Andriani,  “Unified
Modelling Language (UML) dalam
Perancangan  Sistem  Informasi  Permohonan Pembayaran Restitusi SPPD,” J. Teknoif Tek. Inform. Inst. Teknol. Padang , vol. 7, no. 1, pp. 32–39, 2019,
doi:
10.21063/jtif.2019.V7.1.32-39 .
[13] Putra,  D.  W.  T.,  &  Andriani,  R.  (2019). Unified  modelling  language  (uml)  dalam perancangan  sistem  informasi  permohonan pembayaran  restitusi  sppd.  Jurnal  Teknoif
Teknik Informatika Institut Teknologi Padang,
7(1), 32–39.
[14] Fadila,  R.  R.,  Aprison,  W.,  &  Musril,  H.  A. (2021). Perancangan Perizinan Santri Menggunakan Bahasa Pemograman PHP/MySQL  Di  SMP  Nurul  Ikhlas.  CSRID (Computer Science Research and Its Development Journal), 11(2), 84. https://doi.org/10.22303/csrid.11.2.2019.84-
95
[15] Saed Novendri, M., Saputra, A., Firman, C. E., Manajemen  Informatika,  J.,  Dumai,  A., Informatika, J. T., Dumai, S., Informatika, J. M.,  Karya,  J.  U.,  Batrem,  B.,  &  Kode,  D.-. (n.d.).  APLIKASI  INVENTARIS  BARANG PADA  MTS  NURUL  ISLAM  DUMAI MENGGUNAKAN PHP DAN MYSQL.