UX Case Study : Pengembangan Fitur Simple CRM pada Aplikasi Krealogi
Disclaimer : Penulis bukanlah bagian (pekerja) dari Krealogi (Du Anyam). Tulisan ini bagian dari tugas yang diberikan dalam program Digital Talent Scholarship (Kominfo) bersama Skilvul dimana Krealogi beperan sebagai Challenge Partner. Seluruh materi dalam tulisan ini hanya digunakan untuk bahan belajar/pelatihan.
Latar Belakang
Pada 23 Maret 2021, Du Anyam secara virtual meluncurkan aplikasi Krealogi yaitu sebuah aplikasi bagi usaha kreatif Indonesia. Krealogi dibangun untuk menjawab permasalahan-permasalahan yang dihadapi UMKM, diantaranya kendala dalam manajemen pesanan, produksi, persediaan hingga pengiriman. Ini sejalan dengan visi dari Du Anyam yaitu memberdayakan komunitas, mempromosikan budaya dan meningkatkan kesejahteraan hidup.
Krealogi merupakan sebuah bagian dari revolusi digital untuk UMKM Indonesia. Aplikasi Krealogi dibuat dengan tampilan yang ramah pengguna, sehingga dapat digunakan oleh pelaku usaha dari berbagai kalangan. Krealogi menghadirkan kemudahan dalam pencatatan dan perencanaan strategis UMKM dengan fitur-fitur unggulan seperti Catat Pesanan, Rencana Produksi, Catat Biaya hingga Laporan Usaha akan membantu proses-proses tersebut. Di Krealogi juga terdapat berbagai kelas pelatihan dan modul digital untuk mengembangkan kemampuan berbisnis para penggunanya.
Dalam perjalanannya Krealogi memiliki permasalahan dalam desain aplikasi mereka yang tidak user-friendly untuk target pengguna sehingga membutuhkan sebuah desain aplikasi yang user-friendly dan juga bisa membantu pengguna untuk mencatat kegiatan operasional, membuat strategi dan menjaga alur operasional mereka. Selain itu pada aplikasi Krealogi belum terdapat beberapa fitur seperti Simple CRM, Cash Flow Feature dan Integration with Logistic and Marketplace yang mana dibutuhkan oleh pengguna mereka.
Objektif
Dari permasalahan diatas, Krealogi memberikan tantangan untuk membuat tampilan aplikasi yang user-friendly untuk target pengguna mereka dan solusi berupa desain untuk fitur mereka yang belum tersedia. Dan kelompok kami memilih untuk membuat solusi desain fitur yang belum tersedia yaitu Simple Customer Relationship Management (CRM).
Tujuan Utama:
- Mengembangkan fitur-fitur terkait CRM untuk memungkinkan jangkauan pelaku usaha ke pelanggan-pelanggan dengan mudah.
- Mengembangkan tampilan antar-muka pengguna agar user-friendly dan mudah untuk digunakan.
Output yang diharapkan dari pengembangan diatas adalah:
- Desain high fidelity dan prototype yang bisa diklik
- Menggambarkan proses desain serta metodenya
- Menggunakan resource free license untuk font, icon vektor dan aset lainnya
- File Figma (.fig) untuk preview desain yang dibuat
Anggota Tim
Dalam mengerjakan proyek ini, saya bekerja sama dengan sebuah tim yang berisikan 4 orang, yaitu saya, Nur Lujeng Kinanti, Prayoga Adhi Pangestu & Syaza Syauqina. Peran masing-masing kami dalam tim memiliki tanggung jawab dan tugas yang sama. Karena dalam prakteknya pada tahapan proses desain dari mulai Empathizing, Defining, Ideating dan juga Testing kami kerjakan dan diskusikan bersama-sama. Hanya pada tahap Prototyping kami membagi tugas dalam membuat wireframe & UI Design, dan saya bertanggung jawab untuk membuat desain fitur Beranda dan Kartu Nama.
Design Process
Dalam studi kasus ini kami menggunakan Design Thinking sebagai pendekatan proses desain yang kami lakukan. Kami menggunakan Design Thinking karena dapat digunakan untuk menciptakan inovasi dalam product design. Metode ini mengatasi masalah yang belum jelas/belum diketahui dengan pendekatan human-centered dan fokus pada apa yang paling penting bagi pengguna. Dari semua proses desain yang ada, design thinking bisa dikatakan yang terbaik untuk menggambarkan istilah “thinking outside the box”. Dengan ini, tim dapat melakukan UX research, prototyping dan usability testing dengan lebih baik untuk menemukan cara baru dalam memenuhi kebutuhan pengguna.
Tool yang digunakan dalam pengerjaan proyek ini adalah Figma.
Tahap 1 — Empathize
Pada tahap ini kita harus menggunakan empati dalam memahami masalah yang coba diselesaikan. Empathize bertujuan membantu desainer dalam mencari tahu pandangan & kebutuhan dari target penggunanya dengan penelitian sebelum mendefisinikan problem statement dan melakukan ideation. Empati sangat penting dalam proses desain dengan pendekatan human-centered karena memungkinkan kita mengesampingkan asumsi pribadi sehingga bisa mendapatkan wawasan yang nyata tentang pengguna dan apa yang benar-benar mereka butuhkan.
Sumber data yang kami proses didapatkan dari hasil AMA (Ask Me Anything) dengan Challenge Partner, slide deck dari Challenge Partner dan observasi aplikasi sejenis.
Sesuai dengan challenge yang kami pilih yaitu pengembangan fitur Simple CRM dan berdasarkan slide deck yang dibagikan oleh Krealogi pada slide Fitur CRM terdapat beberapa kondisi dan kebutuhan. Diantaranya, belum adanya database pelanggan dan penyimpanan kontak pelanggan pada aplikasi whatsapp dilakukan secara manual sehingga menyulitkan pada saat menghubungi pelanggan sambil mengecek data penjualan. Penyimpanan data pelanggan juga diperlukan untuk melihat riwayat pelanggan berdasarkan hasil penjualan. Dan juga dibutuhkan Kartu Nama serta fitur broadcast message sebagai media promosi atau berbagi informasi dengan pelanggan. Lalu yang terpenting adalah memastikan bahwa tampilan aplikasi ini sudah user-friendly sehingga mudah digunakan oleh pengguna.
Tahap 2 — Define
Dari hasil Empathize kita sudah mengetahui dan mengumpulkan informasi tentang apa yang dibutuhkan oleh pengguna. Pada tahap Define kita mengidentifikasi dan melakukan analisa terhadap informasi dari pengguna untuk menentukan permasalahan inti yang disebut dengan problem statement. Metode yang digunakan pada tahap ini adalah dengan membuat Pain Point dan How-Might We bersama dengan anggota tim.
Pain Point
Mengumpulkan dan menganalisa poin-poin permasalahan (Pain Point) yang mungkin dialami oleh pengguna berdasarkan informasi yang didapat pada tahap Empathize. Pada tahap ini kami berkolaborasi menuliskan hasil analisa masing-masing anggota tim mengenai permasalahan yang dihadapi oleh pengguna pada Sticky Note di dalam aplikasi FigmaJam. Dan berikut pain point yang dihasilkan:
How-Might We
Setelah selesai membuat pain point, masing-masing anggota tim menjelaskan detail tentang poin-poin yang sudah ditulis lalu bersama-sama menyimpulkan tujuan bagaimana kita (how-might we) bisa menyelesaikan permasalahan tersebut dan dikelompokkan berdasarkan topik yang sama. Selanjutnya dari How-Might We yang sudah terkumpul dilakukan voting untuk menentukan prioritas tujuan dari poin permasalahan yang mana yang akan diselesaikan oleh kelompok kami.
Dan akhirnya kami memutuskan How-Might We yang akan menjadi fokus dalam membuat tujuan penyelesaian masalah adalah: Membuat pengguna dapat mengelola data dan berkomunikasi dengan pelanggan.
Tahap 3 — Ideate
Tahap selanjutnya yang dilakukan adalah Ideate yaitu brainstorming ide berdasarkan tujuan yang sudah ditentukan pada how-might we. Pada tahap ini anggota tim berdiskusi mencari dan mencatat semua ide-ide solusi untuk menyelesaikan permasalahan yang sudah ditentukan. Yang diperlukan pada tahap ini adalah menemukan sebanyak mungkin ide solusi. Tidak ada ide yang jelek atau tidak masuk akal. Kita hanya harus “think outside the box” untuk mencari cara alternatif dalam melihat masalah dan menemukan solusi yang inovatif untuk menyelesaikan masalah tersebut.
Ide Solusi
Masing-masing anggota tim mencatat dan mempresentasikan idenya tentang fitur-fitur yang perlu dikembangkan sebagai solusi dari permasalahan diatas. Berikut hasilnya:
Affinity Diagram
Dari ide solusi yang sudah dibuat, selanjutnya dikelompokkan berdasarkan kategori yang sama dalam Affinity Diagram. Berikut hasil diskusi kelompok kami dalam mengkategorikan ide-ide solusi:
Diagram Prioritas
Langkah selanjutnya ide solusi dikelompokkan dalam diagram prioritas untuk mengetahui ide solusi mana yang harus diselesaikan lebih dulu berdasarkan User Value yang paling tinggi dan Effort yang rendah.
Diagram prioritas terbagi dalam 4 kelompok dengan keterangan:
- Yes, Do It Now : Mempunyai nilai kegunaan yang tinggi dan dibutuhkan oleh pengguna dengan usaha yang dibutuhkan dalam pengerjaannya rendah atau dapat cepat diselesaikan. Maka ide solusi pada bagian ini mendapakan prioritas yang pertama untuk dikerjakan.
- Do Next : Masih mempunyai nilai kegunaan yang tinggi tapi dibutuhkan usaha yang lebih besar atau waktu pengerjaan yang lebih lama sehingga ide solusi pada bagian ini mendapat prioritas kedua untuk dikerjakan.
- Do Last : Nilai kegunaan atau kebutuhannya rendah dan usaha yang diperlukan untuk pengerjaannya juga rendah maka ide solusi pada bagian ini mendapatkan prioritas ketiga untuk dikerjakan.
- Later : Ide solusi pada bagian ini dikerjakan paling akhir karena nilai kegunaan atau kebutuhan yang dimiliki rendah dan butuh usaha yang besar dalam penyelesaiannya.
Anggota tim memberikan voting pada bagian Yes, Do It Now untuk menentukan ide solusi yang diprioritaskan untuk dikerjakan.
Pada gambar diatas, berdasarkan hasil voting, seluruh ide solusi pada bagian Yes, Do It Now mendapatkan jumlah vote yang sama. Kami berpendapat bahwa semua ide solusi tersebut sangat dibutuhkan dalam pengembangan Simple CRM. Jika disimpulkan maka yang perlu dikembangkan adalah fitur Data Pelanggan, Daftar Kontak, Riwayat Pembelian Pelanggan, Broadcast Message Promo atau Iklan dan Sinkronisasi Kontak WA.
Crazy 8's
Crazy 8’s adalah salah satu metode untuk brainstorming desain. Disebut crazy eight karena anggota tim dipaksa untuk membuat sketsa ide dan solusi kedalam 8 bagian lipatan kertas dalam waktu 1 menit tiap sketsanya atau 8 menit dalam satu kertas. Dan berikut hasil sketsa tim kami:
Tahap 4 — Prototype
Prototype dalam design thinking dapat diartikan sebagai pembuatan model sederhana dengan biaya yang rendah untuk berbagai solusi yang ada. Dengan membuat prototype kita dapat merubah ide yang telah didapatkan menjadi produk tiruan nyata atau uji coba. Pada fase ini, tim anda akan berfokus pada pembahasan mengenai kendala serta kekurangan yang dimiliki oleh produk atau prototype tersebut. Sehingga, prototype ini juga akan mengalami pengembangan dan melalui proses perbaikan untuk mendekati hasil produk yang maksimal dan sesuai dengan kebutuhan pengguna.
Sebelum membuat sebuah prototype, ada langkah-langkah yang harus dilakukan terlebih dahulu. Dimulai dari membuat Task Flow yaitu diagram langkah-langkah yang harus dilakukan pengguna untuk menyelesaikan sebuah task atau proses. Selanjutnya Task Flow tersebut diterjemahkan kedalam Wireframe yaitu sebuah layout untuk menata suatu item di laman website atau aplikasi dalam versi Low-fidelity. Dari wireframe yang bersifat Low-fidelity dikembangkan lagi menjadi User Interface (UI) Design yang bersifat High-fidelity. Namun, sebelum merancang UI Design kita harus membuat Design System terlebih dahulu. Design System adalah sebuah komponen yang dapat digunakan kembali untuk keperluan perancangan dan pengembangan produk baik dari sisi desain maupun code programming agar desain yang dibuat terjaga konsistensinya.
Task Flow
Berdasarkan hasil dari diagram prioritas kami berdiskusi untuk membuat task flow dari ide solusi yang sudah ditentukan.
Dari task flow diatas kami mulai membagi tugas dalam perancangan wireframe, UI design hingga prototyping.
Wireframe
Wireframe merupakan sebuah layout yang dapat membantu desainer dalam mempresentasikan informasi dalam interface, memberikan outline struktur dan layout interface dan mempercepat proses ideation.
Berdasarkan task flow, kami membagi tugas dengan tanggung jawab yang akan dijelaskan dibawah.
Beranda & Profil
Saya sendiri mendapat bagian untuk merancang tampilan beranda yang diperbaharui sesuai dengan penambahan fitur baru dan merancang tampilan halaman profil dengan fitur kartu nama.
Manajemen & Daftar Pelanggan
Profil Pelanggan & Riwayat Pembelian
Daftar Kontak & Pesan
Design System
Dalam merancang interface pasti menggunakan komponen yang sama berulang kali. Untuk itu diperlukan adanya Design System yang memberikan keuntungan diantaranya konsistensi dalam hasil desain UI dan code front-end, mempercepat proses kerja UI Design dan Developer dan dapat mengakomodir kebutuhan product design di masa depan.
Warna
Typography
Tombol
Text Field
Navigation Menu
UI Design
Beranda & Kartu Nama
Manajemen Pelanggan
Profil Pelanggan & Riwayat Pembelian
Daftar Kontak & Pesan
Prototyping
Tahap 5 — Testing
Research Objective
- Mencari tahu kebutuhan pengguna dalam mengelola data pelanggan dan promosi
- Mencari tahu tingkat keberhasilan SEQ
- Mencari tahu tingkat kegunaan, kemudahan, dan kepuasan dari solusi ide yang ditawarkan pada alur proses
Respon Baik :
- Cukup puas dengan fitur-fitur yang disediakan seperti label pelanggan, fitur-fitur tersebut memudahkan pengguna untuk mengetahui siapa yang diprioritaskan.
- Informasi yang disajikan baik dan lengkap, tidak ditemukan adanya kendala.
Butuh Detail :
- Daftar Kontak : Tombol Kembali, Filter tambahan
- Business Card : Perlu pengarahan untuk menuju sharing Kartu Nama
- Profil Pelanggan : Titik lokasi customer lebih detail
- Riwayat Pembelian: Filter detail untuk memudahkan pencarian
Iterasi Desain
Kesimpulan
Berdasarkan pengujian, desain UI/UX untuk Simple CRM pada aplikasi Krealogi yang kami buat telah memenuhi kebutuhan target user. Responden mengatakan bahwa informasi CRM sudah membantu dan cukup detail.
Penutup
Studi kasus ini dibuat sebagai bahan pertimbangan bagi tim Krealogi berupa rekomendasi desain untuk pengembangan aplikasi Krealogi di masa datang.
