Akhir — akhir ini e-learning menjadi suatu solusi untuk kita belajar lebih mudah dimasa pandemi, yang mana sangat membantu orang-orang untuk belajar skill baru atau memperdalam skillnya. Dengan banyaknya bootcamp,kursus-kursus yang bermunculan kita jadi bingung memilihnya disinilah Studykuy ikut beperan sebagai platform e-learning dalam membantu orang belajar atau meningkatkan skill.
Pembukaan
Ini adalah Studi kasus pertama saya yang merupakan challenge dari kelas UI/UX Design Mastery skilvull. Distudi kasus ini saya mencoba mendesain secara terstruktur untuk mengembangkan challenge brief yang telah diberikan sehingga dapat menyelesaikan masalah yang ada di challenge.
tools : Figma,Figjam,Adobe photoshop
Ok bismillah mari kita mulai, sebelumnya mohon maaf jika banyak kekurangan. 🙏🔥🙏
Latar belakang challenge
Sebuah perusahaan X yang bergerak di bidang edutech sedang melakukan perombakan besar-besaran pada platform edukasinya yang meliputi tampilan dan struktur sistem. Perusahaan X merupakan pemilik platform edukasi yang memberikan berbagai macam kursus online untuk menyiapkan talenta-talenta digital di Indonesia dengan menyediakan kursus di bidang Programming, Digital Marketing, UI/UX Design, Product Management, dan masih banyak lagi. Akan tetapi, perusahaan X mengalami penurunan revenue sejak 1 tahun lalu dan tim riset telah melakukan riset kecil dimana hasilnya sebagai berikut.
Objektif
Berdasarkan challenge brief yang diberikan , saya diberikan challenge untuk mendesain sebuah e-learning mobile app untuk perusahaan X . dengan objektif :
- Membuat app learning yang user-friendly
- Mendasain interface yang menarik
- Meningkatkan motivasi user dalam belajar
dengan cakupan proses bisnis
- Pendaftaran akun
- Login
- Home
- Detail kursus
- Transaksi pembelian
- Proses pembelajaran
Proses desain
Dalam proses mendesain challenge ini saya menggunakan metode design thinking untuk prosesnya karena design thinking karena berfokus pada kebutuhan atau masalah dari user,kapabilitas teknologi dan bisnis sehingga desain yang dibuat bisa lebih dekat dengan user apa yang user inginkan.
empathize
Empathize (berempati) adalah tahap awal dari design thinking, di tahap empathize ini membantu saya dalam memahami dan berasumsi apa masalah,kebutuhan,dan goals user lebih dalam. berdasarkan challenge brief yang diberikan diketahui :
Target user :
- Umur 18 -55 tahun
- Profesi : Karyawan/karyawati
- Bahasa : Indonesia
- Level ekonomi : Menengah ke atas
Pain points atau masalah yang dihadapi oleh user antara lain :
- User tidak senang dengan tampilan
- Platformnya rumit untuk digunakan
- Loadingnya yang sangat lama
- Susah mencari motovasi untuk belajar
Define
Setelah dilakukannya tahap empathize dan diketahui masalah atau pain points utama yang dihadapi user ditahap ini saya menggali lebih dalam masalah-masalah lain yang dihadapi oleh user antara lain sebagai berikut :
a. Paint points
b. How might we
setelah medapatkan data dari hasil menggali masalah-masalah yang dihadapi user, saya mendapatkan insight beberapa ide seperti apa aplikasi yang akan dibuat nanti.
Ideate
setelah selesai mendapatkan hasil dari proses define dan mendapat gambaran seperti apa aplikasi yang akan dibuat tahap selanjutnya adalah mencari solusi-solusi atau ide yang dapat memecahkan permasalahan yang didapat.kemudian menentukan ide apa saja yang prioritasnya tinggi dan barulah saya lanjutkan ke tahap prototyping.
Prototyping
setelah menyelesaikan tahap Ideate saya mendapatkan cukup gambaran konsep dari ide yang saya dapat(asumsi) . disini saya melakukan User flow,Wireframing,UI styleguide, UI design, dan prototype.
a. User Flow
Untuk User flow saya hanya berfokus pada Login, transaksi, dan memulai kelas supaya memperjelas alur atau flow dari cakupan proses bisnis yang ada di challenge brief.
Catatan : desain yang saya berikan adalah desain final sudah diperbaiki berdasarkan masalah yang user hadapi dalam tahapan testing.
b. Wireframe(Lo-fi)
tahap pertama dalam mendesain UI adalah membuat wireframe atau lo-fi(Low Fidelity) atau bisa juga orang awam menyebutnya sketsa awal. disini pertama-tama saya mencoba membuat lo-fi(Low Fidelity) dalam bentuk digital karena saya terbiasa membuatnya langsung dari figma
c. UI design (Hi-fi)
Setelah mendesain wireframe/lo-fi(Low Fidelity) saya lanjutkan dengan menyempurnakannya menjadi hi-fi (High Fidelity) Disini saya mencoba untuk menjelaskan fungsi atau maksud dari desain yang saya buat
Masuk & daftar
Side bar
Tab bar
Beranda
Preview detail kelas
Pembayaran
kelas
Kelasku
Showcase
Keranjang
Profil
Leaderboard
Penukaran point
d. UI styleguide
Berikut adalah Design system atau styleguide
Prototype
Setelah selesai mendesain hi-fi (High Fidelity) saya lanjutkan dengan membuat prototypenya, disini menurut saya proses pembuatannya cukup rumit harus berhati-hati dan teliti karena begitu banyaknya wire yang saling terhubung agar animasi prototype berjalan.
<iframe style=”border: 1px solid rgba(0, 0, 0, 0.1);” width=”800" height=”450" src=”https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fproto%2FSghV2GNeudu0koMK1hN5ZX%2Fskilvul-study-case-challenge%3Fpage-id%3D0%253A1%26node-id%3D44%253A2%26starting-point-node-id%3D44%253A2%26scaling%3Dscale-down%26show-proto-sidebar%3D1" allowfullscreen></iframe>
Testing
Semua proses sudah selesai prototype juga sudah siap saatnya saya Usability Testing atau uji coba apakah desain yang saya desain bekerja dengan baik,mudah dimengerti,dan menarik bagi user.
pada tahap ini, saya menggunakan metode In-Depth Interview dan Single Ease Question (SEQ) karena mudah dan cepat serta saya ingin mengetahui lebih lanjut apakah desain ini sudah memenuhi tujuannya,dan apakah ada kekurangan yang harus diperbaiki.
Setelah mendapatkan 3 user 2 diantaranya teman saya dan 1 anggota dari komunitas hobby yang saya ikuti. saya melakukan testing secara online menggunakan figma, Google meet dan Videocall whatsapp karena adanya masalah jaringan internet.
Untuk tugas yang diberikan kepada user antara lain:
- Mendaftar akun
- Membeli kelas
- Memulai kelas
- Mengeksplor aplikasi
Ok,testing telah selesai dilakukan Dari hasil testing saya mendapatkan jawaban dan masalah yang hampir sama dari user.
Tugas 1 mendaftar akun
masalah diproses ini adalah tidak adanya notif setelah pembuatan akun telah sukses. Dari sisi UI tidak ada masalah semua user paham setiap bagian-bagian yang ada seperti tombol-tombol dan kolom teks. User sangat suka dengan flow yang saya buat setelah membuat akun langsung diarahkan ke beranda tanpa perlu harus login terlebih dahulu.
Tugas 2 membeli kelas
Ini adalah task yang paling disukai karena user merasa senang dengan interaksinya, ketika user memasukkan kelas ke keranjang tombol keranjang ikut hilang menandakan bahwa kelas tersebut sudah dimasukkan ke keranjang.
Tugas 3 memulai kelas
disini 2 user merasa repot ketika video materi kelas telah selesai harus kembali ke halaman kelas untuk melanjutkannya. Oleh karena itu saya menambahkan tombol baru untuk melanjutkan kelas ketika kelas sudah hampir selesai
Tugas 4 mengeskplor aplikasi
Tidak ada masalah serius saat eksplorasi user sudah sangat paham setiap bagian menu yang ada. dan user juga suka dengan adanya fitur poin yang mana membuat user semangat belajar user.
setelah melakukan semua tugas saya meminta mereka meberikan nilai 1–7 dan mendapat nilai 6 untuk tugas 1,3,4 dan 7 untuk tugas ke 2.
kesimpulan
berdasarkan hasil testing yang didapatkan, aplikasi yang saya rancang sudah berjalan dengan baik dan memenuhi objektif yang diberikan. dari UI yang mudah dimengerti,flow yang cukup baik,serta memberikan reward dengan menukarkan poin dari hasil belajar. hanya saja ada beberapa bagian yang membuat user tidak nyaman.
Catatan : desain yang saya berikan adalah desain final sudah diperbaiki berdasarkan masalah yang user hadapi dalam tahapan testing.
Refleksi
Ini pertama kalinya saya mendesain secara terstruktur yang mana biasanya saya langsung mendesain UI tanpa tahu tujuannya dan hanya mementingkan estetika . Banyak kesulitan yang saya hadapi disetiap prosesnya yang mana harus mencari banyak refrensi dengan membaca study case orang lain, bertanya kepada teman dan orang yang sudah professional dibidang ini.
Karena saya melakukan research berdasarkan asumsi saya menjadi belajar bahwa setiap user mempunyai karakter yang berbeda , yang awalnya saya berpikir leaderboard akan membuat user kurang percaya diri ternyata tidak semua user merasa demikan.dari sini saya belajar betapa pentingnya user research untuk mengembangkan sebuah aplikasi/produk.
Saya sadar ini bukanlah solusi yang terbaik masih banyak harus diperbaiki tapi setidaknya dengan studi kasus ini saya menjadi bersemangat dapat membuat/mengembangkan solusi yang lebih baik untuk kedepannya.
