UX Case Study : Krealogi — Logistic and Marketplace Integration

Latar Belakang

Krealogi merupakan aplikasi pencatatan transaksi penjualan yang ditujukan untuk orang — orang yang berkecimpung dalam bidang UMKM (Usaha Mikro, Kecil dan Menengah). Namun dengan beriringnya waktu diperlukan tambahan fitur untuk mempermudah pengguna dalam melakukan usaha, salah satu fitur tersebut adalah Logistic and Marketplace Integration, dimana aplikasi Krealogi ini akan dihubungkan dengan jasa kurir (logistik) dan aplikasi marketplace lain yang sudah ada (seperti Tokopedia, Shopee dan yang lainnya).

Objektif

Berdasarkan latar belakang yang sudah dipaparkan di atas, maka objektif dari UX Case Study ini antara lain:

  • Membuat perubahan pada fitur pencatatan pesanan agar bisa di integrasikan dengan marketplace yang sudah ada.
  • Membuat fitur daftar pelanggan dan lacak pengiriman.

Peran dalam Tim

Pada proses pengerjaan UX Case Study ini, saya hanya membantu beberapa tugas dari Alma Verdiana, Firda Nur Arofah, dan Ngatijo.

Design Process

Dalam pengerjaan UX Case Study ini, kita mengacu pada proses Design Thinking yang dimana terbagi lagi menjadi 5 tahapan tersendiri yaitu Emphatize, Define, Ideate, Prototyping dan Testing.

Source : CXNetwork

A. Emphatize

Dalam tahap Emphatize kita memikirkan secara garis besar apa saja yang menjadi masalah atau kendala dalam penggunaan ataupun penerapan aplikasi Krealogi. Berikut ini poin-poin permasalahan yang kami temukan:

  • Pengguna membutuhkan kolom ongkos kirim dan mengetahui kalkulasi ongkos kirim berdasarkan lokasi, berat dan ukuran barang.
  • Pengguna membutuhkan database catatan masuk dan database pelanggan.
  • Pengguna membutuhkan untuk mengakses logistik langsung dari Krealogi.
  • Pengguna membutuhkan akses data dari dan ke beberapa marketplace langsung dari Krealogi.
  • Pengguna membutuhkan alur penggunaan aplikasi yang lebih mudah.

B. Define

Dalam tahap Define kita mencoba mengelompokkan secara lebih rinci permasalahan yang didapat, lalu dicari solusi yang nanti diharapkan bisa mengatasi masalah tersebut. Tahap ini akan dibagi menjadi dua bagian yaitu:

B-1. Pain Points

Pain Points merupakan proses untuk memperinci titik sumber masalah dari semua yang telah kita temukan sebelumnya. Adapun contoh dari proses Pain Points yang kita lakukan bisa dilihat seperti pada gambar di bawah ini.

Define — Pain Points

B-2. How-Might We

How-Might We merupakan tahapan dimana kita memikirkan apa solusi yang bisa dilakukan untuk mengatasi permasalahan yang sudah di rinci pada tahap Pain Points. Adapun contoh dari proses How-Might We yang kita lakukan bisa dilihat seperti pada gambar di bawah ini.

Define — How-Might We

C. Ideate

Tahapan Ideate merupakan proses dimana kita melakukan brainstorming solusi dari catatan yang sudah kita buat sebelumnya (How-Might We) lalu membentuk alur proses dari aplikasi yang kita kerjakan. Adapun bagian — bagian dari tahapan Ideate antara lain :

C-1. Solution Idea

Pada proses Solution Idea masing-masing anggota tim akan berusaha memunculkan ide-ide kreatif mereka, yang selanjutnya akan diadakan voting untuk menentukan ide mana yang kita terapkan nanti.

Ideate — Solution Idea

C-2. Affinity Diagram

Pada proses Affinity Diagram kita melakukan pengelompokan dari ide-ide yang sudah dibuat ke dalam suatu fitur yang nanti menjadi acuan proses selanjutnya.

Ideate — Affinity Diagram

C-3. Prioritization Idea

Pada proses Prioritization Idea kita menentukan fitur apa yang harus dikerjakan terlebih dahulu yang sifatnya bisa cepat diselesaikan, namun memiliki pengaruh yang cukup besar dalam aplikasi Krealogi. Adapun hasil dari Prioritization Idea yang sudah kita diskusikan dapat dilihat pada gambar dibawah ini.

Ideate — Prioritization Idea

C-4. User Flow

Pada proses User Flow kita mulai mendefinisikan bagaimana alur proses fitur yang kita buat sebelumnya agar bisa diterapkan pada aplikasi Krealogi. Adapun gambaran dari alur proses yang kita buat dapat dilihat pada gambar dibawah ini.

Ideate — User Flow

D. Prototyping

Pada tahap Prototyping ini, kita mulai membangun bentuk antarmuka dari proses atau fitur aplikasi berdasarkan User Flow yang sudah dibuat sebelumnya. Proses pembangunan antarmuka ini dibagi menjadi 4 bagian antara lain:

D-1. Wireframe

Wireframe merupakan bentuk awal dari antarmuka yang ingin kita bangun dan sifatnya low-fidelity atau berupa rangka-rangka antarmuka saja yang nanti dipakai sebagai acuan saat membangun UI Design.

Prototyping — Wireframe

D-2. Design System

Sebelum membangun UI Design, kita terlebih dahulu membuat komponen dasar-nya agar saat pengerjaan UI Design nanti, kita sudah memiliki aturan yang sama. Dengan begitu setiap UI Design yang kita produksi terlihat konsisten dari awal sampai akhir.

Prototyping — Design System

D-3. UI Design

Pada tahap UI Design, masing-masing anggota membangun tiap antarmuka menggunakan Design System yang ada dan mengacu pada Wireframe yang dibuat sebelumnya.

Prototyping — UI Design (Full)
Prototyping — UI Design (Sample)

D-4. Prototype

Pada tahap Prototype kita menghubungkan semua UI Design yang dibuat agar seolah-olah bekerja seperti aplikasi yang sudah selesai, hal ini bisa dilakukan di aplikasi Figma dengan menghubungkan tiap elemen ke halaman yang bersangkutan dan seterusnya. Berikut ini contoh Prototype yang sudah kita bangun pada tahapan Prototyping ini.

E. Testing

Pada tahap Testing kita melakukan wawancara langsung dengan user yang memiliki kriteria sebagai berikut:

  • Berusia 18–55 tahun
  • Pekerjaan sebagai wirausaha/ pemilik UMKM
  • Berdomisili di seluruh wilayah Indonesia
  • Pengguna aplikasi digital/ handphone secara aktif
  • Pernah menggunakan aplikasi e-commerce atau pencatatan pesanan digital

Wawancara ini dilakukan melalui Zoom Meeting pada tanggal 22 September 2022 dengan Firda Nur Arofah sebagai pewawancara.
Dalam sesi wawancara tersebut, user akan diminta untuk melakukan 3 Task dalam Prototype yang sudah kita buat. Adapun hasil dari wawancara tersebut bisa dilihat pada gambar dibawah ini.

Hasil Testing User

Read the full article here

Total
0
Shares
Leave a Reply

Your email address will not be published.

Prev
Designers, (Re)define Success First – A List Apart

Designers, (Re)define Success First – A List Apart

Table of Contents Hide Influence the system#section2Pursue well-being, equity,

Next
Color Glass Icons: 1,800+ geometric icons that look like gems

Color Glass Icons: 1,800+ geometric icons that look like gems

Have you ever looked through a piece of colored glass?

You May Also Like