PERANCANGAN DESAIN ANTARMUKA SMART E-COMMERCE PENJUALAN
HASIL PERTANIAN (SiPeHtanI) BERBASIS WIREFRAMING Dian Pramadhana1 .
Dita Rizki Amalia2 .
Ahmad Lubis Ghozali3 Politeknik Negeri Indramayu1,2,3 Jl.
Lohbener Lama No.
Legok.
Kec.
Lohbener.
Kabupaten Indramayu.
Jawa Barat Email: dianpramadhana@polindra.
id1, ditarizkiamalia@gmail.
com2, lubis@polindra.
ABSTRAK
Pertanian merupakan sektor vital yang mendukung perekonomian banyak negara, khususnya di daerah dengan lahan subur dan komunitas agraris yang besar.
Namun, petani sering kali menghadapi tantangan dalam hal pemasaran dan penjualan produk hasil pertanian mereka.
Keterbatasan akses ke pasar yang lebih luas dan kurangnya informasi yang akurat mengenai harga pasar sering membuat petani bergantung pada perantara, yang dapat menekan harga dan mengurangi pendapatan mereka.
Teknologi informasi dan komunikasi menawarkan solusi melalui sistem informasi yang memfasilitasi pemasaran langsung.
Sistem ini memungkinkan petani menjual produk mereka secara langsung kepada konsumen atau pedagang, serta mengakses data pasar yang terkini, yang mendukung keputusan penjualan yang lebih baik dan meningkatkan efisiensi serta produktivitas.
Desain antarmuka pengguna (UI) memainkan peran penting dalam keberhasilan sistem.
Antarmuka yang efektif harus intuitif dan mudah digunakan oleh semua pengguna, termasuk petani, pedagang, dan konsumen dengan berbagai tingkat pemahaman teknologi yang Oleh karena itu, desain antarmuka harus mempertimbangkan kemudahan akses dan penggunaan untuk semua kelompok pengguna, termasuk mereka yang kurang familiar dengan teknologi digital.
Penelitian ini bertujuan untuk merancang antarmuka smart e-commerce penjualan hasil pertanian menggunakan metode Wireframing.
Dengan metode ini, diharapkan proses perancangan antarmuka dapat dilakukan secara lebih sistematis dan efisien, serta meminimalkan risiko kegagalan.
Kata kunci: E-commerce, pertanian.
UI.
Sistem informasi.
Wireframing.
Abstract Agriculture is a vital sector that supports the economy of many countries, especially in regions with fertile land and large agrarian communities.
However, farmers often face challenges in marketing and selling their agricultural Limited access to broader markets and a lack of accurate information about market prices often make farmers reliant on intermediaries, who can suppress prices and reduce their income.
Information and communication technology offers a solution through information systems that facilitate direct marketing.
These systems enable farmers to sell their products directly to consumers or traders and access up-to-date market data, supporting better sales decisions and increasing efficiency and productivity.
User interface (UI) design plays a crucial role in the success of these systems.
An effective interface must be intuitive and easy to use for all users, including farmers, traders, and consumers with varying levels of technological understanding.
Therefore, the design of the interface should consider ease of access and use for all user groups, including those less familiar with digital This research aims to design a smart e-commerce interface for the sale of agricultural products using the Wireframing method.
This method is expected to make the interface design process more systematic and efficient, as well as minimize the risk of failure.
Keywords: Agriculture.
E-commerce.
UI.
Information System.
Wireframing.
14 | I T B A D i a n C i p t a C e n d i k i a memiliki berbagai tingkat pemahaman terhadap PENDAHULUAN Pertanian merupakan salah satu sektor penting yang menunjang perekonomian banyak negara .
, terutama di wilayah yang memiliki banyak lahan subur dan populasi yang signifikan di sektor agraris.
Namun, sektor ini seringkali menghadapi tantangan dalam hal pemasaran dan penjualan hasil pertanian.
Salah satu masalah utama yang dihadapi petani adalah kurangnya akses ke pasar yang lebih luas dan terbatasnya informasi terkait harga pasar yang adil.
Hal ini menyebabkan petani kerap bergantung pada perantara, yang sering kali menekan harga hasil pertanian sehingga pendapatan petani menjadi kurang optimal .
teknologi informasi dan komunikasi telah membuka peluang baru bagi sektor pertanian .
Sistem informasi menjadi salah satu inovasi yang dapat mengatasi tantangan ini dengan memungkinkan petani untuk memasarkan produk mereka secara langsung kepada konsumen atau pedagang dengan .
dirancang harus dapat diakses dan mudah digunakan oleh semua pengguna, termasuk mereka yang mungkin tidak memiliki pengalaman menggunakan aplikasi digital sebelumnya.
Perancangan desain antarmuka juga berperan penting dalam memperjelas dan mempermudah pemahaman tentang kebutuhan pengguna serta .
Perancangan merupakan sesuatu aktivitas yang mempunyai tujuan mendesign sistem baru .
Dengan memahami kebutuhan dan preferensi pengguna, desain antarmuka dapat dikembangkan secara spesifik untuk memenuhi kebutuhan tersebut.
Dalam beberapa tahun terakhir, kemajuan Oleh Sistem menyediakan platform bagi petani untuk menjual hasil panen mereka, tetapi juga memberikan akses terhadap informasi pasar yang lebih luas dan terkini, membantu petani dalam mengambil keputusan yang lebih baik terkait penjualan hasil pertanian mereka Hal ini dapat mengurangi risiko kegagalan dan meningkatkan tingkat adopsi serta penerimaan pengguna terhadap sistem yang dikembangkan.
Penelitian ini bertujuan untuk merancang smart e-commerce Wireframing.
Wireframe adalah gambaran awal kerangka untuk Menyusun item-item pada laman website dimana proses ini dilakukan sebelum proses desain sesungguhnya .
Melalui penerapan Wireframing, antarmuka sistem dapat dilakukan dengan lebih efektif dan efisien.
sehingga meningkatkan efisiensi dan produktivitas.
Desain antarmuka pengguna (UI) adalah komponen krusial dalam pengembangan sistem informasi .
User interface (UI) atau desain antar muka adalah seperangkat alat yang digunakan untuk memanipulasi objek digital .
Antarmuka yang baik memungkinkan pengguna untuk berinteraksi dengan sistem secara intuitif, cepat, dan efisien .
Dalam konteks pertanian, target pengguna termasuk METODE PENELITIAN Dalam penelitian ini.
Wireframing digunakan Metode perancang untuk membuat kerangka dasar dari antarmuka, yang berfokus pada struktur, tata letak, dan fungsionalitas sebelum masuk ke tahap petani, pedagang, dan konsumen, yang mungkin 15 | I T B A D i a n C i p t a C e n d i k i a Dengan Wireframing, peneliti dapat memvisualisasikan dan menguji alur kebutuhan dari pengguna.
Proses evaluasi juga menjadi tahapan terakhir apakah desain dapat diperbaiki dan memastikan bahwa desain akhir dilanjutkan ke proses selanjutnya (Tahap Akhi.
efektif dan intuitif bagi pengguna.
Tahapan atau kembali mengulang ke proses-proses yang penelitian dapat dilihat pada gambar di bawah ini.
dijalankan sebelumnya.
Revisi dan Penyempurnaan Pada penyempurnaan antarmuka pengguna berdasarkan Tahapan tersebut dapat dijelaskan sebagai berikut :
Analisis Kebutuhan Pada Proses diimplementasikan dengan efektif dalam aplikasi.
menjelaskan kebutuhan dan tujuan dari Smart E-commerce penjualan hasil pertanian.
Proses pertama adalah menentukan pendekatan dengan HASIL DAN PEMBAHASAN Penelitian ini berfokus pada perancangan Tahapan awal ini merupakan proses identifikasi dengan menentukan siapa saja yang penjualan hasil pertanian yang ditujukan bagi para e-commerce penggunaan sistem ini dan fitur apa saja yang menggunakan Wireframing.
Desain antarmuka dibutuhkan dalam proses pemasaran produk- pengguna dibuat seluruhnya menggunakan aplikasi produk hasil pertanian.
Figma, dengan memfokuskan pada fitur-fitur yang tersedia di sistem.
Perancangan Desain Pada tahapan ini, dilakukan pembuatan 1 Analisis Kebutuhan Dari hasil pemetaan dari user yang telah dilakukan, maka diketahui tujuannya adalah kebutuhan yang telah dilakukan sebelumnya.
menghasilkan sebuah rancangan antarmuka smart Fokus utama adalah pada penataan elemen- e-commerce penjualan hasil pertanian dengan elemen penting, seperti header, menu, konten utama, dan tombol navigasi.
kemudahan dalam penggunaan dalam proses jual Wireframing beli hasil produk pertanian.
Evaluasi Pengujian Proses evaluasi merupakan kegiatan yang dilakukan setelah melakukan perancangan desain, hal ini bertujuan untuk memastikan kesesuaian 1 Analisis kebutuhan pengguna Kebutuhan menentukan siapa saja aktor yang dibutuhkan 16 | I T B A D i a n C i p t a C e n d i k i a dalam sebuah sistem untuk dapat menjalankan fungsional dari perancangan desain antarmuka Smart E-commerce Penjualan Hasil Pertanian:
Dalam commerce penjualan hasil pertanian, terdapat tiga pengguna yang akan terlibat yaitu :
Dashboard:
Menampilkan ringkasan informasi penting seperti jumlah produk, total penjualan, dan Petani statistik pengguna.
Petani adalah aktor yang akan menggunakan Pendaftaran dan Login:
sistem tersebut untuk melakukan proses penjualan Formulir untuk mendaftar dan masuk ke hasil pertanian mereka.
Petani membutuhkan sistem untuk petani, pembeli, dan admin.
antarmuka yang memungkinkan mereka dapat Manajemen Produk:
menampilkan produk-produk hasil pertanian.
Fitur untuk menambahkan, mengedit, dan menginformasikan produk yang siap panen dan menghapus produk hasil pertanian.
sedang masa tanam, memantau harga, dan Pencarian dan Filter:
melacak transaksi dengan lebih efisien.
Memungkinkan pembeli untuk mencari produk Pembeli berdasarkan kategori, harga, dan lokasi.
Pembeli merupakan pengguna utama yang Keranjang Belanja dan Pembayaran:
akan mengakses website ini untuk memenuhi Fitur berbagai kebutuhan mereka terkait hasil pertanian.
keranjang, mengatur metode pembayaran, dan Pembeli menyelesaikan transaksi.
memungkinkan mereka untuk mencari produk.
Manajemen Transaksi:
membandingkan harga, dan melakukan pembelian dengan lebih efisien.
Untuk transaksi yang terjadi di platform.
Admin Sistem Admin sistem merupakan pengelola semua data yang ada pada sistem ini.
Admin sistem 2 Perancangan Desain Pada tahapan ini, peneliti akan fokus pada pembuatan wireframe, peneliti akan membuat produk, mulai dari data produk yang mencakup bentuk sederhana sebuah desain tata letak dari informasi detail tentang hasil pertanian, harga, fitur sistem yang telah ditentukan pada tahap dan status ketersediaan, hingga data pengguna Wireframe hanya akan menampilkan yang mencakup profil petani dan pembeli, serta gambaran sistem dengan warna hitam putih tanpa riwayat transaksi mereka.
adanya logo, gambar maupun text.
Berikut perancangan Wireframe desain antarmuka Smart 2 Analisis Kebutuhan Fungsional Kebutuhan fungsional mencakup proses E-commerce Penjualan Hasil Pertanian.
Halaman Login yang akan dilakukan oleh sistem, juga berisi tentang informasi apa saja yang harus ada dan dihasilkan sistem.
Berikut merupakan kebutuhan 17 | I T B A D i a n C i p t a C e n d i k i a e.
Halaman Kategori Gambar 1.
Wireframe halaman login Halaman Register Gambar 5.
Wireframe halaman kategori Halaman Chat Kami Gambar 2.
Wireframe halaman register Halaman Home Gambar 6.
Wireframe halaman chat kami Tahapan rancangan prototipe, ini merupakan langkah lanjutan dari proses wireframing, di mana peneliti mengembangkan dan menyempurnakan Gambar 3.
Wireframe halaman home model antarmuka dengan menambahkan elemen desain yang lebih rinci.
Pada tahap ini, peneliti akan menyesuaikan dan memperkaya rancangan Halaman Produk melibatkan aspek-aspek visual seperti logo, warna, tipografi, ukuran elemen, dan gambar.
Rancangan prototipe ini bertujuan untuk memberikan gambaran yang lebih lengkap dan realistis tentang bagaimana aplikasi akan terlihat dan berfungsi.
Prototipe ini akan mencerminkan desain akhir dengan detail yang lebih mendalam.
Gambar 4.
Wireframe halaman produk memastikan bahwa semua elemen berfungsi 18 | I T B A D i a n C i p t a C e n d i k i a dengan baik dan memberikan pengalaman Halaman UI Produk pengguna yang optimal.
Berikut adalah rancangan antarmuka smart e-commerce tahapan prototipe ini.
Halaman UI Login Gambar 9.
Halaman antarmuka produk Halaman UI Kategori Gambar 7.
Halaman antarmuka login Halaman UI Register Gambar 10.
Halaman antarmuka kategori Halaman UI Chat Kami Gambar 8.
Halaman antarmuka register Halaman UI Home Gambar 10.
Halaman antarmuka chat kami 3 Evaluasi Pengujian Pada tahap pengujian ini dilakukan dengan menggunakan tool aplikasi Figma.
Pengujian Gambar 9.
Halaman antarmuka home dilakukan pada semua tampilan dari menu yang ada untuk memastikan antarmuka sistem smart e- 19 | I T B A D i a n C i p t a C e n d i k i a commerce penjualan hasil pertanian berjalan DAFTAR PUSTAKA dengan baik.
informasi dan 4 Revisi dan Penyempurnaan Desain Proses Eka Nurjayanti.
Peran Dan Tantangan ECommerce Sebagai Media Akselerasi Manajemen Rantai Nilai Produk Pertanian.
fungsionalitas sistem berdasarkan umpan balik Forum Penelitian Agro Ekonomi.
Vol.
dan evaluasi awal.
No.
Salingka Nagari.
Vol.
1 No.
antarmuka, peneliti melakukan penyesuaian dan perbaikan terhadap wireframe awal yang telah peluang baru bagi sektor pertanian.
Jurnal Pada tahap revisi dan penyempurnaan desain Ibtihal H dan Yuhendri.
Kemajuan teknologi terhadap Pemanfaatan E-Commerce pada Hasil
KESIMPULAN DAN SARAN
Pertanian.
1 Kesimpulan yaitu perancangan desain antarmuka pada Smart EPenjualan Pertanian Jurnal Kolaboratif Sains.
Volume 7 No.
Berdasarkan penelitian yang penulis lakukan Heri Aji Setiawan.
Pengaruh Literasi Digital Budi D dan Alimuddin P.
Penerapan r-commerce wireframing, maka penulis dapat menarik kesimpulan meningkatkan penjualan online.
JIKEM.
bahwa penelitian ini menghasilkan desain antarmuka 2 no.
pengguna (UI) untuk smart e-commerce penjualan Ahmad S.
dan Abdul.
Penerapan hasil pertanian menggunakan wireframing, yang telah Metode User Centered Design Sebagai Evaluasi sesuai dengan kebutuhan.
Proses perancangan UI ini Dan Perbaikan Desain Antarmuka Pada Website melibatkan beberapa tahap, dimulai dari Analisis Bangbeli.
JATI 2023.
Kebutuhan.
Desain Perancangan.
Eko S.
dan Dody W.
Penerapan Metode Design dilanjutkan dengan Evaluasi Pengujian, dan diakhiri Thingking Pada Perancangan Ui/Ux Aplikasi dengan tahap Revisi dan Penyempurnaan.
Perpustakaan Mobile.
TEODOLITA 2023.
2 Saran
Saran