Redesign Mobile App Waste4Change - UI/UX Case Study
This project is part of the UI/UX training program implemented by Skilvul , for Kampus Merdeka program held by Kementerian Pendidikan, Kebudayaan, Riset, dan Teknologi Republik Indonesia. Waste4Change is the Challenge Partner. I am not working for nor contracted professionally by Waste4Change
Introduction
Halo saya Rizki Windiawan, saat ini saya telah menyelesaikan UI/UX Challange dari Skilvul yang bekerja sama dengan Waste4Change, challange ini berupa proses merancang tampilan mobile dari Waste4Change terutama pada bagian alur Send Your Waste. Perancangan ini dimulai dari reseach hingga sampai ke tahap testing.
Tentang Waste4Change
Waste4Change adalah sebuah perusahaan yang memiliki tujuan mengurangi jumlah sampah yang berakhir di TPA dengan cara menyediakan solusi pengelolaan sampah yang bertanggung jawab.
Waste4Change memiliki program utama yaitu Send Your Waste atau bisa disingkat SYW, SYW ini adalah sebuah program yang memastikan sampah anorganik pengguna didaur ulang secara optimal dan bertanggung jawab. Sampah yang dapat dikelola pada program ini yaitu sampah kertas, plastik, plastik multilayer, limbah jelantah, kaca, metal, kemasan bekas brand.
Cara kerja program ini dapat dilihat pada gambar dibawah ini.
Program SYW ini dibagi menjadi dua jenis yaitu SYW Reguler dan SYW yang memiliki sistem point, SYW point ini biasanya adalah program yang bekerja sama dengan perusahaan lain. perbedaan mendasar dari kedua program ini adalah adanya sistem poin atau reward tersebut. SYW poin menyediakan poin yang dapat ditukarkan menjadi beberapa reward seperti pulsa, voucher, e-wallet, pada bagian alur kerja pun terdapat sedikit perbedaan. Alur( Cara Kerja) dapat dilihat pada gambar dibawah ini.
Objektif
Objektif dari kegiatan ini adalah mendesain ulang tampilan mobile pada alur Send Your Waste baik yang reguler maupun yang poin, untuk mengetahui permasalahan yang ada, diperlukan analisis yang berupa :
- Mencari tahu keluhan yang ada pada Waste4Change
- Mencari tahu kekurangan pada Waste4Change
- Mencari tahu kebutuhan dan hal-hal penting untuk mengirimkan sampah
Peran Dalam Tim
Pada saat mengerjakan proyek ini, dilakukan dengan bekerja sama dengan rekan saya yaitu Dinar Hasnan dan Rifky Pujianto serta dibimbing oleh mentor Muhammad Ihsan Fauzan.
Peranan saya pada kelompok yaitu lebih condong pada kepemikiran dan strategi seperti mengungkapkan/memberikan seluruh ide ide pada saat proses design thinking, memberikan saran dan masukan, menjelaskan bagian bagian yang belum dipahami oleh tim, mengatur logika urutan pada bagian userflow dan menjadi pemecah masalah pada tim.
Namun tidak hanya itu saja, saya juga berperan untuk membuat wireframe, membuat UI Design, dan juga mendapatkan bagian untuk menjelaskan dan membimbing User terkait Task yang pada pada proses User Testing.
Design Process
Pada saat melakukkan design process, saya berkolaborasi dengan kedua teman saya dengan menggunakan metode pendekatan design thinking.
Kenapa menggunakan metode ini ? karena metode ini efektif dalam menyelesaikan masalah dengan berpusat pada pengguna, menciptakan ide menggunakan sistem brainstorming serta melakukan pendekatan langsung.
Tahapan yang ada pada design thinking yaitu empathize, define, ideate, prototyping, dan testing.
1 — Empathize
Empathize adalah proses mencari tahu pandangan dan kebutuhan dari target usernya dengan research.
Pada tahap ini kami mencari permasalahan dengan cara berempati menggunakan perspektif pengguna. Hal yang dilakukan pada tahapan ini yaitu :
- Mencoba alur dari program Send Your Waste dari awal sampai selesai, pada saat mencoba alur ini kami diberikan akses beta agar seluruh proses tersebut tidak masuk ke sistem.
- Menggali informasi berdasarkan seluruh sosial media Waste4Change
- Mencari permasalahan lain berdasarkan komentar yang ada pada sosial media
2 — Define
Define adalah tahapan mendefinisikan permasalahan user berdasarkan hasil Empathise.
Pain Point
Pain Point yang kami dapatkan adalah sebagai berikut.
How Might We.
berdasarkan paint point, kami mendapatkan ide untuk memecahkan permasalahan tersebut. lalu kami menuliskannya dan melakukan voting untuk solusi yang disukai. Hasilnya dapat dilihat dibawah ini.
3 — Ideate
Ideate adalah tahapan dilakukannya proses brainstorming berdasarkan hasil define sebelumnya, ide solusi yang akan diberikan, dan membuat rancangan desain sederhana dengan menggunakan metode Crazy-8’s.
Untuk tahapan ini diawali dengan mencari solution idea berdasarkan hasil how might we.
setelah itu, kami mengelelompokkan ide — ide kami menggunakan afinity diagram, dan memperoleh hasil sebagai berikut.
Pengelompokkan Ide — ide didapatkan 7kelompok yaitu
- Penambahan tutorial
- memperbaiki tampilan
- memperbaiki alur
- memperbaiki struktural informasi
- menambahkkan informasi edukasi
- menambahkan sistem gamifikasi
- ide lain yaitu penambahan forum dan live chat
Setelah itu, kami mendiskusikan nilai prioritas pada ide yang telah kami susun, untuk hasil dari priorization idea dapat dilihat dibawah ini.
lalu, kami merancang desain sederhana berdasarkan ide yang di prioritaskan.
4 — Prototyping
Prototyping adalah tahapan pembuatan user flow, wireframe, Interface berdasarkan user flow tersebut, dan prototypenya.
Userflow
Terdapat 7 userflow yang dibuat, yaitu :
- Proses Login-Register
- Membaca Artikel
- Membuka Tutorial
- Ke halaman Forum
- Claim Reward
- Alur SYW Reguler
- Alur SYW Point (Recycle Me / Love Avoskin Love Earth)
Berikut adalah keseluruhan userflow tersebut.
Proses Login-Register
Membaca Artikel
Membuka Tutorial
Ke halaman Forum
Claim Reward
Alur SYW Reguler
Alur SYW Point (Recycle Me / Love Avoskin Love Earth)
Wireframe
Setelah seluruh userflow selesai, kami melanjutkan membuat wireframe berdasarkan keseluruhan userflow yang ada. Berikut adalah wireframe yang telah dibuat.
Design System
Sebelum membuat keseluruhan desain, saya membuat UI Styleguide agar dapat mempermudah pada saat melakukan desain. Berikut adalah seluruh Design system yang telah dibuat.
Logo
Color Style
Font Style
Icon Style
Text Field
Button
Option List
Bar
UI Design
kami membuat UI berdasarkan userflow yang telah dibuat sebelumnya.
Prototype
Setelah keseluruhan UI telah dibuat, maka langkah selanjutnya membuat prototypenya. Prototype dibuat agar terdapat gambaran apabila UI telah diterapkan. Berikut adalah prototype yang telah dibuat.
5 — Testing
Testing adalah tahapan untuk menguji seluruh prototyping sesuai dengan flow nya, dengan adanya proses testing kami dapat menemukan kekurangan dan saran (tambahan) pada aplikasi yang sedang dirancang.
Research Objective
- Dapat mengetahui hal — hal yang dibutuhkan pengguna pada aplikasi setor sampah untuk di daur ulang
- Mengetahui tingkat kemudahan & kepuasan pengguna dari solusi desain yang diberikan menggunakan skala Single Ease Question pada task yang diberikan.
Respondent Criteria
- Berusia 25–40 tahun
- Wanita
- Ibu Rumah Tangga
- Berdomisili di pulau Jawa
Setelah mendapatkan responden, kami menanyakan pertanyaan seputar pengelolaan sampah yang berkaitan dengan testing, untuk list pertanyaannya adalah sebagai berikut.
List of Questions
- Perkenalkan diri responden ? Nama, Pekerjaan, dan Usia.
- Apakah responden sering terganggu dengan sampah disekitar ? Jika iya, jenis sampah apa yang sering responden jumpai ? Jika tidak, mengapa ?
- Apakah menurut responden daur ulang sampah itu penting ? Jika iya, pernahkah melakukan proses daur ulang sampah ? Jika tidak, mengapa ?
- Apa kendala dalam melakukan proses daur ulang sampah ?
- Apakah menurut responden dengan adanya layanan daur ulang sampah itu penting ? Jika iya, layanan seperti apa yang responden inginkan ? Jika tidak, mengapa ?
- Apabila dibuatkan sebuah aplikasi berbasis mobile untuk melayani responden dalam mendaur ulang sampah, fitur seperti apa yang responden inginkan di dalam aplikasi tersebut ?
Setelah itu, saya meminta memulai testingnya, terdapat 6 task yang harus dicoba oleh responden yaitu,
- Proses Login-Register
- Membaca Artikel
- Membuka Tutorial
- Ke halaman Forum
- Alur SYW Reguler
- Alur SYW Point (Recycle Me / Love Avoskin Love Earth)
- Claim Reward
Tiap task responden ditanyakan mengenai kendala dan kenyamanan pada saat menjalankan prosesnya.
Keseluruhan proses interview dengan responden berjalan dengan lancar, responden tidak mengalami kesulitan dalam menjalankan prototype.
Pada saat melakukan interview, kami mendapatkan poin poin penting mengenai rancangan yang telah dibuat yaitu.
- Ukuran font pada beberapa teks kurang besar
- Tampilan forum kurang menarik
- responden merasa alur SYW terlalu rumit meskipun sudah jelas.
Setelah menjalankan seluruh Task, kami menanyakan skor SEQ berdasarkan keseluruhan task tersebut.
Single ease question adalah Post Task Questionnaire, sebuah kuesioner yang digunakan dalam mengukur tingkat kemudahan pada suatu fitur produk berdasarkan pengalaman user saat melakukan sebuah task dengan menggunakan satu pertanyaan saja. Pilihan jawaban merupakan skala 1–7.
Skor SEQ yang kami dapatkan dari responden adalah 6/7 sehingga dapat diartikan Passed.
Kesimpulan
Berdasarkan keseluruhan tahapan dan hasil testing pada prototype yang memenuhi kebutuhan pengguna, maka desain yang telah kami rancang sudah sesuai dan layak, namun masih diperlukan beberapa perbaikan berdasarkan saran atau keluhan dari responden pada saat proses testing berlangsung.
Rekomendasi Selanjutnya
- Memperbaiki seluruh kesalahan yang ada pada UI Design dan Prototype berdasarkan proses testing berlangsung.
- Menambah responden pada saat testing agar saran dan masukan menjadi lebih beragam lagi.
- Pengimplementasian rancangan yang sudah dibuat pada Waste4Change.
Penutup
Sekian Case Study dari saya, hasil yang telah kami buat sudah sesuai dengan penggunaan namun masih terdapat kekurangan. Oleh karena itu saya akan terus belajar dan mencari referensi, dan logika lebih lanjut untuk meningkatkan kreativitas terutama pada bidang desain.
Terimakasih telah meluangkan waktu untuk membaca keseluruhan Case study yang telah dibuat, jangan lupa kunjungi LinkedIn saya. ^^