## Journal of Information System Research (JOSH)
Volume 4, No. 2, Januari 2023, pp 458 − 469 ISSN 2686-228X (media online) https://ejurnal.seminar-id.com/index.php/josh/ DOI 10.47065/josh.v4i2.2687

## Aplikasi E-Commerce Galeri Lembaga Adat Melayu Riau Berbasis Mobile Menggunakan Flutter Menerapkan Metode Waterfall
Andrian Wahyu * , Muhammad Affandes, Pizaini, Yelfi Vitriani, Iwan Iskandar
Fakultas Sains dan Teknologi,S1 Teknik Informatika, Universitas Sultan Syarif Kasim Riau, Pekanbaru Jl. HR. Soebrantas No.Km. 15, RW.15, Simpang Baru, Kota Pekanbaru, Riau, Indonesia Email: 1,* 11850112219@students.uin-suska.ac.id, 2 affandes@uin-suska.ac.id, 3 pizaini@uin-suska.ac.id,
4 yelfi.vitriani@uin-suska.ac.id, 5 iwan.iskandar@uin-suska.ac.id Email Penulis Korespondensi: 11850112219@students.uin-suska.ac.id Submitted: 15/12/2022 ; Accepted: 19/01/2023 ; Published: 21/01/2023
Abstrak −Galeri LAM Riau merupakan sebuah upaya Sentra Budaya dan Ekonomi Kreatif Lembaga Adat Melayu Riau untuk memamerkan produk produk khas daerah Riau yang meliputi kuliner, oleh-oleh, pakaian dan kerajinan khas Riau. Galeri LAM Riau ini merupakan binaan PT Pertamina Hulu Rokan untuk memajukan produk umkm daerah dan mengetahui apa saja tradisi yang ada di Riau. Melihat proses bisnis yang dilakukan oleh Galeri LAM Riau, masih banyak kegiatan jual beli yang dilakukan belum  memanfaatkan  perkembangan  teknologi  dan  konsep  e-commerce.  Proses  transaksi  secara  e-commerce  ini  terbilang cukup penting karena di era globalisasi saat ini sangat memudahkan banyak pekerjaan dan membantu banyak pihak. Aplikasi flutter e-commerce Galeri LAM Riau ini dapat menjadi solusi untuk menghasilkan keluaran produk yang dapat membantu proses transaksi jual beli di Galeri LAM Riau tersebut dengan perancangan metode waterfall. Metode waterfall ini mempunyai alur  pekerjaan  yang  cukup  jelas,  waktu  pekerjaan  yang  terukur  dan  dokumentasi  yang  jelas.  Dengan  kelebi han  tersebut membuat  biaya  pengerjaan  yang  dikeluarkan  terperinci  dengan  baik  dan  menghemat  pengeluaran.  Aplikasi  juga  akan melakukan tahap pengujian black box dengan valid untuk memastikan kelancaran transaksi sebelum aplikasi digunakan. Hasil dari penelitian ini berupa 3 jenis aplikasi yang dapat digunakan dengan baik  berdasarkan otoritasnya masing-masing sesuai dengan fitur yang diperlukan. Penelitian ini diharapkan aplikasi dapat membantu memberikan kemudahan transaksi, layanan, laporan dan informasi yang ada pada Galeri LAM Riau.
Kata Kunci: Galeri LAM Riau; Flutter; Waterfall; E-commerce; Black box
Abstract −The Galeri LAM Riau is an effort by the Riau Malay creative and cultural economic center to showcase products typical of the Riau region which include culinary, souvenirs, clothing and handicrafts typical of Riau. The Galeri LAM Riau is fostered by PT Pertamina Hulu Rokan to advance regional MSMEs products and find out what traditions exist in Riau. Seeing the business processes carried out by the Galeri LAM Riau, there are still many buying and selling activities carried out that have not utilized technological developments and the concept of e-commerce. The process of buying and selling transactions in e-commerce is quite important because in the current era of globalization it greatly facilitates many jobs and helps many parties. The flutter e-commerce application of the Galeri LAM Riau can be a solution for producing product output that can help process buying and selling transactions at the Galeri LAM Riau by designing the waterfall method. This waterfall method has a fairly clear work flow, measurable work time and clear documentation. With these advantages, the costs incurred are well detailed and save expenses. The application will also carry out the black box testing to valid stage to ensure smooth transactions before the application is used. The results of this study are 3 types of applications that can be used properly based on their respective authorities according to the features needed. This research is expected the app help facilitate transactions, services, reports and available information at the Galeri LAM Riau.
Keywords : Galeri LAM Riau; Flutter; Waterfall; E-commerce; Black box

## 1. PENDAHULUAN
Electronic commerce (E-Commerce)  merupakan sistem perniagaan barang maupun jasa yang dilakukan melalui jaringan  internet,  electronic  commerce  juga  merupakan  bagian  dari  e-business  atau  dalam  keseharian  dikenal dengan jual beli online [1]. Menurut data yang saya kutip dari [2] Bank Indonesia (BI) memperkirakan, transaksi loka pasar daring atau e-commerce di Indonesia akan semakin berkembang pada 2022.
Nilainya diproyeksi  tumbuh 31,4% mencapai  530 triliun pada tahun ini. Jika melihat dari  data transaksi tahun sebelumnya terdapat 403 triliun dan terus mengalami kenaikan setiap tahunnya. Dari data yang signifikan tersebut  instansi  dapat  memanfaatkan  hal  ini  untuk  menerapkan  e-commerce  dalam  proses  bisnis  mereka.  Ini tentunya membuat beberapa instansi harus merubah cara transaksi jual beli konvensional mereka menjadi secara E-Commerce. Salah satunya yang sudah menerapkan E-Commerce tersebut  adalah beberapa instansi  besar dan Galeri LAM Riau.
Galeri LAM Riau atau sekarang yang sudah disebut Sentra Budaya dan Ekonomi Kreatif Lembaga Adat Melayu Riau adalah sebuah upaya pelestarian budaya Melayu Riau yang didukung oleh PT Pertamina Hulu Rokan yang  terletak  dekat  dengan  kawasan  Lembaga  Adat  Melayu  Riau,  Pekanbaru.  Galeri  LAM  Riau  menyajikan kebudayaan Melayu mulai dari kuliner, pakaian, oleh-oleh maupun kerajinan khas Melayu yang menyajikan lebih dari 600 produk, 400 UMKM dari 12 kabupaten yang ada di Riau.
Dengan  banyaknya  jumlah  produk  dan  umkm  yang  akan  dikelola,  Galeri  LAM  Riau  masih  belum menerapkan konsep E-commerce dengan memanfaatkan teknologi informasi. Mereka juga ingin mengoptimalkan konsep tersebut dan memudahkan seluruh pengguna termasuk konsumen dan mitra UMKM.

## Journal of Information System Research (JOSH)
Volume 4, No. 2, Januari 2023, pp 458 − 469 ISSN 2686-228X (media online) https://ejurnal.seminar-id.com/index.php/josh/ DOI 10.47065/josh.v4i2.2687
Setelah beberapa riset dilakukan, ternyata masih  ada beberapa kegiatan masih dilakukan dengan manual tulis  tangan  seperti  melakukan  pembelian  Food  &  Beverage  pada  Cafe  dan  melakukan  rekapan  diantaranya penjualan setiap bulannya bahkan harian setiap akhir jam kerja. Penggunaan media kertas akan mengakibatkan rentannya kehilangan data maupun rusak [3].
Galeri LAM Riau sudah melakukan pemasaran produk melalui internet dan hanya mampu memesan dengan datang  langsung  ke  Galeri  LAM  Riau,  tentu  proses  ini  harus  diperbaharui  untuk  mengikuti  perkembangan teknologi. Karena pengelola toko masih melakukan transaksi secara konvensional dan masih melakukan rekapan secara  manual  tulis  tangan.  Permasalahan  dari  segi  konsumen  juga  masih  belum  terdapat  aplikasi  yang  cukup mumpuni untuk memesan dan melakukan transaksi jual beli.
Pembelian dilakukan melalui chat pada Aplikasi Whatsapp dan Mitra UMKM masih menunggu rekapan penjualan yang dilakukan oleh pengelola Galeri LAM Riau. Kesalahan rentan terjadi karena dalam perhitungan dan pemrosesan data dilakukan secara konvensional yang menyita waktu dan tenaga [3]. Mitra UMKM juga harus melakukan komunikasi untuk pengadaan barang dan perlu menjaga ketersediaan stok yang masih dilakukan secara konvensional.
E-commerce adalah  cara yang efektif untuk pemasaran produk barang dan jasa di tengah-tengah persaingan saat ini yang menuntut para pelaku usaha untuk menuntut segala kemudahan kepada konsumen seperti informasi produk  maupun  isu  mengenai  toko  tersebut  akibatnya  para  pelaku  usaha  harus  menerapkan  perkembangan teknologi  seluruh kegiatan bisnisnya  [4]. Melihat masalah tersebut  peneliti akan membuat  aplikasi e-commerce Galeri LAM Riau ini dengan menggunakan framework flutter dengan metode waterfall.
Metode  waterfall  merupakan  suatu  model  pengembangan  perangkat  lunak  yang  memanfaatkan  prinsip pengembangan  secara  berurutan  .  Tahapan  berikutnya  tidak  akan  dikerjakan  seandainya  tahapan  sebelumnya belum  terselesaikan  [5].  Waterfall  adalah  model  yang  mudah  digunakan  dan  biasa  digunakan  pada  proses pembuatan project pada startup, industri dan lembaga besar.
Waterfall  ini mengutamakan mutu dan dokumentasi untuk kelayakan suatu proyek [6]. Sedangkan flutter sendiri  adalah  sebuah  framework  pemrograman  dengan  bahasa  dart  yang  memudahkan  pengembang  untuk menciptakan aplikasi yang dapat dijalankan di lebih dari satu perangkat. Pada saat ini flutter dapat menggunakan aplikasi mobile (IOS, dan android), web, dan desktop [7]  dan aplikasi yang dibuat dapat digunakan di berbagai device. Flutter merupakan platform yang gratis dan open source.
Framework  ini  juga  merupakan  produk  yang  dikembangkan  oleh  Google  yang  membuat  flutter  cukup banyak diminati pada masyarakat. Hal tersebut dikarenakan Google cukup sukses dengan beberapa aplikasi yang dinilai masyarakat cukup sukses dengan aplikasi buatan mereka tersebut.
Penelitian sebelumnya tentang E-Commerce Penjualan Ikan Cupang Berbasis Website-Based E-Commerce For Betta Fish Sales, permasalahan selama 1 tahun itu banyak sektor yang terkena dampak pandemi covid-19 ini yang menjadi  penghalang yaitu jarangnya konsumen untuk keluar rumah dan melakukan transaksi  secara besar melalui online dan menjadi faktor utama merancang aplikasi E-commerce ini namun penelitian ini belum terdapat teknik pengujian yang dilakukan pada aplikasi tersebut [8].
Penelitian  berikutnya  yang  membahas  tentang  Penerapan  Payment  Gateway  pada  E-commerce menggunakan  metode  SCRUM,  dalam  pembayaran  yang  dilakukan  secara  otomatis,  payment  gateway  dapat dipadukan  dengan  teknologi  informasi  lain,  diantaranya  dengan  menggunakan  teknologi  sms  (Sms  Payment gateway)  atau  menggunakan  teknologi  internet  (Internet  Payment  Gateway)  [9].  Penelitian  selanjutnya  adalah Pengujian  Black  Box  Pada  Sistem  Terintegrasi  Pembayaran  Uang  Kuliah  Pada  Universitas  X  Dengan  Metode Equivalence  Partitions  membahas  pengujian  sistem  yang  dilakukan  dengan  Black  Box  Testing  untuk  menjadi rujukan sesuai dan tidaknya fitur dari aplikasi tersebut [10].
Dan  penelitian  terakhir  tentang  Pengembangan  Aplikasi  Mobile  Pemesanan  dan  Pembayaran  Makanan Berbasis  Cloud  Storage  membahas  flutter  yang  memberikan  kemudahan  pengembang  untuk  membuat  aplikasi multi platform yang menjadi acuan framework pada penelitian kali ini [7].
Untuk  mengatasi  masalah  tersebut,  Peneliti  berkomitmen  untuk  membuat  solusi  permasalahan  dengan membuat aplikasi yang mendukung transaksi E-commerce yang cenderung bersifat umum dan sederhana untuk pengoptimalan fungsi aplikasi dan menyediakan fitur penting untuk efektivitas transaksi secara online. Aplikasi yang  sederhana  disini  dimaksudkan  untuk  kemudahan  pengguna  untuk  menggunakan  aplikasi.  Aplikasi  E- commerce  Galeri  LAM  Riau  yang  memudahkan  transaksi  jual  beli  pada  Galeri  LAM  Riau.  Aplikasi  tersebut tentunya terintegrasi secara penuh kepada pelanggan yang ingin membeli produk dan mitra UMKM yang ingin melihat penjualan dan stok produk secara real-time dan berkala.

## 2. METODOLOGI PENELITIAN

## 2.1 Model Pengembangan Waterfall
Waterfall  Model  merupakan  pendekatan  klasik  dalam  pengembangan  aplikasi  yang  mendeskripsikan  metode pengembangan  sejalan  dan  berurutan  [11]. Hasil dari  model  waterfall  akan  menjadi  dokumentasi  penting  yang akan digunakan presentasi, deskripsi, atau keperluan lain.

## Journal of Information System Research (JOSH)
Volume 4, No. 2, Januari 2023, pp 458 − 469 ISSN 2686-228X (media online) https://ejurnal.seminar-id.com/index.php/josh/ DOI 10.47065/josh.v4i2.2687
Gambar  1. Model Pengembangan Waterfall
Perangkat  lunak  yang  dibuat  ini  akan  menggunakan  model  pengembangan  Waterfall.  Metode  ini  mudah diimplementasikan karena proses nya dilakukan secara bertahap dan berturut-turut. Berikut adalah tahapan dalam pembuatan perangkat lunak.
a. Requirement analysis — Mengumpulkan kebutuhan secara lengkap setelah itu dianalisis serta didefinisikan kebutuhan yang wajib dipenuhi oleh program yang akan dibangun.
b. Design  -  Pada  sesi  ini  pengembang  akan  menciptakan  suatu  sistem  secara  totalitas  dan  memastikan  alur aplikasi sampai algoritma terperinci.
c. Implementasi - Tahapan dimana segala desain diganti menjadi kode pemrograman. Kode pemrograman yang dihasilkan masih berbentuk modul- modul yang akan diintegrasikan menjadi sistem yang lengkap.
d. Integration & Testing - Di sesi ini dilakukan penggabungan modul- modul yang telah dibuat serta dilakukan pengujian  ini  dilakukan  untuk  mengenali  apakah  aplikasi  yang  dibuat  sudah  cocok  dengan  desainnya  dan fungsinya pada aplikasi apakah terdapat kesalahan maupun tidak.
e. Deployment  -  Mengoperasikan  program  di  lingkungannya  dan  melakukan  pemeliharaan,  semacam penyesuaian ataupun pergantian karena menyesuaikan diri dengan suasana yang sebenarnya.
f. Operation & Maintenance - Instalasi dan proses pemeliharaan sistem yang telah dibentuk.

## 2.2 Unified Modeling Language (UML)
Unified Modeling Language ialah suatu gambaran untuk memvisualisasikan, menspesifikasikan, membangun dan dokumentasi dari sebuah sistem pengembangan aplikasi berbasis objek [12]. Unified Modeling Language (UML) yang  dikemukakan  oleh  Grady  Booch,  Ivar  Jacobson,  dan  James  Rumbaugh  adalah  sebuah  teknik  untuk memodelkan sebuah sistem. Terdapat 15 diagram pada versi terbarunya v2.5. Diagram tersebut dipisahkan menjadi dua  kelompok,  yaitu  structure  diagram  dan  behavior  diagram.  Structure  diagram  mendeskripsikan  data  dan korelasi statis pada suatu information system [13].

## 2.3 E-Commerce
Electronic  Commerce  (E-commerce)  merupakan  sistem  pemasaran  dengan  menggunakan  bantuan  media elektronik. E-commerce ini  meliputi penjualan, marketing, distribusi, pembelian dan layanan dari produk yang dilakukan  dengan  bantuan  elektronika  seperti  jaringan  internet  atau  bentuk  jaringan  komputer  [14].  Jadi  dapat disimpulkan  e-commerce  merupakan  proses  transaksi  perniagaan  barang  dan  transaksi  barang  dan  jasa  seperti proses pembelian, penjualan, pertukaran produk, transfer, jasa maupun data informasi.

## 2.4 Android
Menurut  Ariyanto  dalam  (A.H  Nadzar,  2020)   android  merupakan  kumpulan  perangkat  lunak  untuk  perangkat mobile yang meliputi sistem operasi, middleware serta aplikasi utama mobile [15]. Menurut Ii dalam (A.H Nadzar, 2020) Android ialah sebuah sistem operasi telepon seluler dan personal komputer tablet layar sentuh yang berbasis linux [15]. Seiring perkembangan zaman, android menjadi sebuah device yang sigap dalam berinovasi. Apalagi saat ini sudah dipegang penuh oleh Google yang selalu membuat perubahan mutakhir teknologi beberapa tahun ini.

## 2.5 Firebase
Firebase merupakan penyimpanan berbasis online sehingga  memerlukan penggunaan internet untuk mengakses aplikasi ini. Online mode database bertujuan untuk menghubungkan satu perangkat dengan perangkat lain untuk saling bertukar informasi. Firebase merupakan backend  dan service provider yang dikembangkan oleh raksasa startup Google [16]. Firebase menjadi solusi dari Google untuk kemudahan perkembangan aplikasi  baik mobile maupun web di waktu yang bersamaan.

## 2.6 Payment Gateway
Payment gateway adalah sebuah sistem secara online yang mengatur proses pembayaran, seperti penggunaan kartu kredit, pembayaran lainnya, dan transfer bank. Payment gateway juga mengatur proses pembayaran banyak bank baik menggunakan virtual account, link, e-wallet, e-Pay dan e-money [17].

## Journal of Information System Research (JOSH)
Volume 4, No. 2, Januari 2023, pp 458 − 469 ISSN 2686-228X (media online) https://ejurnal.seminar-id.com/index.php/josh/ DOI 10.47065/josh.v4i2.2687

## 2.7 Framework Flutter
Flutter adalah salah satu framework yang digunakan para developer aplikasi untuk menghasilkan aplikasi banyak platform  dengan  satu  basis  coding  (codebase).  Keluaran  aplikasi  dapat  digunakan  di  berbagai  device,  seperti mobile iOS dan android, web, bahkan desktop. Framework ini juga merupakan sebuah framework yang gratis dan open source yang dikembangkan langsung oleh google [6].

## 3. HASIL DAN PEMBAHASAN

## 3.1 Analisis Kebutuhan Sistem
Analisa  sistem  adalah  penjabaran  dari  suatu  sistem,  dimana  adanya  proses  pemahaman  permasalahan  sebelum mengambil  suatu  keputusan  untuk  menghasilkan  perancangan  serta  desain.  Perancangan  dan  desain  dilakukan setelah selesainya tahap analisa, dimana hasil analisa diterapkan pada perancangan dan desain. Adapun data yang akan saya jabarkan kali ini yaitu.

## 3.1.1 Analisis Kebutuhan Fungsional
Dalam rancangan aplikasi Galeri LAM Riau terdiri dari 3 akses, yaitu pengelola toko, mitra umkm dan konsumen. Adapun kegiatan atau skenario use case yang dilakukan pengelola toko, mitra umkm dan konsumen adalah.
a. Kebutuhan  pengelola  toko:  login,  memesan  produk,  mengelola  data  produk,  melihat  deskripsi  produk, mengelola  data  serah  terima,  mengelola  data  transaksi,  laporan  transaksi,  mengelola  artikel,  mengelola notifikasi, mengelola mitra umkm, mengelola kasir, mengelola konsumen, mengelola pengaturan toko dan melakukan logout.
b. Kebutuhan  mitra  umkm:login,  melihat  deskripsi  produk,  melihat  data  serah  terima,  mengelola  data  diri, melihat data penjualan, melihat data notifikasi dan melakukan logout.
c. Kebutuhan  konsumen:  login,  daftar,  melihat  deskripsi  produk,  memesan  produk,  melihat  data  riwayat, mengelola data diri, melihat data artikel dan melakukan logout.

## 3.2 Perancangan Sistem
Pada  rancangan  aplikasi  android,  perlu  dilakukan  perancangan  yang  lebih  mendetail  tentang  pengguna  yang terlibat,  fungsi  diharapkan,  alur  proses,  serta  tampilan  antarmuka  pengguna.  Tahapan  yang  dilakukan  pada perancangan aplikasi android diantaranya.

## 3.2.1 Use Case Diagram
Use case diagram menggambarkan interaksi satu atau lebih aktor dengan fitur aplikasi yang akan dibangun [18]. Use  case  digunakan  dalam  penggambaran  fungsi  yang  terdapat  pada  suatu  aplikasi  yang  memiliki  hak  untuk penggunaan fitur tersebut.
Login Logout Mengelola Data Produk Mengelola Data Serah Terima Mengelola Data Transaksi Laporan Transaksi Mengelola Data Artikel Mengelola Data Notifikasi Mengelola Data Kasir Mengelola Data Mitra UMKM Mengelola Data Konsumen Mengelola Pengaturan Toko Melihat Data Riwayat Mengelola Data Diri Melihat Data Artikel Melihat Data Serah Terima Melihat Data Penjualan Melihat Data Notifikasi Memesan produk Melihat Deskripsi Produk Mengelola Data keranjang Pengelola Toko Konsumen Mitra UMKM Daftar
Gambar  2. Use Case Diagram Aplikasi E-Commerce Galeri LAM Riau
a. Definisi Aktor
Pada perancangan use case terdapat 3 aktor yang berperan aktif dalam membangun aplikasi e-commerce Galeri LAM Riau in. Adapun definisi dari aktor tersebut dapat dilihat pada tabel 1.

## Journal of Information System Research (JOSH)
Volume 4, No. 2, Januari 2023, pp 458 − 469 ISSN 2686-228X (media online) https://ejurnal.seminar-id.com/index.php/josh/ DOI 10.47065/josh.v4i2.2687
Tabel  1. Definisi aktor use case
No. Aktor Penjelasan 1. Pengelola Toko Aktor  yang  memiliki  tanggung  jawab  untuk  mengatur  segala aktivitas yang ada pada sistem. 2. Mitra UMKM Aktor  yang  yang  berperan  sebagai  pemasok  barang  dan  dapat memonitoring  penjualan  produk  yang  akan  dijual  pada  toko tersebut. 3. Konsumen Aktor  yang  dapat  memesan  produk  yang  terdapat  pada  toko tersebut

## 3.2.2 Activity Diagram
Diagram aktivitas ialah diagram yang menggambarkan alur beberapa kegiatan dalam sistem yang sedang berjalan, bagaimana setiap proses dimulai pembuatan keputusan, dan akhir dari suatu sistem  [19]. Activity diagram pula dapat mendeskripsikan proses paralel yang mungkin terjadi pada beberapa kegiatan.
Gambar  3 . Activity Diagram Aplikasi Galeri LAM Riau

## 3.2.3 Class Diagram
Diagram kelas (class diagram) merupakan spesifikasi yang diinstansiasi akan membuat sebuah objek dan inti asal pengembangan serta desain berorientasi objek [20]. Class Diagram menggambarkan struktur dari kelas apa yang akan dibangun untuk membuat sistem tersebut. Berikut gambaran class diagram dari aplikasi e-commerce Galeri LAM Riau pada gambar dibawah ini.

## Journal of Information System Research (JOSH)
Volume 4, No. 2, Januari 2023, pp 458 − 469 ISSN 2686-228X (media online) https://ejurnal.seminar-id.com/index.php/josh/ DOI 10.47065/josh.v4i2.2687

## 3.2.4 Rancangan Antarmuka
Perancangan antar muka (interface) bertujuan untuk mendeskripsikan rancangan tampilan dari aplikasi yang akan didesain. Rancangan interface juga dapat  membantu  user melihat tampilan yang akan di  develop sehingga user experience dapat  dilakukan dengan mudah. Tujuan sebuah user interface adalah mengkomunikasikan fitur-fitur sistem yang tersedia agar user mengerti dan dapat menggunakan sistem tersebut [21].Perancangan tampilan juga bertujuan  untuk  memperlihatkan  kesesuaian  tampilan  kepada  user  sehingga  tampilan  dapat  ditetapkan  sebelum melakukan  pengkodean.  Hal  ini  dilakukan  untuk  meminimalisir  kesalahan  pada  pembuatan  karena  telah memperlihatkan gambaran aplikasi sebelum dilakukan tahap implementasi.
a. Tampilan aplikasi pengelola toko
Gambar  5. Tampilan User Interface Aplikasi Pengelola Toko
Tampilan  ini  merupakan  rancangan  antarmuka  dari  aplikasi  kasir.  Aplikasi  ini  terdiri  dari  9  menu yaitu order, produk, serah terima, transaksi, artikel  promo, notifikasi, kelola akun, data diri, dan settings. Pada menu order ini  bertujuan  untuk  melakukan  order  pesanan  yang  dilakukan  secara  offline  di  toko.  Menu  produk  untuk mengelola data produk seperti menambahkan produk, mengedit, menghapus produk dan mencetak label produk. Menu  serah  terima  yaitu  untuk  mengkalkulasikan  barang  masuk  dan  barang  return  yang  ada  di  toko.  Menu transaksi  merupakan data laporan transaksi  dan mengelola data transaksi  yang  sudah dilakukan. Artikel  promo sebagai  pengelola  artikel  dan  promo  yang  berlaku  di  toko.  Notifikasi  berfungsi  sebagai  pemberitahuan  dan informasi penting kepada mitra umkm untuk memperhatikan stok produk dan info terbaru pada permasalahan yang ada pada Galeri LAM Riau. Sedangkan menu settings untuk mengatur data perusahaan untuk mengatur alamat, pajak, nomor telepon dll.
b. Tampilan aplikasi mitra umkm
Gambar  6. Tampilan User Interface Aplikasi Mitra UMKM
Pada gambar diatas, aplikasi direncanakan akan memiliki 4 menu utama antara lain home, stock, sales dan profile. Pada menu home menampilkan katalog barang sesuai yang dimiliki oleh mitra umkm. Pada halaman ini mitra umkm dapat melihat secara rinci harga barang, stok barang, sisa stok serta barang yang telah terjual. Pada menu  stock  merupakan  menu  untuk  melihat  data  serah  terima  yang  dapat  dilihat  dalam  kurun  waktu  3  bulan terakhir. Sama halnya seperti menu stock, menu sales juga menampilkan data penjualan secara real time dalam kurun waktu  3 bulan terakhir. Menu sales ini dapat  mendeskripsikan data barang, tanggal  dan jam dari  produk

## Journal of Information System Research (JOSH)
Volume 4, No. 2, Januari 2023, pp 458 − 469 ISSN 2686-228X (media online) https://ejurnal.seminar-id.com/index.php/josh/ DOI 10.47065/josh.v4i2.2687
tersebut saat terjual kepada konsumen. Halaman tersebut akan selalu berubah secara real time melihat perubahan yang ada pada database firebase.
c. Tampilan aplikasi konsumen
Gambar  7. Tampilan User Interface Aplikasi Konsumen
Tampilan diatas merupakan user interface dari aplikasi toko online untuk konsumen. Aplikasi yang dibuat memiliki  4  menu  yang  terdiri  dari  home,  history,  cart,  dan  profile.  Pada  menu  home  akan  menampilkan  form pencarian, artikel terbaru, kategori produk dan produk terbaru. Pada menu ini user dapat melakukan pemesanan produk  yang  akan  dibeli  dan  melihat  deskripsi  produk. Pada  menu  history  akan  menampilkan riwayat  pesanan yang sedang diproses sekaligus detail penuh tentang pesanan tersebut. Pada menu cart menampilkan pesanan yang telah dimasukkan kedalam keranjang dan siap untuk diproses.

## 3.3 Implementasi Sistem
Implementasi  sistem  adalah  suatu  pengembangan  sistem  dari  perancangan  dan  analisa  yang  sudah  dilakukan sebelumnya  sehingga  menghasilkan  sistem  yang dapat  digunakan  dengan  baik  serta  mengetahui  apakah  sistem berhasil  mencapai  tujuan  yang  dibutuhkan.  Implementasi  sistem  yang  dilakukan  sinkron  menggunakan  analisa perancangan  sistem  yang  dirancang  sebelumnya.  Berikut  ini  merupakan  beberapa  hasil  implementasi  dari perancangan tampilan aplikasi e-commerce Galeri LAM Riau.
3.3.1 Aplikasi Pengelola Toko
a. Tampilan Halaman Order
Gambar  8. Tampilan Halaman Order
Gambar 8 di  atas berikut merupakan hasil dari  menu tampilan order pada aplikasi  pengelola toko. Pada tampilan ini pengelola toko dapat memasukkan pesanan yang dilakukan secara offline yang ada di toko. Pengelola akan melakukan pencarian produk pada halaman ini dan menambahkan nya pada list order yang ada di samping kanan.

## Journal of Information System Research (JOSH)
Volume 4, No. 2, Januari 2023, pp 458 − 469 ISSN 2686-228X (media online) https://ejurnal.seminar-id.com/index.php/josh/ DOI 10.47065/josh.v4i2.2687
b. Tampilan Halaman Produk
Gambar  9. Tampilan Halaman Produk
Gambar  9  berikut  menginformasikan  tentang  data  master  dari  sebuah  produk.  Data  produk  yang memberikan  rincian  kode  produk,  nama  produk,  barcode,  gambar  produk,  deskripsi,  harga  modal,  harga  jual, supplier,  dan  tag  kategori  barang  tersebut.  Pada  halaman  ini  juga  dapat  menambah  data  produk  melalui  menu tambah  produk  dan  dapat  mengubah  datanya  dengan  menekan  salah  satu  produk.  Pada  halaman  ini  juga  dapat membuat ulang kode barcode dan mencetak label barcode seperti yang ada di supermarket pada umumnya.
c. Tampilan Serah Terima
Gambar  10. Tampilan Serah Terima
Gambar diatas menampilkan form pembuatan serah terima yang berfungsi untuk pendataan barang masuk dan barang keluar. Barang masuk yang dimaksud yaitu penambahan kuantiti pada toko tersebut sedangkan barang keluar  yaitu  barang  yang  akan  dikembalikan  kepada  supplier  karena  memiliki  beberapa  permasalahan  seperti kadaluarsa, rusak, pergantian produk dll. Pada halaman ini pengelola toko akan mengisi formulir data mulai dari supplier, tanggal masuk, waktu masuk, data pemasukkan barang, data pengeluaran barang dan deskripsi . d. Tampilan Halaman Laporan Transaksi
Gambar  11. Tampilan Halaman Laporan Transaksi
Pada tampilan diatas merupakan tampilan pada menu transaksi. Pada halaman ini berisi informasi tentang data transaksi sekaligus divisualisasikan menjadi grafik linear. Halaman ini dapat melakukan filter harian, bulanan dan tahunan. Filter salah satu produk, supplier dan kasir juga dapat dilakukan dan data tabel akan menyesuaikan dengan  data  filter  tersebut.  Pada  samping  kanan  juga  terdapat  2  grafik  linear  yang  memperlihatkan  data  total transaksi dan total barang yang sudah masuk kedalam data transaksi tersebut.

## Journal of Information System Research (JOSH)
Volume 4, No. 2, Januari 2023, pp 458 − 469 ISSN 2686-228X (media online) https://ejurnal.seminar-id.com/index.php/josh/ DOI 10.47065/josh.v4i2.2687
3.3.2 Aplikasi Mitra UMKM
a. Tampilan Katalog Barang
Gambar  12. Tampilan Katalog Barang
Gambar  diatas  adalah  implementasi  dari  perancangan  tampilan  katalog  barang.  Halaman  ini menginformasikan gambar, nama barang, harga jual  barang dan stok. Pada halaman ini  kita juga dapat  melihat informasi lainnya berupa deskripsi , stok awal, stok yang terjual dan stok yang tersisa di toko . b. Tampilan Halaman Penjualan
Gambar  13. Tampilan Halaman Penjualan
Tampilan  halaman  penjualan  di  atas  hampir  memiliki  persamaan  dengan  halaman  stok.  Penjualan  akan ditampilkan dalam kurun waktu 3 bulan terakhir. Data tersebut berupa gambar, nama produk, tanggal, jam, dan jumlah yang sudah terjual.
3.3.3 Aplikasi Konsumen
a. Tampilan Halaman Home
Gambar  14. Tampilan Halaman Home
Pada  gambar  diatas  adalah  halaman  utama  dari  aplikasi  konsumen.  Halaman  ini  berisi  tentang  artikel  / promo  terbaru,  kategori  dan  produk  terbaru.  Pencarian  produk  juga  akan  berdasarkan  kategori  daerah  untuk mempermudah pencarian barang. Pada deskripsi barang akan berisi gambar, nama barang, harga barang dan stok yang tersisa pada toko.

## Journal of Information System Research (JOSH)
Volume 4, No. 2, Januari 2023, pp 458 − 469 ISSN 2686-228X (media online) https://ejurnal.seminar-id.com/index.php/josh/ DOI 10.47065/josh.v4i2.2687
b. Tampilan Menu Keranjang
Gambar  15. Tampilan Menu Keranjang
Pada  gambar  15  diatas  menampilkan  menu  keranjang  pada  aplikasi  konsumen.  Produk  yang  telah ditambahkan  ke  keranjang  akan  langsung  ditambahkan  ke  menu  keranjang  untuk  diproses.  Pada menu  ini  kita masih  dapat  menambah  kuantiti  dan  memilih  metode  pembayaran  baik  menggunakan  payment  method  dari midtrans maupun dengan manual menggunakan e-wallet.
c. Tampilan Riwayat
Gambar  16. Tampilan Riwayat
Pada  gambar  16  diatas  merupakan  tampilan  riwayat.  Pada  halaman  ini  akan  memperlihatkan  riwayat transaksi yang sudah bahkan sedang diproses. Pada halaman ini mendeskripsikan informasi detail pesanan mulai dari  barang,  kuantiti,  alamat,  detail  pembayaran,  no  resi  dan  pembatalan  transaksi.  Transaksi  akan  langsung dikelola oleh pengelola toko untuk memastikan secara langsung bahwa pesanan sudah dibayar atau belum. Apabila pesanan sudah dibayarkan maka status yang ada pada transaksi akan ikut berubah.

## 3.4 Pengujian Sistem
Hasil dari tahap pengujian menggunakan metode black box testing pada aplikasi e-commerce Galeri LAM Riau ini,  Pengujian  black  box  adalah  sebuah  metode  yang  digunakan  untuk  pengujian  aplikasi  tanpa  harus memperhatikan hal mendetail pada aplikasi [10]. Pengujian dengan metode ini hanya memastikan nilai keluaran berdasarkan nilai masukkan masing-masing.  Pada black box testing ini hanya dilakukan dengan mengeksekusi atau menjalankan perintah yang terdapat pada modul ataupun unit, setelah itu dianalisa apakah hasil tersebut cocok dengan hasil yang diinginkan [22].
Tabel  2. Pengujian Sistem Metode Black Box
No. Deskripsi Prosedur Pengujian Masukan Keluaran yang diharapkan Hasil yang didapat Status 1. Pengujian pada pendaftaran akun - Membuka aplikasi - Klik teks daftar - Mengisi form daftar - Klik Tombol Daftar Isi - Nama - Telepon - Alamat Notif: Menambahkan akun silahkan tunggu Notif: Menambahkan akun silahkan tunggu Valid

## Journal of Information System Research (JOSH)
Volume 4, No. 2, Januari 2023, pp 458 − 469 ISSN 2686-228X (media online) https://ejurnal.seminar-id.com/index.php/josh/ DOI 10.47065/josh.v4i2.2687
No. Deskripsi Prosedur Pengujian Masukan Keluaran yang diharapkan Hasil yang didapat Status konsumen baru - Email - Password 2. Login - Membuka aplikasi - Mengisi form login Isi - Email - Password Notif: Authenticating Please Wait Notif: Authenticating Please Wait Valid 3. Memesan produk - Memilih menu order - Memilih produk - Bayar - Pilih metode bayar - Selesai - Pilih barang - Pilih nominal Notif: Menambahkan transaksi silahkan tunggu Notif: Menambahkan transaksi silahkan tunggu Valid 4. Mengelola data produk - Pilih menu produk Isi - Nama barang - Kode - Barcode - Kategori - Harga Notif: Menambahkan produk silahkan tunggu Notif: Menambahkan produk silahkan tunggu Valid 5. Mengelola data serah terima - Pilih menu stok Isi - Tanggal - Jam - Item masuk - Item keluar Notif: Menambahkan serah terima silahkan tunggu Notif: Menambahkan serah terima silahkan tunggu Valid 6. Laporan Transaksi - Pilih menu transaksi Pilih Filter - Harian - Barang - Kasir - Supplier Muncul data sesuai filter yang dipilih Data muncul sesuai filter yang dipilih Valid 7. Mengelola data artikel - Pilih menu artikel - Pilih tambah artikel - Isi form Isi - judul artikel - pilih gambar - isi deskripsi Notif: Menambahkan artikel silahkan tunggu Notif: Menambahkan artikel silahkan tunggu Valid 8. Mengelola data notifikasi - Pilih menu notif - Tambah notif Isi - Supplier - Judul - Isi pesan Notif: Menambahkan notifikasi silahkan tunggu Notif: Menambahkan notifikasi silahkan tunggu Valid 9. Mengelola data akun -  Pilih  menu  kelola akun - Data kasir, supplier dan konsumen akan ditampilkan Data kasir, supplier dan konsumen tampil Valid

## 4. KESIMPULAN
Pada penelitian ini menghasilkan 3 aplikasi e-commerce untuk Sentra Budaya dan Ekonomi Kreatif Lembaga Adat Melayu Riau. Aplikasi e-commerce ini akan menjadi salah satu penerapan teknologi untuk memudahkan proses bisnis dan transaksi  yang ada di  Sentra Budaya dan Ekonomi Kreatif Lembaga Adat  Melayu  Riau  pada Galeri LAM Riau. Aplikasi juga dapat dilihat pada aplikasi Play Store dengan link berikut yaitu, (1) Galeri LAM Aplikasi Kasir (https://play.google.com/store/apps/details?id=com.gerailam.aplikasikasir), (2) Galeri LAM Mitra UMKM (https://play.google.com/store/apps/details?id=com.galerilamriau.mitraumkm),  (3)  Galeri  LAM  Toko  Online (https://play.google.com/store/apps/details?id=com.galerilamriau.aplikasitoko).  Uji  coba  aplikasi  dengan  black box dilakukan untuk mengetahui pengujian menyeluruh fungsi aplikasi dapat berjalan dengan baik dan beberapa pengujian seperti yang telah dilakukan mendapatkan hasil yang sesuai. Aplikasi dapat diunduh pada Play Store untuk mempermudah penginstalan aplikasi di beberapa device yang akan digunakan. Aplikasi tentunya berguna untuk memudahkan pelayanan yang ada pada Galeri LAM Riau sekaligus menjadi ajang memamerkan kebudayaan melayu  Riau  kepada  masyarakat  untuk  lebih  mengenal  lagi  produk-produk  dan  kerajinan  yang  ada  di  Riau. Aplikasi  juga dapat membantu proses transaksi  baik  dari segi  pengelola toko, mitra umkm maupun masyarakat yang ada di wilayah Riau. Harapannya aplikasi dapat dikembangkan lebih lanjut untuk ditambahkan fitur baru dan dapat menyimpan data yang lebih kompleks lagi dari saat ini dan dimunculkan beberapa fitur pendukung seperti lokasi dan dapat diintegrasikan dengan beberapa marketplace di Indonesia.

## Journal of Information System Research (JOSH)
Volume 4, No. 2, Januari 2023, pp 458 − 469 ISSN 2686-228X (media online) https://ejurnal.seminar-id.com/index.php/josh/ DOI 10.47065/josh.v4i2.2687

## UCAPAN TERIMAKASIH
Penulis  mengucapkan  terima    kasih  ke  PT  Pertamina  Hulu  Rokan  dan  Sentra  Budaya  dan  Ekonomi  Kreatif Lembaga  Adat  Melayu  Riau  yang  telah  memfasilitasi  penulis  dalam  pembuatan  artikel  jurnal,  teman-teman Dutormasi  dan  pada  pihak-pihak  yang  membantu  pelaksanaan  penelitian  sehingga  selesainya  penulisan  jurnal penelitian ini

## REFERENCES
[1] J.  V.  B.  Ginting,  “Penerapan  Sistem  Pendukung  Keputusan  Dalam  Menentukan  e-Commerce  Terbaik  Dengan Menggunakan Metode SAW,” J. Media Inform. Budidarma, vol. 4, no. 1, p. 225, 2020, doi: 10.30865/mib.v4i1.1986.
[2] A. Karnadi,
“Transaksi E-Commerce Ditaksir Capai Rp530 Triliun pada 2022.”
https://dataindonesia.id/digital/detail/transaksi-ecommerce-ditaksir-capai-rp530-triliun-pada-2022  (accessed  Nov.  21, 2022).
[3] T. Irawan, “Rancang Bangun Sistem Informasi Penjualan Berbasis Web dengan Metode Waterfall pada Toko Kaca Sinar Baru Glass,” 2021. [Online]. Available: http://pijarpemikiran.com/index.php/Scientia
[4] Linggar  Sufi  Zulvian,  “SISTEM  INFORMASI  PENJUALAN  SEPATU  TOKO  ANGGA  SPORT  BERBASIS  WEB SKRIPSI,” 2020.
[5] S.  Mumtahana,  Hani  Atun,  Nita  and  A.  W.  Tito,  “khazanah  informatika  Pemanfaatan  Web  E-Commerce  untuk Meningkatkan Strategi Pemasaran,” Pemanfaat. Web E-Commerce untuk Meningkat. Strateg. Pemasar., vol. 3, no. 1, pp. 6–15, 2017, [Online]. Available: http://journals.ums.ac.id/index.php/khif/article/view/3309/2784
[6] A. Nurseptaji, “Implementasi Metode Waterfall Pada Perancangan Sistem Informasi Perpustakaan,” J. Dialekt. Inform., vol. 1, no. 2, pp. 49–57, 2021, doi: 10.24176/detika.v1i2.6101.
[7] E. D. Handoyo, S. Santoso, and D. J. Surjawan, “Pengembangan Aplikasi Mobile Pemesanan dan Pembayaran Makanan Berbasis Cloud Storage,” J. Tek. Inform. dan Sist. Inf., vol. 8, no. 1, pp. 161–174, 2022, doi: 10.28932/jutisi.v8i1.4393.
[8] E.  Kurnia  et  al.,  “E-COMMERCE  PENJUALAN  IKAN  CUPANG  BERBASIS  WEBSITE  WEBSITE-BASED  E- COMMERCE  FOR  BETTA  FISH  SALES,”  vol.  2,  no.  1,  pp.  2807–5986,  2021,  [Online].  Available: http://www.jubikom.unpak.ac.id
[9] Harjanti Tedjo, “Penerapan Payment Gateway pada Ecommerce menggunakan metode SCRUM,” 2019.
[10]  P. Y. A. Nirmala, I. M. S. Putra, and ..., “Pengujian Black Box pada Sistem Terintegrasi Pembayaran Uang Kuliah pada Universitas  X  dengan  Metode  Equivalence  Partitions,”  JITTER  J.  Ilm.  …,  vol.  2,  no.  3,  2021,  [Online].  Available: https://ojs.unud.ac.id/index.php/jitter/article/download/79410/41871
[11]  Y. Findawati, Buku Ajar Rekayasa Perangkat Lunak. 2018. doi: 10.21070/2018/978-602-5914-09-6.
[12]  M.  S.  Fathurrahman1,  Yupi  Kuspandi  Putra2,  “Rancang  Bangun  Sistem  Penerimaan  Dokumen  Pada  PT.  Reasuransi Indonesia Utama,” Teknol. infotek J. Inform. dan Teknol., vol. 3, no. 9, pp. 1689–1699, 2020.
[13]  F. Indriyani, Yunita, D. A. Muthia, A. Surniandari, and Sriyadi, “Analisa Perancangan Sistem Informasi,” J. Chem. Inf. Model., vol. 53, no. 9, pp. 1689–1699, 2019.
[14]  D. Tetap and S. Cki, “E-Commerce Sebagai Pendukung Pemasaran,” J. Sist. Inf. Univ. Suryadarma, vol. 4, no. 1, 2014, doi: 10.35968/jsi.v4i1.81.
[15]  A. H. Nadzar and E. Supriyadi, “Pengembangan Media Pembelajaran Berbasis Android Database Komponen Listrik,” J. Edukasi Elektro, vol. 4, no. 2, pp. 967–978, 2020, doi: 10.21831/jee.v4i2.35855.
[16]  R. Andrianto and M. H. Munandar, “Aplikasi E-Commerce Penjualan Pakaian Berbasis Android Menggunakan Firebase Realtime Database,” J. Comput. Sci. Inf. Technol., vol. Vol 3, No, no. 1, 2022.
[17]  N. Fauziah, F. Darmawan, and W. Gusdya, “Integrasi Payment Gateway Untuk Donasi Menggunakan Framework Flutter (Studi Kasus Donasi HMTIF UNPAS),” Pasinformatik, vol. 1, no. 1, pp. 30–36, 2022.
[18]  A.  Asyhadi  and  R.  Naibaho,  “Sistem  Informasi  Penjualan  Daster  Handmade  Berbasis  Multiplatform  Menggunakan WhatsApp Gateway,” J. Media Inform. Budidarma, vol. 5, no. 4, p. 1538, 2021, doi: 10.30865/mib.v5i4.3297.
[19]  N. Rafianto, Dimas, and Saifulloh, “Penerapan Metode Scrum Pada Pembuatan User Experience Landing Page Sistem Informasi  Lentera,”  J.  Sist.  Inf.  dan  Sains  Teknol.,  vol.  3,  no.  2,  pp.  1–14,  2021,  [Online].  Available: https://www.google.com/url?sa=t&source=web&rct=j&url=https://trilogi.ac.id/journal/ks/index.php/SISTEK/article/do wnload/979/
[20]  S. Sutariyani, W. Wendanto, and A. Yulianto, “Sistem Informasi Kos Area Surakarta Berbasis Android,” Go Infotech J. Ilm. STMIK AUB, vol. 26, no. 1, p. 12, 2020, doi: 10.36309/goi.v26i1.119.
[21]  F.  Fernando,  “Perancangan  User  Interface  (Ui)  &  User  Experience  (Ux)  Aplikasi  Pencari  Indekost  Di  Kota Padangpanjang,” TANRA J. Desain Komun. Vis. Fak. Seni dan Desain Univ. Negeri Makassar, vol. 7, no. 2, p. 101, 2020, doi: 10.26858/tanra.v7i2.13670.
[22]  H. Al Fatta, Analisis & Perancangan Sistem Informasi untuk Keunggulan Bersaing Perusahaan & Organisasi Modern, vol. 53, no. 9. Penerbit Andi, 2007. [Online]. Available: https://books.google.co.id/books?id=oHi8C1W4N7wC