UX Case Study: Jago Last Wish Feature

A UX case study based on challenge held by Bank Jago and Skilvul to create a new insurance.

Disclaimer — Proyek ini merupakan bagian dari UI/UX Training Program yang diadakan oleh Skilvul dan Bank Jago sebagai Challenge Partner. Saya tidak bekerja atau diikat dalam kontrak professional oleh Bank Jago.

Pendahuluan

Pada kesempatan kali ini, Bank Jago selaku challenge partner membutuhkan sebuah solusi atau layanan berupa prototipe desain untuk aplikasi mobile dalam rangka membantu pelanggan untuk membuat perencanaan yang mengantisipasi kejadian yang tak terduga di masa depan yang bisa mempengaruhi penghidupan dan/atau kesejahteraan keluarga mereka. Tidak menutup kemungkinan juga pengguna kami menggunakan fitur ini untuk tujuan sosial, berkontribusi di lingkungan dan komunitas sekitar mereka bahkan setelah meninggal.

Bank Jago (Republika.co.id)

Jago Last Wish adalah salah satu tantangan yang diadakan oleh Bank Jago dan Skilvul dalam rangka pelaksanaan kegiatan Kampus Merdeka, dimana tantangan ini berupa pembuatan asuransi terbaru dari Bank Jago. Objektif dari tantangan ini yaitu para pengguna dapat mewujudkan permintaan mereka, dan dilindungi oleh asuransi terjamin serta surat wasiat.

Pertama kali ditemukan pada tahun 1992, Bank Jago (sebelumnya bernama Bank Artos Indonesia) adalah lembaga keuangan di bidang jasa keuangan. Pada tahun 2020 Bank Artos Indonesia mengubah namanya menjadi Bank Jago TBK. (Wikipedia)

Tantangan

Pada tantangan kali ini, Bank Jago bekerja sama dengan Skilvul untuk membuat fitur asuransi terbaru yakni Jago Last Wish. Adapun tantangan yang dihadapi pada challenge kali ini yaitu pembuatan surat wasiat digital dan dilindungi oleh asuransi.

Sebelum memulai tantangan ada beberapa hal yang perlu diketahui yakni user profile dan user behaviour. Maka dari itu penting bagi kita untuk mengidentifikasi profil calon pengguna aplikasi ini terlebih dahulu.

Siapakah Target User pada Aplikasi Ini?

Proyek ini direncanakan berlangsung selama kurang lebih empat minggu dan kami telah menetapkan deadline untuk merancang solusi sederhana. Kami telah menafsirkan kemungkinan solusi yang cocok untuk pengguna.

Adapun target user yang diketahui pada challenge kali ini yaitu :

• Gender : Tidak spesifik
• Umur : 18–55 tahun
• Geografis : Daerah perkotaan, SES A & B (tingkat pengeluaran per bulan)
• Profesi : Mahasiswa atau Pegawai

Bagaimana dengan karakter dan kebiasaan user?

Sebelum melakukan proses design thinking, harus diketahui terlebih dahulu informasi mengenai target user. Hal ini meliputi kebiasaan user seperti pada gambar yang tercantum dibawah berikut.

Team Role

UI/UX Role

Seperti layaknya seorang UI/UX Designer profesional, pada challenge kali ini kami juga terbagi kedalam beberapa tugas agar proses pengerjaan dapat berjalan lebih cepat dan mudahh. Dalam proyek ini, kami membaginya menjadi tiga tugas utama.

• Haryo berfokus pada pembuatan user interface design dan menentukan alur pengguna yang sederhana.
• Alfi berfokus pada pain point semua masalah dan solusi.
• Emil berfokus pada pembuatan asuransi dan fitur.

Namun kami bertiga bekerja sama dalam tahap menentukan pain points, how might-we, pembuatan sketsa crazy 8’s, menentukan alur user flow, pembuatan user interface design dan juga tahap prototyping.

Prinsip Desain

1. User-centered

User-Centered Design (Sergey Gladiki, 2018)

Berdasarkan pain points yang tercantum pada poin diatas, kelompok kami menyimpulkan bahwa pada pembuatan fitur Jago Last Wish ini harus berdasarkan sudut pandang user atau user-centered.

Alasan utama nya yaitu jika kita membuat suatu aplikasi atau fitur berdasarkan sudut pandang user, maka akan lebih mudah dalam mengimplementasikan fitur yang user inginkan.

Selain itu ada tiga komponen yang diperlukan ketika melakukan proses desain berdasarkan user experience antara lain yaitu :

• Pemahaman yang jelas tentang informasi pengguna;
• Mempertimbangkan pengalaman konsumen secara umum;
• Melibatkan klien dalam proses desain.

Desain aplikasi yang dikembangkan melalui UCD (User Centered Design) akan dioptimalkan dan fokus pada kebutuhan end-user sehingga diharapkan aplikasi yang akan mengikuti kebutuhan user (sis.binus.com)

2. Visual Hierarchy

Pembuatan user interface juga harus mudah dipahami semua pengguna, sekalipun orang awam. Mengapa? hal ini tentu diperlukan karena orang awam cenderung lebih mengerti dan lebih paham terkait dengan alur dan juga konten yang terdapat di dalam aplikasi.

Hirarki visual dapat diimplementasikan pada proses pembuatan user interface design melalui variasi skala, nilai, warna, spasi, penempatan, dan lain-lain.

A layout with a good visual hierarchy will be easily understood by your users.

- 5 Principles of Visual Design in UX (Kelley Gordon, 2020)

3. Balance

Balance Principle (Laura Keung, 2019)

Dalam pembuatan user interface design, salah satu poin penting dalam menarik perhatian user yaitu bagaimana mockup yang dibuat membuat penglihatan terasa “nyaman”. Hal ini saya cantumkan dalam proses desain yang telah dijalani. Tampilan yang saya buat sebaik mungkin informasi yang terkandung cukup jelas dan mudah untuk dilihat.

Onboard Jago Last Wish

Style Guide

Dalam pembuatan UI Style Guide, kami mengikuti prinsip desain yang telah dituliskan diatas. Dari prinsip desain tersebut terbagi menjadi beberapa bagian seperti gambar dibawah ini seperti color palette, input fields, icon and illustrations, typography, buttons, elevation, dan cards.

A style guide is a set of standards for the writing and design of documents and materials. A design style guide usually addresses logo usage, fonts, colors, and sometimes page layouts.

- Why You Need a Design Style Guide (Dave Bowers, 2011)

Design Process

Design Process adalah cara untuk mengetahui memecahkan satu atau lebih masalah, membuat sesuatu yang spesifik, dan juga berusaha mencapai target yang diinginkan dalam pembuatan suatu design. (Jarod Drysdale)

Pada challenge kali ini, saya menerapkan salah satu design process yakni Design Thinking.

Design Thinking adalah proses berulang di mana UX designer berusaha untuk memahami pengguna, menantang asumsi, dan mendefinisikan kembali masalah dalam upaya mengidentifikasi strategi dan solusi alternatif yang mungkin tidak langsung terlihat dengan tingkat pemahaman awal.

Pada tahap design thinking terdapat 5 proses utama yang digunakan antara lain empathize, define, ideate, prototype, dan testing.

Design Thinking

1. Empathize : Mencari Tahu Permasalahan dari Sisi User

Empathy

Pada gambar diatas, terlihat ada 5 proses dalam tahap design thinking antara lain empathize, define, ideate, prototype, dan testing. Tahap pertama dari proses design Thinking yaitu mencoba memahami rasa empati dari masalah yang dialami oleh pengguna.

Rasa empati sangat penting untuk melakukan proses desain yang berpusat pada manusia seperti Design Thinking, dan empati memungkinkan pemikir desain untuk mengesampingkan asumsi mereka sendiri tentang dunia untuk mendapatkan wawasan tentang pengguna dan kebutuhan mereka.

2. Define : Menyatakan Masalah dan Kebutuhan User

Selama tahap Define, saya dan rekan se-tim mengumpulkan informasi yang telah dibuat dan kumpulkan selama tahap Empathize. Pada tahap ini juga saya bersama rekan menganalisis serta melakukan pengamatan terhaadp masalah inti yang telah di identifikasi.

Untuk mempermudah proses menentukan masalah, kami membuat mood board yang berisi total 24 pain points dan how-might we yang ada. Hal ini dapat dilihat pada gambar berikut.

— Pain Points & How-Might We

Dalam tahap penentuan pain points kali ini terdapat beberapa kriteria berdasarkan permasalahan yang dihadapi oleh user. Jika disimpulkan maka pain points yang diusulkan antara lain :

• Pilihan Gamifikasi masih sedikit.
• Keuntungan serta manfaat dari asuransi yang belum diketahui.
• Informasi terkait asuransi yang belum diketahui orang awam.
• Tampilan user interface yang berantakan dan kurang jelas.

Namun, beberapa pain points yang tercantum diatas dapat diatasi dengan menerapkan how-might we seperti :

• Fitur reminder pembayaran asuransi;
• Penjelasan sebelum transaksi;
• Benefit jika berlangganan transaksi;
• Tampilan user interaface design yang simple dan jelas

Pain Points

How-Might We

3. Ideate : Mencari Solusi dan Menciptakan Ide

Setelah menemukan masalah dan kebutuhan user, kita dapat mencari solusi dan mencari ide guna menghasilkan produk yang diinginkan. Biasanya pada tahap ini terdapat beberapa objektif yang dilakukan seperti pembuatan sketsa Crazy 8’s, penentuan user flow, dan juga pembuatan wireframe.

Crazy 8's

Crazy 8’s adalah latihan membuat sketsa cepat yang menantang orang untuk membuat sketsa delapan ide berbeda dalam delapan menit. Tujuannya adalah untuk mendorong melampaui ide, seringkali yang paling tidak inovatif, dan untuk menghasilkan berbagai macam solusi untuk tantangan.

Crazy 8’s Sketch

User Flow

User flow adalah jalur yang diambil oleh pengguna prototipikal di situs web atau aplikasi untuk menyelesaikan tugas. Alur pengguna membawa mereka dari titik masuk mereka melalui serangkaian langkah menuju hasil yang sukses dan tindakan akhir, seperti membeli produk.

User Flow

— Wireframe

Wireframe adalah cara untuk merancang layanan situs web di tingkat struktural. Gambar rangka biasanya digunakan untuk menata konten dan fungsionalitas pada halaman yang memperhitungkan kebutuhan pengguna dan perjalanan pengguna.

Wireframe

4. Prototype : Implementasi Ide serta Solusi

Tahap ini merupakan fase percobaan yang bertujuan untuk mengidentifikasi solusi terbaik untuk setiap masalah yang ditemukan. Pada tahap ini juga proses navigasi dan pembuatan mockup design dilakukan sebaik mungkin. Dalam hal ini ada 2 proses yang akan dijalankan yaitu interface design dan juga prototyping.

— Interface Design

— Prototyping

5. Testing : Percobaan dari Hasil Penelitian Ide dan Solusi

Testing merupakan tahap terakhir pada proses design thinking. Meskipun ini merupakan tahap terakhir namun biasanya pada tahap ini sering dilakukan iterasi desain dari hasil percobaan di tahap sebelumnya.

Pada tahap ini juga perubahan dan penyempurnaan dibuat untuk mengesampingkan solusi masalah dan memperoleh pemahaman yang mendalam terkait dengan produk dan pengguna. Untuk lebih paham terkait pengguna, maka dilakukan usability testing.

Usability Testing

Setelah melakukan proses prototype, saat nya memasuki salah satu topik utama dalam tahap pembuatan desain yaitu usability testing. Dalam usability testing kali ini ada 4 task yang harus dilakukan oleh user yaitu :

• Login ;
• Fitur Pencarian ;
• Observasi Halaman Utama ;
• Aplikasi Jago Last Wish.

Sebelum melakukan usability testing, alangkah baiknya jika lebih mengenal dekat dengan responden/user. Berikut merupakan profil user yang akan menjadi responden pada UX challenge kali ini.

Hasil

Setelah dilakukan wawancara oleh Milla dan Rizqi selaku responden pada tahap usability testing kali ini, kami mendapat skor yang berbeda dari kedua responden. Berikut penilaian dari kedua responden berdasarkan hasil in-depth interview.

Berdasarkan penilaian responden, Milla memberi skor SEQ dengan hasil akhir skala 6 dari 7 dan Rizqi memberi hasil akhir skala 6,425 dari 7.

Hasil SEQ Responden

Apa kata user?

Berdasarkan feedback yang diberikan oleh kedua responden, ada beberapa usulan perbaikan agar hasil yang dikeluarkan lebih baik. Kami menyimpulkan beberapa kekurangan menurut user seperti :

• Tidak ada produk atau kata usulan pada fitur pencarian,
• Perbedaan antara kantong utama dan saldo;
• Penempatan kalimat pada notifikasi Pop Up di adjust ke sebelah kiri;
• Alur registrasi yang belum dibuat.

Iterasi Desain

Setelah melakukan usability testing, kami akhirnya mencoba memperbaiki kekurangan yang ada pada desain sebelumnya. Untuk perbaikan desain dapat dilihat pada gambar dibawah berikut.

— Milla

Responden pertama yang saya wawancarai pada tantangan kali ini menyarankan pada search bar dibuat pada halaman terpisah dan dibuat kata usulan pada saat mencari suatu kata kunci. Perbedaan yang signfikan dari design iteration tersebut ialah navigasi ke halaman baru ketika ingin menemukan kata kunci.

— Rizqi

Responden kedua pada tantangan kali ini yang telah melakukan tahap prototyping. Salah satu saran yang diberikan oleh Rizqi yaitu pada notifikasi Pop Up dimana penempatan tulisannya di adjust kesebelah kiri.

Apa yang dapat ditingkatkan?

Sejauh ini ada beberapa hal yang dapat ditingkatkan dalam UX challenge kali ini. Menurut saya hal-hal tersebut meliputi :

• Penelitian tentang fitur asuransi yang belum maksimal;
• Cakupan pekerjaan dari responden yang kurang beragam;
• Penambahan fitur lain seperi artikel Info Jago.

Kesimpulan

Pada kesempatan kali ini, berdasarkan wawancara dengan responden saya dapat meyimpulkan bahwa rata-rata user yang berusia muda sudah sadar akan pentingnya sebuah asuransi dalam kehidupan mereka. Walaupun belum semua, namun para responden kali ini sudah memiliki asuransi atas nama mereka. Hal ini menunjukan bahwa perkembangan asuransi sudah mulai memasuki generasi milenial dan juga generasi Z.

Referensi

• Bank Jago by Wikipedia
• Booking.com — UX Case Study by Fillipo Rovelli.
• Redesigning the New York Times app — a UX case study by Johny Vino.
• 5 Stages in the Design Thinking Process by Rikke Friis Dam and Teo Yu Siang
• 5 Principles of Visual Design in UX by Kelley Gordon.
• The Principles of Design by Laura Keung