Krealogi — Integration with Logistic and Marketplace — UX Case Study

Halo, semua! Pada kesempatan ini, saya akan menunjukkan hasil UX Case Study pertama saya. Proyek ini merupakan bagian dari UI/UX Skilvul Virtual Internship Progtamyang diadakan oleh Kementerian Pendidikan dan Kebudayaan RI dalam Program Magang Kampus Merdeka dengan Skilvul dan Krealogi sebagai Challenge Partner. Saya tidak bekerja atau diikat dalam kontrak professional oleh Krealogi.

Peran dalam Tim:

Dalam proyek ini, saya berperan sebagai UI/UX Designer yang berkolaborasi dengan dua anggota tim lain, yaitu Yuhono Indra Pinarto dan Cindy Natasya pada tahapan empathize, define, ideate, prototyping, dan testing. Berikut merupakan tanggungjawab saya:

1. Melakukan tahapan empathize dengan melakukan competitor analysis
2. Melakukan tahapan define dengan membuat pain point dan voting untuk How-Might We sebagai hasil dari tahapan empathize
3. Melakukan tahapan ideate dengan brainstorming ide solusi berdasarkan hasil How-Might We serta merancang wireframe
4. Membuat UI design hingga tahap prototype
5. Melakukan interview sebagai tahapan untuk user testing

Krealogi — Integration with Logistic and Marketplace

Berikut rincian studi kasus ini:

Latar Belakang:

Krealogi memiliki tiga tipe user yakni Vendor, Producer dan juga Seller. Vendor dan Seller merupakan pengguna yang ingin melakukan penjualan produk anyaman melalui platform Du Anyam dan platform online lainnya. Saat ini Krealogi membutuhkan sebuah desain aplikasi yang user friendly dan tentunya bisa membantu pengguna Krealogi untuk mencatat kegiatan operasional mereka, membuat strategi dan menjaga alur operasional mereka

Permasalahan:

Tidak memiliki desain aplikasi yang user friendly untuk target pengguna mereka

Tujuan:

Menjadi aplikasi yang user friendly, sehingga pengguna dapat mencatat kegiatan operasional dengan mudah untuk membuat strategi dan menjaga alur operasional

Target Pengguna:

• Gender: Tidak spesifik
• Umur: Semua umur
• Profesi: Pemilik usaha kecil, mikro, ultra mikro
• Rentang Geografis: Tidak Spesifik

Design Process:

Dalam kasus ini kami memilih Design Thinking sebagai pendekatan proses desain yang kami lakukan dengan durasi pengerjaan selama 8 minggu.

Design thinking adalah metode atau pendekatan yang digunakan untuk pemecahan masalah secara praktis dan kreatif dengan fokus utama pada users atau pengguna. Dalam pemecahan masalah, tim akan berusaha memahami apa kebutuhan users (manusia) dan menghasilkan solusi paling efektif untuk memenuhi kebutuhan tersebut.

Alasan pemilihan metode Design Thinking dalam penyelesaian kasus ini, karena metode ini 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.

Berikut ini merupakan tahap yang dilakukan dalam melakukan Design Thinking:

Tahapan dalam Design Thinking

A. Empathize

Pada tahap ini, dilakukan analisa data analitis terkait permasalahan dan kebutuhan user. Tujuan dari tahapan ini adalah untuk mengenal dan memahami keinginan, kebutuhan, serta apa tujuan users ketika menggunakan sebuah produk yang kemudian akan didefinisikan ke dalam User Persona untuk lebih mudah dalam membuat ide, merancang, dan mengetahui masalah apa yang harus ditangani. Berikut ini merupakan salah satu User Persona yang digunakan dalam merancang aplikasi Krealogi dengan fitur Integration with Logistic and Marketplace:

User Persona

Selain itu, juga dilakukan competitor analysis dengan dua aplikasi yang membantu menghubungkan toko online dengan marketplace, yaitu Ginee dan Sakoo

Competitor Analysis

B. Define

Setelah mengumpulkan dan menganalisis semua informasi yang diperoleh dari tahap empathize, langkah selanjutnya adalah melakukan identifikasi permasalahan user yang kemudian akan diselesaikan dalam perancangan produk ini. Tahap define dimulai dengan penyusunan pain point dari user oleh tim UI/UX designer dengan hasil sebagai berikut:

User Pain Points

Dari hasil pain points tersebut, selanjutnya dilakukan penyusunan How-Might We dan melakukan voting untuk memilih solusi yang akan dilanjutkan pada tahap ideate. Berikut merupakan hasil diskusi How-Might We anggota tim:

Hasil Diskusi How-Might We

How-Might We yang terpilih adalah “Mengembangkan fitur yang terintegrasi dengan logistik dan marketplace agar mempermudah seller dalam mengelola pesanan agar bisa terupdate secara real time” sebagai permalahan utama dari user. HMW terpilih digunakan sebagai input pada tahap ideate.

C. Ideate

Pada tahap ini, dilakukan brainstorming ide solusi yang akan diberikan berdasarkan How-Might We. Penyusunan ide solusi dilakukan dengan cara mengembangkan ide-ide anggota tim dari HMW terpilih untuk selajutnya dilakukan voting untuk menemukan ide solusi yang paling sesuai untuk diterapkan.

Ide Solusi Tim dari How-Might We

Setelah melakukan voting, dilanjutkan dengan pengelompokan ide solusi dari anggota tim menjadi beberapa kategori tertentu ke dalam affinity diagram.

Berdasarkan hasil pengelompokan, diperoleh beberapa kelompok yang akan dikembangkan yaitu marketplace, logistics, report, dan ekspor. Setelah itu, dilakukan prioritization idea berdasarkan user value dan effort sebagai berikut:

Prioritization Idea

Selanjutnya, dilakukan pembuatan Crazy 8’s dari masing-masing anggota kelompok dan dilakukan voting untuk memilih solusi yang paling sesuai diterapkan. Berikut merupakan Crazy 8’s dari anggota tim:

Crazy 8’s Anggota Tim

D. Prototyping

Setelah menyelesaikan tahapan ideate, saya membuat prototype high-fidelity dengan mempercantik interface design, menambahkan beberapa alur untuk membuatnya interaktif, dan membuat panduan UI style guide yang dapat digunakan untuk ke tahap testing. Namun, hal pertama yang dilakukan adalah menentukan user flow untuk platform yang akan dirancang. Berikut merupakan user flow untuk platform yang akan dirancang:

Wireframe

Setelah membuat user flow, dilanjutkan dengan perancangan wireframe sebagai visualisasi ide yang merupakan bentuk awal dari UI design dengan tampilan yang bersifat low-fidelity.

UI Style Guide

Selanjutnya, saya membuat UI Style Guide sebagai panduan yang mengatur ketentuan desain dari suatu aplikasi seperti color palette, assets, icons, dan lain sebagainya dalam merancang UI design untuk membuat standarisasi tampilan aplikasi, mempertahankan konsistensi, serta sebagai pedoman bagi tim developer untuk menyusun layout aplikasi. Berikut merupakan UI Style Guide untuk merancang aplikasi Krealogi:

Logo

Color Style

Color style yang digunakan sesuai dengan ketentuan warna yang digunakan oleh aplikasi Krealogi

Text Style

Text style yang digunakan dalam desain ini adalah Gotham sesuai dengan text style yang telah digunakan oleh aplikasi Krealogi sebelumnya

Integrasi Brand Logo

Bar

Button

Input Field

UI Design

1. Splash Screen

Splash Screen

2. Login dan Register

Login dan Register

3. Pesanan Masuk

Pesanan Masuk

3. Gudang dan Marketplace

Gudang dan Marketplace

Setelah merancang UI Design dilakukan prototyping dengan hasil sebagai berikut:

E. Testing

Pada tahap ini, dilakukan In-depth Interview dan Usability Testing bersama responden, yaitu Inggrita Putri Nirmala yang merupakan pemilik UMKM Gritamora dengan beberapa task sesuai dengan user flow yang ada pada prototype sebagai evaluasi untuk perkembangan aplikasi ini. Sebelum melakukan In-depth Interview, dilakukan penyusunan Stimulus User Research yang berisi daftar pertanyaan dan skenario testing yang akan dilakukan oleh responden. Berikut merupakan Task Scenario yang digunakan pada sesi testing dengan responden:

1. [TASK 1 — Pendaftaran dan Login] Meminta pengguna untuk melakukan pendaftaran dan login ke dalam aplikasi (berhenti di halaman Home)
2. [TASK 2 — Pencatatan Pesanan] Meminta pengguna untuk melalukan pencatatan pesanan (berhenti di halaman Pesanan masuk )
3. [TASK 3 — Tracking Pesanan] Meminta pengguna untuk melakukan tracking pesanan (berhenti di halaman Tracking Pesanan)
4. [TASK 4 — Konfirmasi Pesanan Marketplace] Meminta pengguna untuk melakukan konfirmasi pesanan marketplace (berhenti di halaman Pesanan masuk )
5. [TASK 5 — Menghubungkan Marketplace dan Kelola Marketplace] Meminta pengguna untuk menghubungkan akun marketplace dan kelola akun marketplace (berhenti di halaman Marketplace )
6. [TASK 6 — Tambah Produk Jadi] Meminta pengguna untuk melakukan tambah produk jadi (berhenti di halaman Pesanan masuk )

Stimulus User Research

Responden (Inggrita Putri Nirmala — Owner UMKM Gritamora)

Berdasarkan hasil interview menggunakan metode Single Ease Question diperoleh nilai sebesar 6 dari 7dari responden, karena masih ada beberapa fitur yang perlu ditingkatkan dalam estimasi pengiriman dan kode barang

Iterasi Desain

Berikut ini merupakan iterasi perubahan desain sesuai feedback dari user:

1. Estimasi Pengiriman

Iterasi Desain Estimasi Pengiriman

2. Kode Barang

Iterasi Desain Kode Barang

Kesimpulan

Desain yang dibuat sudah efektif dan dapat menjawab tujuan dan kebutuhan user dengan tampilan yang menarik, user friendly, dan mengintegrasikan dengan logistik dan marketplace

Rekomendasi Selanjutnya

Saran untuk perkembangan aplikasi Krealogi ke depan adalah dilakukan penyempurnaan desain terkait fitur integrasi dengan logistik dan marketplace

Referensi:

Empathize: Tahap Awal dalam Design Thinking

Pengertian Design Thinking dan 5 Tahapan di Dalamnya

Kenalan dengan User Flow, Fungsi, serta Jenis-jenisnya, Yuk!