UX Case Study : Fitur Keuangan di Aplikasi Krealogi oleh Du Anyam

Efika Ambar
8 min readOct 6, 2022

--

Membuat Fitur Catat Hutang dan Arus Kas Sederhana

https://krealogi.com

Latar Belakang

Studi kasus ini dilaksanakan sebagai salah satu tugas dari program DTS Professional Academy Batch 3 2022 : UI/UX Design Mastery (Intensive Class) yang diselenggarakan oleh Digitalent Kominfo. Kami diberikan kesempatan mengikuti sebuah Challenge untuk membuat desain aplikasi agar lebih friendly sesuai tipe user aplikasi Krealogi. Salah satu fitur yang coba kami kembangkan adalah pada fitur keuangan yaitu fitur catat hutang dan arus kas sederhana.

Krealogi merupakan sebuah aplikasi pencatatan dan pendataan digital yang diperuntukan bagi UMKM. Aplikasi ini bertujuan untuk membantu pencatatan kegiatan operasional dan membuat perencanaan strategis mulai dari manajemen pesanan, produksi, persediaan sampai pengiriman.

Objektif

Melakukan penambahan fitur baru pada aplikasi mobile Krealogi by Du Anyam, yaitu : Fitur Keuangan (Fitur Catat Hutang dan Arus Kas Sederhana), Fitur Komunikasi (Fitur Bot Whatsapp, Notifikasi, dan Pop Up Promo), Fitur Integrasi (Tracking Pengiriman Pesanan dan Market Place), dan Fitur Pengguna (Kartu Nama dan Database Pelanggan).

Peran dalam Tim

Sebagai UX Designer yang berkolaborasi dengan 3 anggota tim, yaitu Yafet Sinjal, Alvin Aditya S dan Nanin Arisawati. Dalam tim ini saya bertugas mengembangkan desain fitur keuangan pada aplikasi Krealogi.

Challenge Partner

  • Simple CRM (belum didesain dan belum tersedia)
  • Cash Flow Feature (belum didesain dan belum tersedia)
  • Integration with Logistic and Marketplace (belum didesain dan belum tersedia)

Kondisi Krealogi

  • Tidak adanya catatan rangkuman performa usaha
  • Tidak adanya catat hutang
  • Tipa pengguna memiliki term and condition berbeda untuk transaksi
  • User sulit dalam memantau rangkuman proses produksi

Yang dibutuhkan Krealogi

  • Fitur rangkuman usaha (arus kas sederhana) yang meliputi performa bisnis dan produksi

Design Process

Pada tahap ini kami menggunakan Process Design Thinking. Kami memilih Design Thinking karena menurut kami metode ini dapat berguna dalam memecahkan masalah yang kompleks, dengan merumuskan masalah dari sudut pandang pengguna, menghasilkan banyak ide dalam proses brainstorming, dan mengadopsi pendekatan langsung dalam pembuatan dan pengujian desain awal. Berikut ini adalah tahapan-tahapan dalam Process Design Thinking.

  1. Emphatize

Pada tahap ini kami mencari tahu pandangan dan kebutuhan user dengan melakukan research sebelum mendefinisikan problem statement dan melakukan ideation. Kami melakukan research dengan melihat rekaman AMA session with challenge partners dan membaca dokumen penting berupa slide materi dan design system challenge partners.

2. Define

Proses Define stage terdiri dari Pain Points dan How Might We. Pada tahap Define ini kami mengumpulkan informasi tentang permasalahan dan kebutuhan user yang telah didapatkan pada tahap Empathize, setelah itu kumpulkan semua informasi yang kami dapat, kemudian kami masukan kedalam Pain Points. Dalam langkah ini, harus mengutamakan User sebagai pusat objek permasalahannya.

Pain Points

Pain Points Krealogi

Setelah informasi terkumpul, selanjutnya kami melakukan pengelompokan menjadi how-might we. HMW adalah cara untuk mengubah sebuah masalah menjadi pertanyaan. Dengan mengubah masalah menjadi pertanyaan, kita mengubah mindset kita bahwa setiap masalah pasti dapat diselesaikan.

How Might We

How Might We Krealogi

3. Ideate

Pada bagian ini, kita harus bisa menyalurkan ide sebanyak-banyaknya dan sekreatif mungkin dari How-Might We yang telah ditentukan yaitu “Membuat fitur baru yang diperlukan pada aplikasi dan memperbaiki desain UX yang telah ada untuk memudahkan user dalam menggunakan aplikasi”. Setelah melakukan brainstorming, kemudian ditemukan Solution Idea berupa :

  • user friendly untuk produksi, logistik dan marketplace
  • untuk Pemodal dan Peminjam
  • fitur user friendly untuk UMKM
  • communication user friendly
  • transaksi UMKM dan pembeli

Solution Idea

Solution idea, pada tahap ini kami menemukan beberapa ide solusi untuk membuat fitur baru.

  • Video tutorial, course dan webinar
  • Fitur baru keuangan
  • Fitur baru user
  • Program disabilitas
  • Sistem keamanan
  • Fitur baru komunikasi
  • Fitur integrasi
  • Fitur sosial
  • Bahasa
Solution Idea

Setelah membuat Solution Idea, langkah selanjutnya adalah mengelompokan Solution Idea menjadi Affinity Diagram yang terdiri beberapa kategori.

Affinity Diagram

Affinity Diagram

Langkah yang selanjutnya yaitu membuat Prioritazion Idea. Di dalam langkah ini, Solution Idea tadi dipisahkan menjadi 4 bagian dan berfungsi untuk menentukan solusi ide mana yang masuk kedalam Yes, do it now, Do next, Do last, dan Later.

Prioritization idea

Dari sini kami menyimpulkan beberapa hal yang akan kami kerjakan dan kembangkan, yaitu :

  • Integration
  • New feature finance
  • New feature communication
  • New feature user
Prioritization idea
Prioritization idea
Prioritization idea
Prioritization idea
Proses Define & Ideate

User Flow

User flow di bawah ini adalah flow pada fitur catat hutang dan arus kas sederhana.

User Flow Catatan Hutang dan Arus Kas Sederhana
User Flow

Wireframe

Untuk wireframe kami membuat low fidelity untuk menyusun konten dan informasi.

Wireframe Catatan Hutang
Wireframe Arus Kas Sederhana
Wireframe

UI Style Guide

UI Styleguide di buat agar memudahkan designer ketika membuat tampilan User Interface dan juga memudahkan developer nantinya. UI Styleguide yang kami buat adalah UI Styleguide meliputi color style, text style, button style, input field, header style, tabbing, general, checkbox/radio, dan chip.

UI Style Guide
UI Style Guide
UI Style Guide

UI Design

Ini adalah hasil high fidelity dari halaman catatan hutang dan arus kas sederhana.

UI Design Catatn Hutang
UI Design Arus Kas Sederhana

4. Prototype

Hasil dari prototyping ini adalah sebuah prototype yang dapat digunakan untuk testing.

Prototype

5. Testing

Selanjutnya adalah tahapan terakhir dari metode Design Thinking yaitu melakukan tahap testing. Tahap testing ini di gunakan untuk mengetahui apakah solusi yang telah kita tawarkan sudah memenuhi kepuasan dari pengguna.

Stimulus User Research

Application Name : Krealogi

Research Method : In-Depth Interview

Research Date : 20–21 September 2022

Research Objective

  1. Pengguna dapat memahami rangkuman usaha (arus kas sederhana) yang meliputi performa bisnis, produksi dan catat hutang.
  2. Pengguna mencari tahu keefektivitasan fitur kartu nama dan download database (fitur user) pada aplikasi Krealogi.
  3. Pengguna dapat memahami fitur integrasi market place dan logistik baik secara langsung sehingga monitoring dapat lebih tepat atas pesanannya.
  4. Pengguna dapat memahami fitur komunikasi bot WA, notifikasi, obrolan, dan promo pop up.

Respondent Criteria

  1. Berusia 18–55 tahun
  2. Pekerjaan sebagai pemilik usaha kecil, mikro, ultra mikro
  3. Wanita dan Pria
  4. Berdomisili di seluruh wilayah Indonesia
  5. Memiliki kemampuan Bahasa Indonesia

List of Questions

  1. Silahkan mulai dengan perkenalan diri dari responden
  2. Bergerak dibidang apa usaha/bisnis anda yang sedang anda geluti?
  3. Apakah anda sebelumnya pernah menggunakan aplikasi pencatatan kas?

a. Bagaimana Anda melakukan proses pencatatan dan pendataan? (Secara manual atau digital?)

  1. Menurut Anda, seberapa pentingkah untuk melakukan proses pencatatan dan pendataan usaha?
  2. Kendala apa saja yang dirasakan pada saat pencatatan kegiatan usaha?
  3. Apakah Anda mengetahui aplikasi Krealogi? (Jelaskan, jika mengetahui)
  4. Apa ekspektasi Anda tentang Krealogi?

Research Scenario

  1. Berikan salam saat bertemu dengan responden
  2. Perkenalkan diri dan jelaskan maksud tujuan kegiatan yang akan dilakukan
  3. Jelaskan alur proses kegiatan dari awal sampai akhir
  4. Meminta responden untuk memperkenalkan diri mulai dari Nama, Pekerjaan, dan Domisili
  5. Melakukan wawancara berdasarkan Question List
  6. Menjelaskan singkat tentang aplikasi Krealogi
  7. Memberikan link Figma kepada responden dan minta responden untuk Share Screen
  8. Menjelaskan singkat tentang apa yang harus dilakukan dan cara mengoperasikan Figma Prototype oleh responden
  9. [TASK 1] Meminta pengguna untuk melakukan pendaftaran dan login ke dalam aplikasi (berhenti di halaman Home) dan observasi apa yang dilakukan oleh responden

a. Tanyakan apakah ada kendala?

b. Apakah informasi pendaftaran sudah sesuai dengan kebutuhan pengguna? Bagaimana?

10. [TASK 2] Meminta pengguna untuk menggunakan fitur catatan hutang dan arus kas sederhana dan minta untuk melakukan proses tersebut hingga berhasil. Observasi apa yang dilakukan oleh responden:

a. Tanyakan apakah ada kendala?

b. Untuk button Simpan apakah dapat membantu pengguna dalam melakukan pencatatan? Bagaimana?

c. Apakah informasi yang ditampilkan sudah memenuhi kebutuhan?

11. [TASK 3] Meminta pengguna untuk melihat halaman Beranda (promo pop up), menggunakan fitur komunikasi dan kartu nama. Observasi apa yang dilakukan oleh responden

a. Tanyakan apakah ada kendala?

b. Untuk button Simpan apakah dapat membantu pengguna dalam melakukan proses simpan? Bagaimana?

c. Apakah informasi yang ditampilkan sudah sesuai dengan kebutuhan pengguna?

12. [TASK 4] Meminta pengguna untuk menggunakan fitur database pelanggan di halaman akun dan observasi apa yang dilakukan oleh responden

a. Tanyakan apakah ada kendala?

b. Untuk button Simpan dan Unduh apakah dapat membantu pengguna dalam melakukan proses simpan dan unduh? Bagaimana?

c. Apakah informasi yang ditampilkan sudah sesuai dengan kebutuhan pengguna?

13. [TASK 5] Meminta pengguna untuk menggunakan fitur integrasi logistik dan marketplace. Observasi apa yang dilakukan oleh responden

a. Tanyakan apakah ada kendala?

b. Untuk button Simpan apakah dapat membantu pengguna dalam melakukan proses simpan? Bagaimana?

c. Apakah informasi yang ditampilkan sudah sesuai dengan kebutuhan pengguna?

14. Menanyakan tingkat kegunaan, kemudahan, dan kepuasan dari responden setiap menyelesaikan Fitur Pendaftaran, Fitur Keuangan, Fitur Komunikasi, Fitur Database Pelanggan dan Fitur Integrasi dengan Single Ease Question (skala Likert)

15. Penutup dan sampaikan terima kasih

Record Data User Research

Nama Lengkap: Shouman Nugroho

Jenis kelamin: Pria

Umur: 29 tahun

Pekerjaan: Wirausaha mandiri

Domisili: Bogor

Memiliki kemampuan Bahasa Indonesia

Task 1 — Pendaftaran dan Login
Task 2 — Pencatatan Hutang dan Arus Kas Sederhana
Task 3 — Komunikasi dan Kartu Nama
Task 4 — Database Pelanggan
Task 5 — Integrasi Logistik dan Marketplace

Kesimpulan

Berdasarkan Record Data User Research yang telah dilakukan maka dapat disimpulkan bahwa desain yang telah kami buat sudah sesuai dengan harapan pengguna, namun masih terkendala pada proses prototype yaitu pada fitur database pelanggan, fitur integrasi logistik dan marketplace.

Beberapa catatan yang bisa kita ambil adalah sebelum dipublish prototype harus diperbaiki, untuk tampilan sudah oke. Untuk fitur keuangan bisa ditambahkan keterangan untuk harga satuan pokok, agar user bisa mengetahui keuntungan dari harga jual sebagai laporan bulanan atau mingguan. Pengguna aplikasi lebih terbantu dari segi pencatatan keuangannya.

Terima kasih telah membaca Study Case ini. Kami sangat menghargai kritik serta saran Anda untuk membuat desain yang kami buat lebih baik lagi.

--

--