UI/UX Case Study: Pengembangan fitur logistik dan integrasi marketplace pada aplikasi Krealogi
Latar Belakang
Krealogi adalah sebuah platform untuk mempermudah dalam pencatatan dan perencanaan strategis bagi UMKM. dengan berbagai fitur yang tersedia di dalamnya seperti; laporan usaha, perencanaan produksi, catatan transaksi, manajemen gudang, dan catat pesanan. UMKM dapat dengan mudah mengatur bisnis mereka hanya dalam 1 aplikasi saja, dan untuk kenyamanan pengguna, krealogi terus melakukan pengembangan pada setiap fitur yang di gunakan termasuk fitur intergrasi logistik dan marketplace mereka.
Objektif
- Melakukan integrasi dengan pihak logistik dengan cara memasukan sistem pembayaran secara otomatis yang nantinya akan langsung diterima oleh pihak logistik, juga sistem tracking yang dapat di akses melalui krealogi.
- Menambahkan fitur tambah kontak yang berguna untuk menyimpan rekam jejak pelanggan dan mempermudah UMKM dalam pengiriman produk, menghubungi kontak pelanggan, pemberian diskon, dan mengirimkan informasi mengenai promo toko
- mengembangkan desain UI yang user-friendly
Peran dalam Tim
Sebagai UX desainer saya berkolaborasi dengan tim saya yang beranggotakan 5 orang, yaitu: Alma Verdiana, I Made Bharga Wiraguna, Ngatijo, Inggrid YRP, dan Dede Syihabudin. dalam pengembangan fitur ini saya memiliki tanggung jawab sebagai berikut :
- Melakukan tahap Design thinking,
- Membuat User flow dan Wireframe,
- Membuat desain UI,
- dan Melakukan Usability Testing.
Design Process
Tahap awal pengembangan, kami melakukan pendekatan dengan metode Design thinking. Dalam tahap ini kami mencoba untuk memahami pengguna dalam proses menggunakan aplikasi krealogi yang sudah ada, sehingga kami bisa mengidentifikasi kebutuhan pengguna, mengetahui masalah yang terdapat pada fitur sebelumnya dan mencari solusi alternatif untuk dapat mengembangkan krealogi menjadi lebih baik. dengan menggunakan tahap sebagai berikut :
Empathize
Pada tahap empathize kami mengidentifikasi masalah, mengumpulkan informasi dan menguji coba aplikasi krealogi yang sudah ada. data yang kami kumpulkan berupa tampilan aplikasi (gambar), informasi dari challange patner yaitu krealogi, dan pengalaman sendiri ketika mencoba aplikasi tersebut. data yang sudah kami dapat, kami kumpulkan dalam tahap selanjutnya yaitu define
Define
Pada tahap ini, kami menganalisis masalah yang kami dapat pada tahap empathize, dengan menggunakan metode Pain Point pada Figjam di Figma. kesimpulan dari setiap masalah di buat menjadi beberapa poin dengan menggunakan sticky notes seperti berikut :
Setelah tahap Pain Point di lakukan, tahap selanjutnya menggunakan metode How-Might We yaitu mencari solusi dan tujuan untuk pengembangan fitur pada krealogi
Setelah alternatif solusi terkumpul, masing-masing dari setiap anggota memilih masalah yang akan di kembangkan di tahap Ideate
Ideate
Pada proses define, kami melakukan tahap solution idea. yaitu tahap mengumpulan solusi yang nantinya akan di kelompokan berdasarkan tahapan desainnya seperti di bawah:
Lalu, solusi yang telah kami kumpulkan. kami kelompokan dengan malakukan tahap affinity Diagram, yaitu mengelompokan solusi berdasarkan jenis fiturnya yaitu logistik, marketplace dan CRM. hal ini dapat mempermudah dalam pembuatan Prioritization idea
pada tahap prioritization idea, solusi yang telah di kelompokan kemudian di kelompokan kembali berdasarkan prioritasnya. terdapat 4 bagian yang di pisahkan berdasarkan kesulitan dan nilainya yaitu “yes, do it now” pada bagian kiri atas, “do next” pada bagian kanan atas, “do later” pada bagian kiri bawah, Dan “do last” pada bagian kanan bawah. hal ini dapat mempermudah UX desainer untuk menentukan fitur mana yang dapat di kerjakan terlebih dahulu.
Prototyping
User Flow
Pada tahap prototyping, kami mulai dengan membuat user flow dan wireframe. pada tahap user flow, kami membuat alur proses yang akan di lalui pengguna saat menggunakan fitur integrasi logistik dan marketplace di aplikasi krealogi. Tahap ini menjadi acuan kami dalam pembuatan wireframe.
Wireframe
Tahap wireframe di buat sesuai dengan proses pada user flow, wireframe sendiri adalah tampilan sederhana (Low-Fidelity) sebelum memasuki tahap design UI. tahap ini membantu desainer menetukan tata letak komponen, text, dan ikon yang nanti akan di gunakan pada design UI
Design System
Setelah tahap Wireframe selesai, dilanjutkan dengan tahap Desain sistem, yaitu tahap penentuan warna, typography, ikon dan pembuatan jenis tombol yang nantinya akan di fungsikan pada prototype. seperti berikut:
Desain UI
Setelah Desain sistem selesai. masuk ke tahap Desain UI, tahap ini mengacu pada tahap wireframe, dengan memasukan bagian dari desain sistem. desain UI yang sudah terbentuk, lalu di hubungkan satu sama lain dengan menggunakan ‘Prototype’ pada figma
Berikut merupakan prototype dari produk kami:
Testing
Setelah prototype selesai, tahap selanjutnya adalah user research atau uji coba pada pengguna aplikasi. dalam tahap uji coba ini, kami melakukan metode Kualitatif yaitu berhubungan secara langsung dengan pengguna. dalam tahap ini di perlukan data stimulus untuk menggiring pengguna dalam menggunakan aplikasi yang sudah kami buat, berikut hasil dari wawancara kami bersama salah satu UMKM:
Kesimpulan
Aplikasi yang kami buat sudah cukup untuk memenuhi standar dari UMKM, hanya saja di perlukan tambahan cetak resi pada bagian pengiriman barang. tampilan dan alur sudah cukup di mengerti oleh UMKM, karena desainnya cukup familiar dengan platform yang sudah ada sebelumnya dan sangat mudah di mengerti.
Rekomendasi Selanjutnya
membuat fitur yang ter-integrasi dengan seluruh marketplace indonesia, sehingga penjual tidak perlu membuka satu-persatu aplikasi untuk mengecek barang, pengiriman, atau pun pesanan masuk. dan untuk sistem pembayaran dari pelanggan yang bisa di gunakan langsung oleh penjual di satu aplikasi