UX Case Study: Membuat Fitur CRM pada Aplikasi Krealogi
Penambahan Fitur Customer Contact
Disclaimer! Proyek ini merupakan bagian dari UI/UX Training Program yang diadakan oleh Kementerian Komunikasi dan Informatika dengan Skilvul dan Krealogi sebagai Challenge Partner. Saya tidak bekerja atau diikat dalam kontrak professional oleh Krealogi.
Hai, Perkenalkan Diri Saya!
Haloo, perkenalkan nama saya Binti Nurul. Saat ini saya bekerja sebagai graphic design freelancer dan sedang belajar UI/UX Design untuk memperluas penguasaan skill di bidang desain grafis. Di artikel kali ini saya menuliskan mengenai UX Case Study hasil dari program virtual internship dan professional academy untuk mengembangkan fitur di aplikasi Krealogi, mulai dari ideation, design thinking, perancangan UI desain sampai pada usability testing.
Gambaran Umum
PT Karya Dua Anyam (Du Anyam) meluncurkan aplikasi Krealogi di awal bulan Maret 2021. Aplikasi ini diperuntukkan bagi pelaku UMKM kriya agar dapat mengembangkan usahanya dengan cara meningkatkan pengelolaan operasional dan komunikasi dengan customer. Namun aplikasi Krealogi belum memiliki fitur CRM (customer relationship management) sebagai salah satu pendukung dalam komunikasi dengan customer. Oleh karenanya penambahan fitur CRM khususnya customer contact diharapkan dapat meningkatkan komunikasi user dengan customer menjadi lebih baik.
Durasi
28 Agustus — 31 Oktober 2021
Metode
Define — ideation— UI design (wireframe, mockup, prototype) — UX research (in-depth interview, usability testing).
Tools
Figma
Peran dalam Tim
Saya berperan sebagai UI Designer bersama satu anggota lainnya, Pratama Oe. Dalam tim ini tanggung jawab saya adalah:
- Membuat UI kit style (membuat komponen dan varian untuk primary and secondary button, normal and dropdown text field, header, bottom navigation bar)
- Membuat UI design ( contact list, contact detail, add new contact)
- Membuat coachmark untuk menginfokan kepada user lama karena ada pembaruan tampilan “home”
- Membuat prototype
- Melakukan usability testing kepada user
Design Process
Sebuah desain yang bagus dihasilkan dari sebuah proses dan pemahaman kebutuhan user. Kami menggunakan design thinking sebagai pendekatan dalam proses yang kami lakukan.
1 — DEFINE
Kami tidak melakukan tahap emphatise karena biasanya di emphatise dilakukan untuk membuat desain yang benar-benar baru dengan cara meningkatkan rasa empati terhadap permasalahan yang dihadapi oleh banyak orang. Sedangkan di tahap define, melalui pain point, UX researcher melakukan riset untuk mengetahui kesulitan yang dihadapi user saat menggunakan aplikasi tertentu dan menawarkan solusinya.
Kami mengumpulkan informasi awal mengenai aplikasi Krealogi dan user dari brief dan product requirement document (PRD) yang diberikan oleh klien dan mencoba menggunakan aplikasi Krealogi untuk mendapatkan user experience secara langsung. Selanjutnya kami menyusun beberapa pain point yang dihadapi user.
Setelah menemukan pain point, selanjutnya kami menyusun beberapa kemungkinan solusi yang bisa kami lakukan dalam How Might We.
Di awal saat merencanakan pengembangan fitur CRM, kami ingin menambahkan fitur CRM secara lebih lengkap dan kompleks, tidak hanya menambahkan fitur customer contact saja tetapi juga bagaimana menghubungkan setiap customer contact tersebut dengan history status pesanan yang gagal, berhasil dan sedang dalam proses serta detail tugas dan pesanan yang harus dikerjakan. Namun karena terbatasnya waktu dalam pengerjakan project ini akhirnya kami memutuskan untuk menambahkan fitur customer contact yang lebih sederhana yang menjadikan adanya perubahan rencana di setiap tahap, termasuk pada usulan solusi yang mungkin bisa ditawarkan.
2 — IDEATE
Di tahap ini kami menentukan solusi yang mungkin dilakukan dari beberapa solusi yang ada dan mengelompokkan beberapa fitur yang memiliki kemiripan ke dalam kategori yang relevan. Rencana awal kami untuk menambahkan fitur CRM yang lebih lengkap dan kompleks sudah kami terapkan hingga pada tahap ideation. Namun karena adanya keterbatasan waktu akhirnya kami mengubah rencana pengembangan fitur customer contact menjadi lebih sederhana. Dan berikut solusi yang akhirnya kami terapkan pada pengembangan prototype fitur customer contact.
Layanan Pengguna
Layanan pengguna ini kami buat untuk memudahkan user mengetahui apakah kontak yang dimilikinya masih menjadi lead (calon customer) atau sudah berhasil closing dalam negosiasi dan menjadi customernya. Jika kontak yang dimiliki user masih menjadi lead, ini akan mengingatkan user untuk follow up kembali kontak tersebut dalam melakukan negosiasi dan menjadikannya sebagai customer.
Pencarian
Fitur ini akan memudahkan user untuk menemukan kontak customer yang diinginkan tanpa harus men-scroll satu per satu. Selain itu fitur filter/sort juga memudahkan user untuk menentukan tampilan daftar kontak untuk diurutkan sesuai abjad pertama nama kontak dari awal atau dari akhir.
Organizing
Dari pendapat user yang kami lakukan saat riset, tampilan “home” aplikasi Krealogi versi sebelumnya terlihat membosankan dan monoton. Selain itu ada fitur yang sebenarnya bisa menjadi sorotan ketika user melakukan login, seperti fitur “biaya operasional” dan “status pesanan” pada tab “performa”.
Database
Seperti menambahkan kontak baru pada umumnya, user dapat menambahkan kontak baru dengan cara mengklik tanda “+” pada navigation bar “contact”. Namun kami menambahkan fitur “download” untuk memudahkan user dalam mengecek status pesanan maupun tugas yang harus dikerjakan secara keseluruhan dalam bentuk dokumen dengan format .xls maupun .pdf tanpa harus membuka contact detail satu per satu. Dokumen tersebut dapat diprint-out oleh user jika diperlukan dalam membuat laporan fisik.
Selanjutnya kami menyusun task flow yang akan dilakukan oleh user ketika menggunakan aplikasi Krealogi dan memanfaatkan fitur customer contact.
3 — PROTOTYPE
Sebelum membuat prototype, kami membuat sketsa awal wireframe tampilan aplikasi Krealogi sesuai rencana pengembangan dan solusi yang sudah ditentukan menggunakan cara Crazy 8's.
Dari wireframe tersebut kami mengembangkannya ke dalam high-fidelity prototype. Dalam prosesnya kami juga melakukan beberapa perubahan menyesuaikan dengan hasil evaluasi di setiap tahap.
Interface Design
Untuk warna kami menyesuaikan dengan style guide dasar dari Krealogi. Namun kami melakukan perubahan pada ketentuan primary color karena menurut kami primary color yang diberikan kurang sesuai dengan yang dimunculkan secara visual di aplikasi Krealogi saat ini. Jika di style guide yang diberikan primary colornya menggunakan dua warna dengan kode hex #EAEAEA dan #C8AB90, maka kami mengambil secondary color di style guide yang diberikan sebagai primary color dengan kode hex #911C52. Untuk secondary color kami menggunakan warna monokrom yang diturunkan dari primary color agar lebih simple dan mudah diingat oleh user.
Sedangkan untuk font kami mengikuti style guide awal menggunakan typeface Gotham dengan ukuran yang disesuaikan kembali agar user bisa mendapatkan experience lebih nyaman.
Interactive Prototype
Interactive prototype ini tersedia di Figma dan dapat diakses di sini.
UI Style Guide
Berikut ini adalah UI style guide yang kami gunakan dalam membuat high-fidelity prototype.
4 — USABILITY TESTING
Sebelum melakukan usability testing, kami melakukan in-depth interview terlebih dahulu kepada user untuk mendapatkan informasi apakah user sudah mengetahui aplikasi Krealogi sebelumnya. Hal ini dilakukan untuk mendapatkan pembanding nantinya ketika user sudah pernah menggunakan aplikasi Krealogi sebelumnya dan ketika melakukan testing dengan fitur yang baru.
In-depth Interview
In-depth interview ini dilakukan dengan satu responden yang memenuhi kriteria:
- Semua umur (laki-laki/perempuan)
- Pemilik usaha kecil, mikro, ultra mikro
- Memiliki/melaksanakan usaha kriya
- Berdomisili di seluruh wilayah Indonesia
- Memiliki kemampuan Bahasa Indonesia sebagai native language
- Pengguna OS android
In-dept interview ini kami laksanakan selama kurang lebih 15 menit. Saat in-depth interview dengan user, kami mendapatkan insight yang menarik karena user sudah pernah menggunakan aplikasi Krealogi sebelumnya. Menurut user, tampilan “home” yang baru lebih segar dan menarik dibandingkan versi sebelumnya. Jika versi sebelumnya tampilan “home” hanya menggunakan button tanpa ada icon, di tampilan “home” yang baru kami menambahkan icon di menu yang ditampilkan. Dan dibandingkan menampilkan ringkasan pesanan dan permintaan penawaran, kami menampilkan ringkasan “biaya operasional” dan “status pesanan” yang sebelumnya berada di tab “performa”.
Usability Testing
Sesuai dengan tujuan kami mengembangkan aplikasi Krealogi dengan menambahkan fitur customer contact, kami meminta user untuk mengeksplor dan menambahkan kontak baru. Menurut user, form untuk menambahkan kontak baru sudah cukup untuk memenuhi kebutuhan user dalam menyimpan informasi customer. Namun ada masukan dari user bahwa akan lebih maksimal lagi jika jumlah status pesanan yang gagal, berhasil dan dalam proses dalam diklik dan menampilkan rinciannya. Namun karena terbatasnya waktu dalam program professional academy, kami belum bisa merealisasikan perbaikan berdasarkan insight tersebut.
Kesimpulan
Berdasarkan hasil riset dengan user, kami menyimpulkan bahwa user merasa aplikasi Krealogi sangat membantu dalam mengerjakan pembukuan dan pencatatan pesanan. Namun user menginginkan tampilan aplikasi Krealogi yang lebih segar dan atraktif. User juga merasa bahwa saat mengisi form-form yang ada di Krealogi sangat banyak yang harus diisi dan tidak bisa dilewatkan satu pun — harus diisi semua.
Dalam perkembanganya, teknologi memang akan sangat membantu pekerjaan sehari-hari. User juga bisa mendapatkan pengalaman yang lebih baik dan nyaman jika ditunjang dengan tampilan visual yang bagus dan mudah dipahami.
Kami menambahkan fitur CRM khususnya customer contact untuk memudahkan user dalam memantau pesanan setiap customer agar usahanya dapat berkembang lebih baik — baik dari sisi produksi maupun manajemennya.
Harapan kami tim Krealogi dapat mengembangkan aplikasi ini lebih lanjut sehingga user mendapatkan pengalaman yang lebih baik serta merasa lebih nyaman saat menggunakannya.
