UI/UX Case Study — Cash Flow dan Performa Aplikasi Krealogi
INTRODUCTION
“Pada kesempatan kali ini saya mendapatkan proyek untuk mendesain fitur Cash Flow dan Performa pada aplikasi Krealogi. Proyek ini merupakan bagian dari UI/UX Challenge Program yang diadakan oleh Kampus Merdeka dengan Skilvul (www.skilvul.com) dan Duanyam Krealogi sebagai Challenge Partner. Saya TIDAK bekerja atau terikat kontrak professional oleh Duanyam Krealogi.”
Krealogi merupakan aplikasi bagi usaha kreatif, di mana para pelaku ataupun penggiat UMKM Kriya dapat mengembangkan usahanya dengan meningkatkan pengelolaan operasional hingga komunikasi dengan pihak eksternal secara digital. Krealogi adalah teknologi berbasis aplikasi untuk rantai pasok yang didasari oleh pengalaman Du Anyam dalam menjalankan dan mengembangkan manajemen dan sistem rantai pasok Kriya dari daerah-daerah terpencil di Indonesia.
Krealogi menawarkan solusi yang menyeluruh : komunitas sebagai wadah berjejaring dengan pelaku usaha lainnya, pelatihan untuk mengembangkan kemampuan dan keterampilan UMKM, serta aplikasi ramah pengguna untuk membantu pencatatan kegiatan operasional dan membuat perencanaan strategis.
Akan tetapi, permasalahan Krealogi saat ini belum memiliki beberapa fitur, Untuk melakukan pengembangan pada aplikasi, Krealogi membutuhkan fitur-fitur tambahan seperti:
- Simple CRM (Belum didesain dan belum tersedia)
- Cash Flow dan Performa (Belum didesain dan belum tersedia)
- Integrasi dengan Logistik (Belum didesain dan belum tersedia)
Dari fitur-fitur di atas, kami memilih untuk mendesain fitur Cash Flow dan Performa. Karena fitur ini menjadi sangat penting bagi user dari aplikasi Krealogi dalam melakukan pencatatan hutang, melihat rangkuman performa usaha yang meliputi performa bisnis dan produksi.
OBJECTIVE
- Melihat tingkat user friendly dari desain mobile aplikasi Krealogi ini.
- Mengetahui tingkat kelayakan dari menu performa dan keuangan dari aplikasi krealogi sebagai aplikasi pengelola bisnis UMKM.
- Mengetahui seberapa penting aplikasi pencatatan untuk pelaku UMKM.
ROLE TEAM
Karena ini adalah proyek kolaboratif, saya berkolaborasi dengan 2 anggota tim, Srimbayutiapratika dan Andika Febrian. Dalam tim ini tanggung jawab saya adalah:
- Ikut menyampaikan ide dan solusi dalam proses design thinking
- Bertanggung jawab menangani user flow dan wireframe
- Berkontribusi membuat user interface, membuat prototyping, user research dan user testing.
Seluruh proses berlangsung dari September 2021 sampai November 2021 yang berarti kami membutuhkan waktu kurang lebih dua bulan untuk menyelesaikan proyek ini.
UX DESIGN PROCESS
Dalam kasus kami saya menggunakan Design Thinking sebagai kerangka kerja dalam perancangan UI UX. Karena Design Thinking sangat bermanfaat dalam memecahkan masalah yang sangat rumit atau tidak diketahui, dengan cara menata kembali masalahnya dalam sudut pandang manusia, menciptakan banyak ide-ide dalam sesi brainstorming, dan mengadopsi pendekatan langsung dalam pembuatan desain awal dan melakukan uji coba.
Phase 1 — Emphatize
Pada tahapan ini, kami memahami terlebih dahulu keinginan dari user, kami mencari dan mengumpulkan berbagai informasi dari berbagai pelaku UMKM terkait dengan kebiasaan mereka dalam melakukan pengelolaan bisnis, pencatatan pendapatan dan pengeluaran, dan bagaimana mereka menjalin relasi dengan customernya, selain itu kami juga melakukan observasi pada Aplikasi Krealogi. Kami melihat bahwa dalam aplikasi krealogi belum memiliki fitur aplikasi Cash Flow dan Performa, jadi kami dapat membantu untuk membuat sebuah desain aplikasi Cash Flow dan Performa yang user friendly yang bertujuan untuk membantu pengguna dalam melakukan pencatatan hutang, melihat rangkuman performa usaha yang meliputi performa bisnis dan produksi.
Phase 2 — Define
Pada tahap ini kami mendefinisikan masalah yang telah kami buat pada tahap Emphatize, untuk mengetahui apa yang dibutuhkan pengguna, karena munculnya beberapa pendapat dari anggota tim yang sangat variatif dan terkadang tidak terpikirkan oleh diri kita sendiri, oleh karena itu muncul beberapa pain point sebagai berikut:
Setelah melakukan tahapan pain point kami selanjutnya membuat Affinity Diagram, inti dari tahapan ini yaitu mengelompokkan permasalahan pada tahap Pain Point yang sesuai dengan kategorinya. Berikut adalah Affinity Diagram dari kelompok kami:
Setelah mengidentifikasi permasalahan, kami melakukan brainstorming untuk menganalisa hal yang perlu dilakukan untuk menyelesaikan permasalahan tersebut melalui How-Might We. Berikut adalah How-Might We yang kami dapatkan:
Phase 3 — Ideate
Pada tahap ini, kami menentukan berbagai solusi ide dari How-Might We yang sudah kami buat sebelumnya. Dari berbagai solusi ide yang kami ciptakan, kami menyusun ide-ide tersebut berdasarkan prioritas yang sangat dibutuhkan. Solusi ide yang kami sepakati berdasarkan voting dengan pertimbangan user valuenya tinggi dan effort yang dikeluarkan tidak begitu besar adalah sebagai berikut :
Berdasarkan hasil voting, dapat diambil kesimpulan bahwa pengembangan fitur Cash Flow dan Performa yang kami utamakan dalam perancangan ini adalah:
- Memperjelas perbedaan yang signifikan antara Credit dan Debit.
- Menambuat fitur untuk mengakses pendapatan dan pengeluaran per Tanggal, Bulan dan Tahun.
Setelah itu kami lanjut membuat desain crazy 8’s yang mana memuat fitur-fitur dari priorization idea yang sebelumnya sudah ditentukan.
Tahap terakhir dari fase ini adalah kami membuat user flow, dimana user flow ini akan menjadi acuan pengguna untuk melalui task-task ketika menggunakan aplikasi ini. Berikut ini adalah user flow dari kelompok kami:
- Login — Home
Maksud dari flow ini yaitu bagaimana user dapat login sampai ke menu Home pada aplikasi krealogi.
2. Profil — Detail Profil
Maksud dari flow ini yaitu bagaimana user dapat melihat home sampai ke detail profil, selain detail profil tujuan lain dari flow ini yaitu user dapat melihat terms & condition aplikasi krealogi.
3. Performa Usaha — List Barang yang dibelidan biaya yang dikeluarkan
Maksud dari flow ini yaitu bagaimana user dapat melihat performa usaha yang meliputi jumlah produksi selesai, biaya operasional dan status pesanan. selain itu juga user dapat melihat List Barang yang dibeli dan biaya yang dikeluarkan per Barang (perbulan).
4. Keuangan — Detail laporan catatan hutang pelanggan
Maksud dari flow ini yaitu bagaimana user user dapat melihat menu keuangan sampai ke detail catatan hutang pelanggan. pada flow ini user juga dapat menambah data hutang pelanggan.
5. Keuangan — Detail laporan catatan hutang jasa
Maksud dari flow ini sebenarnya sama dengan flow catatan hutang pelanggan, alurnya sama yang membedakan hanya detail laporan saja.
6. Keuangan — Rangkuman biaya tidak langsung
Maksud dari flow ini yaitu bagaiman user dapat menu keuangan sampai ke rangkuman biaya tidak langsung. pada tahap ini user juga dapat menambahkan biaya biaya yang telah dikeluarkan.
7. Keuangan — Rangkuman biaya lansung
Maksud dari flow ini sebenarnya sama dengan flow rangkuman biaya tidak langsung, yang membedakan hanya dari segi tampilan saja.
8. Keuangan — History debit dan credit
Maksud dari flow ini yaitu user dapat melihat menu keuangan sampai ke pendapatan dan pengeluaran, dan user akan melihat perbedaan antara pendapatan dan pengeluaran.
Phase 4 — prototyping
Setelah melakukan analisis permasalahan dan membuat user flow, tahap selanjutnya saya membuat wireframe, ui mockup dan terakhir prototype. Tahap prototype adalah membuat model yang dirancang untuk memecahkan masalah atau memvalidasi ide dan kemudian mengujinya pada tahap proses selanjutnya. Berikut adalah tahapannya:
- Wireframe
2. UI Design
- Proses Login Sampai ke Home yang dapat dilakukan User saat pertama kali ingin menggunakan aplikasi krealogi.
- Menu profil dilengkapi dengan detail akun dan dapat merubah informasi tentang akun.
- Terdapat fitur Terms & Condition aplikasi krealogi.
- Menu Performa yang dilengkapi dengan beberepa grafik.
- Fitur jumlah produksi, biaya operasional dan status pesanan mempunyai grafik masing masing dan disertai penjelasan.
- Terdapat fitur List Barang yang dibeli dan biaya yang dikeluarkan per Barang (perbulan).
- Pencatatan Hutang untuk pelanggan dan jasa memiliki fitur yang sama.
- Bisa menambahkan nama jasa dan pelanggan baru.
- Bisa menambahkan data hutang pelanggan dan data hutang jasa.
- Terdapat fitur detail catatan hutang yang meliputi jumlah hutang, tanggal hutang, tenor dan jatuh tempo.
- Pencatatan pencatatan biaya langsung dan tidak langsung memiliki fitur yang sama.
- Bisa menambahkan catatan biaya sesuai dengan kepentingan.
- Terdapat fitur Terms & Condition Tenor untuk catatan biaya langsung, user dapat menyesuaikan dengan keinginan.
- Detail pencatatan dapat diunduh sebagai PDF.
- Perbedaan signifikan antara Pendapatan dan pengeluaran.
- Terdapat Fitur Riwayat Pendapatan dan Pengeluaran.
- Terdapat fitur persentse untuk mengetahui lebih banyak pendapatan atau pengeluaran.
3. Prototype
Phase 5 — Testing
Pada tahap Testing ini, metode yang kami gunakan yaitu In-Depth Interview dan Usability Testing. Kami menguji prototype fitur Cash Flow dan Performa kepada responden dengan kriteria sebagai berikut:
- Berusia 20–35 tahun.
- Berdomisili di seluruh wilayah Indonesia.
- Seorang yang baru atau ingin merintis bisnis atau yang sudah mempunyai bisnis /usaha.
- Memiliki kemampuan Bahasa Indonesia sebagai native language.
- Memiliki pengetahuan dalam teknologi informasi.
- Pelaku UMKM yang memerlukan pencatatan secara digital.
- Bisa mengoperasikan perangkat mobile.
Interview dan uji aplikasi dilaksanakan pada Minggu, 28 November 2021 kepada responden bernama Kakak Siti Nurhasanah. Kakak Siti Nurhasanah merupakan pelaku UMKM yang bergerak dibidang Makanan.
Pada sesi pertama wawancara kami mencoba mencari tahu apa saja kebiasaan dan kebutuhan responden dalam mengelola bisnisnya. Khususnya pada bagaimana pencatatan baik pencatatan pendapatan atau pencatatan pengeluaran untuk produksi.
Pada sesi kedua, kami melakukan usability testing dengan cara meminta responden untuk mengoperasikan prototype fitur Cash Flow dan Performa yang sudah kami rancang. Pada tahap ini responden diminta untuk menyelesaikan 8 misi user flow, yaitu:
- Login — Home
- Profil — Detail Profil
- Performa Usaha — List Barang yang dibeli dan biaya yang dikeluarkan
- Keuangan — Detail laporan catatan hutang pelanggan
- Keuangan — Detail laporan catatan hutang jasa
- Keuangan — Rangkuman biaya tidak langsung
- Keuangan — Rangkuman biaya lansung
- Keuangan — History debit dan credit
Masing-masing dari flow akan diambil nilai SEQ nya dengan standar kelulusan nilai 5,5. Keseluruhan nilai SEQ dari masing-masing taskflow akan dijumlahkan semuanya dan dibagi oleh jumlah flow. Karena saya disini memiliki 8 task flow maka keseluruhan jumlah dari nilai SEQ akan dibagi 8. Berikut adalah hasilnya:
Berdasarkan dari hasil metric SEQ di atas, dapat diambil kesimpulan bahwa fitur Cash Flow dan Performa yang kami rancang untuk Aplikasi Krealogi tidak sepenuhnya sesuai dengan keinginan pengguna.
Tetapi kami juga tetap mendapatkan banyak insight dari responden yang bermanfaat bagi pengembangan fitur kedepannya. Berikut adalah insight yang kami dapatkan terkait pengujian fitur Cash Flow dan Performa yang kami rancang:
- Responden memerlukan alternatif button untuk mempermudah pengguna melihat grafik di setiap performa. Pada fitur performa memiliki beberapa grafik pada satu screen,hal ini membuat pengguna memerlukan waktu yang sedikit lebih lama untuk memahami inti dari setiap grafik.
- Penambahan Button Navigasi pada flow Catatan Hutang Pelanggan dan Jasa. Hal tersebut diperlukan bagi responden untuk lebih cepat kembali ke home daripada harus back beberapa kali.
- Responden memerlukan tampilan yang lebih simpel pada screen pertama yang ada di flow History Debit dan Credit. Menurut responden history tidak perlu ditambahkan karena akan membuat screen terlihat tidak menarik dan terlalu banyak fitur pada screen tersebut.
Iterasi Desain
Berdasarkan hasil observasi dan insight yang diberikan oleh responden selama melakukan uji aplikasi, maka diperlukan iterasi desain yang bertujuan untuk memperbaiki desain yang sudah dirancang sebelumnya. Berikut adalah hasil iterasi desainnya:
Kesimpulan
Fitur Cash Flow dan Performa merupakan fitur yang sangat berguna untuk membantu pengguna dalam mengetahui lebih dalam tentang kemampuan perusahaan mengenai aspek aspek biaya operasional, jumlah produksi dan status pesanan. Berdasarkan dari seluruh proses desain UI/UX untuk fitur Cash Flow dan Performa yang kami rancang untuk Aplikasi Krealogi ini, dapat diambil kesimpulan bahwa Rata -rata SEQ dari keseluruhan desain dan prototype yang sudah kami buat mendapatkan nilai sebesar 5,75 yang dimana berarti kami harus lebih banyak lagi belajar mengenai desain, kebutuhan user serta cara pengoperasian tools yang kami gunakan, dan memperbaiki lagi desain yang sudah dibuat sehingga dapat memaksimalkan usability dan meningkatkan pengalaman pengguna untuk mendapatkan hasil yang lebih baik lagi. Dalam perkembangan selanjutnya, kami merekomendasikan agar studi kasus ini untuk dievaluasi lebih dalam lagi sehingga dapat dikembangkan menjadi lebih baik lagi.