UX Case Study : Aplikasi Belajar Online — Belajar Yuk!
Latar Belakang
UX Case Study ini adalah case yang didasarkan pada Challenge yang diberikan oleh Skilvul terkait dengan proses pembelajaran UI/UX Design. Dengan memberikan keadaan dan kasus sebagai berikut.
Perusahaan ini adalah perusahaan yang bergerak di bidang edutech sedang melakukan perombakan besar-besaran pada platform edukasi-nya yaitu ‘Belajar Yuk!’ meliputi tampilan dan struktur sistem. Aplikasi ini memiliki konsep untuk kursus online sehingga bisa menyiapkan talenta-talenta digital di Indonesia dengan menyediakan kursus di bidang Programming, Digital Marketing, UI/UX Design, Product Management, dan masih banyak lagi.
Identifikasi Masalah
Sejak 1 tahun lalu, terdapat penurunan revenue sehingga dilakukan riset kecil dengan hasil sebagai berikut.
- User tidak senang dengan tampilan
- Platform-nya rumit untuk digunakan
- Loading yang sangat lama
- Susah mencari motivasi untuk belajar
Dengan hasil riset ini, Aplikasi Belajar Yuk akan dirombak total dengan tujuan untuk lebih menjadi user friendly dengan tampilan yang menarik dan dapat meningkatkan motivasi belajar ketika menggunakan platform-nya.
Objektif
Oleh karena itu, yang menjadi perhatian dalam case ini adalah.
- Mencari tahu kebutuhan pengguna dalam melakukan pembelajaran online
- Mencari tahu kebiasaan pengguna dalam mengakses aplikasi
- Mencari tahu tingkat kegunaan, kemudahan, dan kepuasan dari pengguna dalam menggunakan aplikasi pembelajaran online
Peran dalam Tim
Berperan sebagai UI/UX Designer yang melakukan kolaborasi dengan 2 anggota tim, yaitu Grace Victoria dan Eka Widy — yang juga sama-sama berperan dalam UI/UX Designer. Meskipun begitu, untuk UI Desain-nya sendiri, masing-masing dari kita memiliki desain dengan proyek yang berbeda.
- Membuat User Flow untuk Pain Point yang didapatkan
- Mendesain Wireframe terkait halaman yang terdapat pada User Flow
- Membuat desain UI pada Figma berdasarkan wireframe yang telah dibuat dan dikembangkan lagi
- Melakukan Prototyping pada desain yang telah dibuat
Design Process
Dalam kasus ini kami memilih menggunakan Design Thinking sebagai pendekatan design process yang kami lakukan. Design thinking adalah metode atau pendekatan yang digunakan untuk pemecahan masalah secara praktis dan kreatif dengan fokus utama pada users atau pengguna (logique.co.id).
Seperti yang dikatakan Don Norman, User Experience (Pengalaman pengguna) mencakup semua aspek interaksi pengguna akhir dengan perusahaan, layanan-nya, dan produknya. Dari UX sendiri, yang menjadi perhatian utama agar menghasilkan produk yang baik adalah dengan memperhatikan 3 aspek, yaitu useful (sesuai dengan kebutuhan), usable (kualitas yang bagus), and delightful (menghasilkan kepuasan).
Dalam proses melakukan pemodelan UX, ada beberapa cara yang bisa digunakan. Dan secara garis besar, tahapan yang dibutuhkan dalam design process UX memiliki sedikit banyaknya hal yang berkaitan dengan design thinking. Di mana design thinking dikenal dengan 5 tahapannya yaitu Empathize, Define, Ideate, Prototyping, dan Testing. Dan pada UX, terdapat 5 stages yaitu, Plan, Research, Design, Test, dan Analyze (maze.co). Sehingga, untuk design process kali ini diputuskan untuk menggunakan Design Thinking.
Berikut adalah tahapan-tahapan proses desain yang dilakukan.
1 — Empathize
Hal yang dilakukan pada tahap ini adalah dengan menemukan pandangan dan kebutuhan terkait aplikasi pembelajaran ini dari pengguna dengan melakukan riset sebelum didefinisikan.
Berdasarkan riset kecil yang dilakukan, didapatkan hasil sebagai berikut.
- User tidak senang dengan tampilan
- Platform-nya rumit untuk digunakan
- Loading yang sangat lama
- Susah mencari motivasi untuk belajar
Dari hasil ini, maka akan dilakukan proses selanjutnya, yaitu define.
2 — Define
Pada tahap ini, dilakukan penjelasan terkait riset yang dilakukan. Selain itu juga melakukan benchmarking dengan salah satu website pembelajaran yaitu Skilvul untuk mendapatkan pandangan terhadap kursus online.
Yang dilakukan pada tahapan ini yaitu dengan mendefinisikan target pengguna dan juga pain point yang dirasakan pengguna. Lalu, didapatkan hasil sebagai berikut.
3 — Ideate
Setelah berhasil mendefinisikan hal yang akan menjadi perhatian, lalu tahap selanjutnya yaitu melakukan diskusi dengan tim dan menentukan tiga pain point yang menjadi perhatian utama, yaitu :
Tahap selanjutnya yaitu, menentukan hal-hal yang bisa dilakukan (How Might We), dengan hasil sebagai berikut.
Hasil yang didapatkan dari How Might We tersebut akan dikelompokkan menjadi beberapa bagian dengan menggunakan Affinity Diagram. Dengan hasil yang didapatkan sebagai berikut.
Setelah melakukan pengelompokan tersebut, tahapan selanjutnya adalah dengan melakukan prioritizing atau menentukan prioritasi dari ide-ide yang didapatkan.
Untuk bagian yang paling penting yaitu ‘Yes, do it now’ pada kelompok Homepage dan Reminder. Pada ‘Do Next’ ada kelompok Gamification, dan ‘Later’ pada kelompok Device.
Tahapan terakhir dari proses Ideate yaitu dengan membuat gambaran kasar (wireframe) dengan melakukan Crazy-8’s. Di mana, pada tahapan ini adalah melakukan pembuatan wireframe pada selembar kertas HVS yang dibagi menjadi 8 bagian. Lalu, akan dilakukan pembuatan wireframe kasar tersebut sebanyak 8 buah dengan masing-masing gambar dengan waktu 8 detik. Hasil yang didapatkan adalah sebagai berikut.
Lalu, dilakukan pemilihan wireframe bersama anggota tim.
4 — Prototyping
Pada tahap prototyping ini, hal yang dilakukan adalah menyusun userflow dengan beberapa task. Setelah itu, melakukan pembuatan wireframe yang nantinya akan dikembangkan menjadi UI Design. Setelah selesai, akan dilakukan prototyping pada desain tersebut.
User Flow terkait Transaksi dan Mengakses Kelas yang saya buat adalah sebagai berikut.
Dari User Flow tersebut didapatkan halaman-halaman yang akan diakses nantinya. Lalu, halaman-halaman tersebut didefinisikan melalui wireframe sebelum menjadi desain UI.
Dari wireframe tersebut lalu dikembangkan menjadi desain UI. Ini adalah beberapa hasil dari desain yang dilakukan.
Lalu, dari hasil desain tersebut. Dilakukan penyusunan alur informasi seperti yang sudah digambarkan pada User Flow. Di mana menghasilkan prototype sebagai berikut.
5 — Testing
Pada proses testing ini, saya menggunakan cara riset dengan In Depth Interview. Di mana, proses testing ini juga sekalian bertujuan untuk melakukan User Research dengan Usability Testing.
Informasi Responden sebagai berikut.
Nama : A
Pekerjaan : BPN di daerah Riau
Umur : 28 tahun
A adalah seorang pekerja di kantor cabang BPN di daerah Riau. Beliau saat ini sedang tertarik untuk pemahaman mengenai teknologi awam mengenai teknologi.
Hasil SEQ : 6
Dengan mengerjakan sebanyak 4 task yaitu terkait, Pendaftaran & Login, Transaksi Pembelian Kelas, Mengakses Kelas, dan Melanjutkan Kelas.
Dai hasil wawancara yang dilakukan, saya mendapatkan pandangan dari seseorang yang masih awam terkait ilmu mengenai teknologi dan tertarik untuk ikut terlibat di dalamnya.
Kesimpulan
Proses yang dilakukan untuk merombak ulang semua aplikasi Belajar Yuk! sudah dilakukan dan mendapatkan berbagai feedback. Dari semua tahapan yang dilakukan, aplikasi Belajar Yuk! masih perlu melakukan iterasi terkait UX Desain proses yang dilakukan. Di mana pada proses yang dilakukan selama ini, masih terdapat beberapa kendala pada saat pengerjaan. Selain itu, juga ada beberapa masukan saat melakukan interview yang bisa menjadi pertimbangan sebelum melakukan developing nantinya.
Rekomendasi Selanjutnya
Masih perlu dilakukan iterasi dalam proses penyusunan UI/UX Desain pada aplikasi Belajar Yuk!. Pada proses selanjutnya, bisa dilakukan fokus pada beberapa pain point yang masih belum tersentuh karena satu dan lain hal.
Sekian hasil dari melakukan UX Challenge dan juga UX Case Study. Terima kasih kepada yang sudah berkenan membaca. Semoga untuk kedepannya, saya bisa memberikan tulisan dan hasil desain yang lebih mumpuni. Stay healthy, all!
