Studi Kasus: Proses A/B Testing Redesign Microsite Kitabisa

Studi kasus penggunaan third-party platform di GO-GIVE

herisetiana
Inside Kitabisa
4 min readAug 23, 2021

--

Dalam tulisan ini, saya akan berbagi pengalaman saya dalam proses redesign microsite bersama tim Third-Party Platform (3PP).

Dalam project ini, kami melakukan redesign microsite Kitabisa yang berada di aplikasi partner, yaitu menu GO-GIVE di aplikasi Gojek.

Role saya sebagai UI/UX Designer, dan tools yang saya gunakan dalam project ini mencakup Sketch, Abstract, dan Invision.

Design dan User Flow Microsite sebelum revamp

Design Process

Understand

Dimulai dari briefing product owner tentang kebutuhan tim 3PP untuk redesign microsite, yang kondisinya User Interface microsite Kitabisa tidak konsisten dengan design partner sehingga perlu ada adjustment design di microsite Kitabisa. Tujuan dari project ini adalah redesign dan restruktur konten yang sudah ada, dengan harapan mampu meningkatkan user experience.

User Testing dilakukan kepada 3 partisipan untuk mendapatkan insight awal. Partisipan: Zd — Pegawai kantor, Qnt — Pegawai kantor, Mg — Ibu rumah tangga

Insight
-
User tidak sadar jika belum login di microsite
- User sulit menemukan kategori yang sesuai preferensi user
- User
merasa seperti sedang membaca portal berita, penuh dengan tulisan

Design Challenges
How might we
meningkatkan user experience yang sudah ada. Sehingga user mudah menggunakan microsite dan mudah menemukan campaign yang sesuai dengan preferensi user.

Design result

  1. User tidak sadar jika belum login di microsite Kitabisa

Karena experience seperti diatas, user tidak sadar kalau sedang dalam kondisi nonlogin saat berada di microsite Kitabisa. Penambahan halaman SSO (Single-sign-on dari partner side) diantara kedua langkah tersebut bisa menyelesaikan issue ini.

sso page

2. User sulit menemukan kategori yang cocok

Variasi 1
Restruktur dan implementasi section carousel, kategori dan artikel banner. Tujuannya supaya user lebih cepat menemukan campaign yang sesuai, dalam 1 halaman.

section carousel, section kategori, artikel banner

Variasi 2
Implementasi tabbing berdasarkan kategori, bertujuan memudahkan user mengeksplorasi dan menemukan campaign sesuai preferensi dengan cepat.

section tabbing, artikel banner

Solusi untuk mengakomodasi preferensi user

Design sebelumya terdapat endless scrolling yang memungkinkan user melihat semua campaign yang ada di Kitabisa dalam satu halaman. Dari hasil interview, user merasa lebih suka jika campaign yang sesuai dengan preferensi mereka berada didepan dan mudah diakses.

Variasi 1
Menyediakan CTA menuju explore, salah satu alternatif menfasilitasi user mendapatkan cempaign yang sesuai.

cta lihat semua di bagian bawah

Variasi 2
Didalam tabbing kategori disediakan See all button, tujuannya supaya user lebih cepat menemukan preferensi campign, berdasarkan kategori disetiap tabbing.

see all button di detail kategori

3. User merasa microsite Kitabisa seperti membaca portal berita

Kenapa user melihat Kitabisa microsite seperti membaca portal berita? Dari hasil interview diasumsikan terdapat informasi berulang. Didalam image banner terdapat tulisan tentang campaign, title panjang, subtitle panjang, padahal kebiasan user membaca hanya sekilas.

Variasi 1
Menghilangkan nama campaigner, resize ukuran card, restruktur button donasi.

card carousel variasi 1

Variasi 2
Menghilangkan subtitle, nama campaigner, restruktur tittle dan nominal donasi.

card carousel variasi 2

Finding

Split user dilakukan selama 2 minggu dan tambahan interview user.

Rekomendasi untuk iterasi

  • Tabbing kategori efektif mengurangi pilihan yang tidak perlu, sehingga user lebih cepat mengembil keputusan untuk donasi.
  • Menyesuaikan image banner di carousel berdasarkan campaign prioritas, karena user tertarik untuk klik card berdasarkan posisi.
  • Memaksimalkan dan menyesuikan nama tabbing karena user nyaman dan tertarik dengan ketegori yang terlihat jelas diatas.

Iterasi design

Project result

Design proses yang dilakukan masih banyak yang perlu dikembangkan. Pelajaran yang didapat proses ini A/B testing, membutuhkan waktu lebih lama karena proses development. Positifnya proses ini, pengambilan keputusan lebih efektif dan mudah, karena data yang dihasilkan lebih valid dan mudah dipahami oleh semua stakeholder.

Hasil dari proses revamp ini sudah release di Gojek App menu Gogive. Kunjungi Gogive untuk donasi dan silahkan memberikan feedback melalui section survei di Gogive.

Cek link untuk berdonasi melaui Gogive.Kitabisa.com dan instal App Kitabisa

--

--