UI/UX Case Study: Fitur Digitalisasi UMKM Aplikasi Krealogi

Alvin Aditya S
4 min readSep 28, 2022

--

Aplikasi Krealogi

Hai! Saya Alvin Aditya S, mentee dari program Skilvul Digital Talent Scholarship. Saat ini saya bersama tim sedang mengerjakan challenge UI/UX design dengan mengkreasikan beberapa fitur di aplikasi Krealogi.

Dalam pengerjaannya kami membagi tugas meliputi;

  • Alvin Aditya S (saya): Kartu Nama, Bot, dan Promo Pop Up (Fitur Komunikasi)
  • Efika Ambar: Arus Pencatatan Utang dan Arus Kas Sederhana (Fitur Finance)
  • Nanin Arisawati: Fitur Database Pelanggan dan Marketplace
  • Yafet Sinjal: Tracking Pengiriman dan Harga Ongkir (Fitur Integrasi)

Tentang Aplikasi Krealogi

Singkatnya, aplikasi Krealogi merupakan bagian dari revolusi digital untuk UMKM Indonesia. Aplikasi ini adalah sebuah wadah untuk mengembangkan kemampuan dan keterampilan pelaku UMKM.

Krealogi diharapkan dapat menjadi solusi permasalahan yang kerap menghampiri pelaku UMKM seperti, kendala manajemen pemesanan, produksi, persediaan, hingga pengiriman.

Tujuan Proyek

  1. Membuat tampilan aplikasi Krealogi menjadi user friendly
  2. Membuat desain fitur simple CRM, Cash Flow Feature, dan Integrasi dengan Logistic serta Market Place
  3. Membuat Fitur Komunikasi dan Fitur Database Pelanggan

Harapan Proyek

Setelah membuat tampilan aplikasi Krealogi yang user friendly dan merombak beberapa desain fiturnya. Harapannya adalah pengguna lebih mudah mengoperasikan semua fitur yang ada di aplikasi tersebut.

Dengan demikian pengguna akan nyaman dan Krealogi menjadi aplikasi pilihan pelaku UMKM untuk mengembangkan bisnisnya di era revolusi digital.

Proses Desain

Kami menggunakan Design Thinking sebagai pendekatan proses desain.

1. Empathize

Pada tahap pertama yaitu Empathize, untuk mengetahui masalah apa yang sebenarnya terjadi yaitu saya membaca hasil riset dan menonton rekaman video AMA Session dengan Challenge Partner yaitu pihak Krealogi.

Dengan demikian saya mendapatkan bekal permasalahan yang sedang dihadapi oleh Krealogi. Setelah itu saya dan tim melakukan brainstrom dan berlanjut ke tahap define.

2. Define

Berangkat dari materi-materi dan riset yang telah disediakan Krealogi, kami melakukan brainstrom di Figma.

Selain itu kami pun mencari tahu dan mengumpulkan informasi berdasarkan tingkat kesulitan (pain point) dan memilah untuk mengetahui potensi apa saja yang dikembangkan untuk menciptakan ekosistem user friendly namun memiliki nilai fungsi yang ideal.

Dari proses brainstroming tersebut, setidaknya kami menemukan 11 poin yang bisa dikembangkan.

Selanjutnya kami melakukan diskusi dan voting (how might we) untuk menentukan poin-poin yang dapat kita kerjakan dan kembangkan.

3. Ideate

Selama tahap ketiga, kami menemukan ide-ide yang memungkinkan untuk dikembangkan.

Kami membuat tiga moodboard yaitu Ideate Stage, Solution Idea, dan Prioritazion Idea.

Ideate Stage: Moadboard yang dibuat untuk menampung hasil voting terbanyak dari define.

Kami membagi ide-ide tersebut berdasarkan kategori yang sesuai. Adapun sebagai berikut;

a. User friendly untuk Produksi, Logistil, dan Marketplace

b. User friendly untuk Pemodal dan Pinjaman

c. User friendly untuk UMKM

d. User friendly saat Komunikasi

e. User friendly ketika transaksi atau pembelian

Solution Idea: Membagi ide lebih spesifik ke dalam kategori masing-masing.

a. Video Tutorial, Course, dan Webminar

b. Program Disabilitas

c. Integrasi

d. Finance

e. Security

f. Fitur Sosial

g. Fitur User

h. Fitur Komunikasi

i. Bahasa

Prioritazion Idea: Moadboard ini dibuat untuk menentukan ide-ide yang diprioritaskan untuk dikembangkan ke dalam fitur aplikasi Krealogi.

Dalam fase ini terdapat empat kategori yaitu;

  1. Yes, do it now (dikerjakan sekarang): Fitur Integrasi, komunikasi, finance, dan user.
  2. Do next (dilakukan selanjutnya): “Video tutorial, course, dan webinar” dan fitur disabilitas.
  3. Do later (dilakukan nanti): Fitur sosial penawaran produk melalui WhatsApp dan email.
  4. Do last (dilakukan terakhir): Bahasa bilingual.

Selain itu, dalam tahap ideate kami membagi tugas untuk mengerjakan User Flow, Wireframe, Design System, dan UI Design.

Kemudian proses pengerjaannya, saya fokus kepada fitur komunikasi.

  • User Flow

Pertama, saya membuat user flow Fitur Komunikasi Bot WhatsApp dan Notifikasi.

Selanjutnya barulah saya merancang user flow Fitur Promo Pop Up. Terakhir, saya menyusun user flow Fitur Kartu Nama.

Link:

  • Wireframe

Begitu pula dengan pengerjaan wireframe. Saya melakukannya satu-persatu mulai dari Fitur Komunikasi Bot WhatsApp dan Notifikasi, Fitur Promo Pop Up, hingga Fitur Kartu Nama.

Hasil dari wireframe yaitu dalam bentuk low fidelity (lo-fi) mock up. Bisa juga diartikan sebagai kerangka sebuah desain.

Link:

  • Design System

Fase ini kami kembali bekerja sama untuk mempersiapkan dan membuat keperluan disain dari mulai elemen-elemen, gradasi warna, font, header style, sampai chip.

Link:

  • UI Design

Pengerjaannya hampir serupa dengan wireframe, namun yang membedakan adalah UI Design dikerjakan dengan konsep high fidelity (hi-fi) mock up.

Maksudnya UI Design adalah desain jadi dari fitur aplikasi yang akan dibuat. Ini merupakan versi detail dari lo-fi yakni menambah warna, icon, dan lain-lain.

Kami mengerjakan tugas masing-masing, saya tetap fokus menyelesaikan desain Fitur Komunikasi.

Link:

4. Prototyping

Ditahap ini kami menyambungkan hasil dari UI Design ke dalam sistem prototype di Figma.

Alhasil, kami menentukan slide show apa yang cocok dan nyaman diaplikasikan ke dalam desain fitur-fitur yang telah dibuat.

Jadi prototyping seperti menciptakan animasi atau presentasi alur fitur yang dapat dicoba oleh pengguna.

Dalam tahap akhir ketika protype sudah jadi dan dicoba, tim akan mempunyai pandangan tentang bagaimana pengguna berperilaku saat menggunakan fitur ini.

Link:

5. Testing

Ini adalah tahap terakhir dalam proses desain kami. Jadi kami mengundang empat narasumber untuk mencoba prototype fitur-fitur yang telah dibuat.

Tujuannya, kami bisa langsung menilai apakah fitur tersebut user friendly dan berguna atau justru sebaliknya.

Fase testing merupakan validasi kepada pengguna dan menginformasikan pemahaman pengguna, kondisi penggunaan, bagaimana orang berpikir, dan merasakan.

Intinya dengan testing kami dapat menyempurnakan dan memperoleh pemahaman sedalam mungkin tentang fitur dan pengguna.

Saat prototype kami juga melakukan interview mendalam ke empat narasumber. Pertanyaannya mulai dari general sampai ke pengalaman setelah mencoba prototype fitur yang kami buat.

Kesimpulan

Keempat narasumber menyatakan bahwa fitur-fitur yang kami rancang user friendly dan tampilan UI desian sudah cukup menarik.

Mereka sepakat kalau fitur tersebut membantu pengguna untuk pengoperasian UMKM digital.

Adapun saran atau masukan narasumber kepada kami, seperti memperbesar ukuran font, tata letak UI desain.

Link Protyping:

Link User Research:

Penutup

Terima kasih telah menyempatkan waktu untuk membaca case study pertama saya. Jika ada salah dalam tulisan saya, mohon dikoreksi.

Disclaimer: Hasil karya ini merupakan bagian dari program Skilvul DTS PROA UI/UX Design Batch 3–2022

--

--