UX Case Study — Redesign Waste4Change Program Send Your Waste

Faradilah Putri Damayanti
9 min readSep 28, 2022

--

Disclaimer!📢

Hasil yang akan ditampilkan merupakan final project dari program Skilvul DTS PROA UI/UX Design Batch 3–2022 dengan Waste4Change sebagai Challenge Partner. Saya tidak bekerja atau terikat dengan pihak-pihak yang terlibat dalam pelatihan ini.

🔍Latar Belakang

Waste4Change adalah layanan pengelolaan sampah bertanggung jawab dengan visi untuk mengurangi sampah yang dihasilkan di tempat pembuangan akhir. Berdiri sejak tahun 2014 dan sudah memiliki banyak pengalaman dalam memberikan pelayanan pengelolaan sampah. Waste4Change memberikan layanan untuk perusahaan, usaha kecil, hingga tempat tinggal pribadi.

Salah satu program pada Waste4Change yaitu Send Your Waste (SYW). SYW merupakan program sukarela yang menargetkan ibu rumah tangga agar mereka dapat mengola sampah secara bertanggung jawab dengan memilah dan membersihkannya terlebih dahulu sebelum dikirimkan. Terdapat pilihan layanan yang dapat dipilih dan disesuaikan oleh pengguna yaitu Layanan Reguler dan Layanan Sponsor.

Namun, terdapat beberapa permasalahan yang dialami pengguna Waste4Change yaitu adanya miskomunikasi pada flow dan ketidaksesuaian copywritting pada web app tersebut. Berdasarkan masalah yang ada, kami memilih untuk melakukan beberapa perbaikan pada web app Waste4Change untuk mempermudah user dalam menggunakannya.

🎯Objektif

Berdasarkan latar belakang yang telah ada, objektif yang dapat diambil adalah bagaimana pengguna dapat mengerti berbagai program yang ditawarkan oleh Waste4Change dengan memberikan tampilan yang mudah dipahami, memperbarui flow, dan menyesuaikan penggunaan copywrtitting pada web app Waste4Change.

👩🏻‍💼Peran Dalam Tim

Final projek ini saya kerjakan bersama teman A19-kelompok 6 yang terdiri dari 5 anggota tim dan 1 mentor. Pembagian role untuk masing-masing adalah sebagai berikut:
1. Michael Halomoan Sihombing = Mentor
2. Faradilah Putri Damayanti = UI Designer
3. Aridiyon D. Haidar = UI Designer
4. Maya Dwi Wijayanti = UX Designer
5. Laurencia C = UX Designer
6. Ilmi Rasyidah Firdaus = UX Researcher

Tanggungjawab saya sebagai UI Designer dalam kelompok ini adalah memastikan desain UI telah sesuai dengan wireframe dan menggunakan style guide yang telah dibuat sebelumnya, memberikan saran mengenai aturan-aturan dalam membuat UI, dan ikut serta dalam seluruh proses pembuatan final projek ini.

📌Design Process

Source: https://uxplanet.org/what-is-design-thinking-c3a58e2e34d5

Design process adalah suatu proses iterasi yang dilakukan designer untuk memperoleh desain yang paling sesuai dengan apa yang dibutuhkan user sebelum selanjutnya diberikan kepada developer. Salah satu design process yang banyak digunakan dan kami gunakan dalam final rojek ini adalah Design Thinking. Design thinking sendiri merupakan metode yang menjadikan pengguna sebagai fokus utama. Masalah yang dihadapi pengguna itulah yang menjadi prioritas designer dalam menciptakan sebuah solusi. Tak lupa, design thinking bukan hanya menciptakan solusi design, melainkan bertujuan untuk mengintegrasikan kebutuhan pengguna dengan teknologi demi keberhasilan proses bisnis. Terdapat 5 tahap dalam proses design thinking adalah sebagai berikut:

1️⃣ Empathize

Photo by Christina @ wocintechchat.com on Unsplash

Empathize merupakan langkah pertama yang dilakukan untuk memperoleh perspektif pengguna. Dengan mendapatkan perspektif itulah, kita dapat mengerti keadaan emosianalnya dan berusaha memberikan solusi atas permasalahan mereka. Tahap empathize untuk final projek ini, kami menggunakan Secondary Research. Secondary research adalah salah satu metode riset dengan menggabungkan data yang diperoleh dari berbagai sumber. Baik sumber internal perusahaan maupun eksternal seperti statistik pemerintahan, badan organisasi, melakukan kompetitor analisis, jurnal, feedback pengguna, dan internet.

Source: https://docs.google.com/spreadsheets/d/1omssYgO3SCY2ZFflftFS3rqRuVhQ4dPf-dFi5Mjfy3k/edit?usp=sharing

2️⃣ Define

Photo by Brands&People on Unsplash

Define merupakan langkah untuk memecahkan masalah yang dihadapi pengguna berdasarkan keresahan-keresahan mereka. Pada tahap define, semua anggota kelompok membuat pain point yang dirasakan user berdasarkan hasil empathize. Setelah diperoleh cukup pain point, dilakukan pengelompokkan untuk selanjutnya dilakukan voting guna memilih How Might We (HMW). Masing-masing dari kami diberikan 3 stamp untuk memilih pain point yang akan dijadikan HMW. HMW yang terpilih, nantinya akan dilanjutkan ke proses ideation.

Pain Points 🔑

Berdasarkan hasil empathize yang berasal dari berbagai sumber, kelompok kami berhasil memperoleh 24 pain points yang menjadi keresahan pengguna.

How Might We (HMW) 🔑

Seluruh pain points pada tahap HMW ini akan dikelompokkan berdasarkan poin-poin yang memiliki kesesuaian. Setelah dirasa telah pas dalam pengelompokannya, dilakukan voting untuk memilih poin yang dirasa menjadi prioritas kesulitas pengguna. Hasil penentuan HMW untuk final projek kami ada 2, karena kedua poin tersebut memiliki jumlah stamp yang sama. HMW tersebut adalah “Bagaimana memberikan tampilan yang mudah dipahami user dan bagaimana cara memotivasi user”.

3️⃣ Ideate

Photo by Christina @ wocintechchat.com on Unsplash

Ideate merupakan langkah untuk memberikan ide sebanyak-banyaknya, sekreatif dan seunik mungkin. Semakin kreatif ide yang diberikan, bisa jadi merupakan solusi yang paling efektif. Setelah pada langkah sebelumnya memperoleh HMW yang disepakati, kemudian masing-masing dari kita membuat ide solusi. Ide solusi yang telah terkumpul, kemudian dikelompokkan pada langkah Affinity Diagram. Kemudian dilanjutkan dengan langkah terakhir pada proses ideate ini adalah menentukan Prioritization Idea, dimana pengelompokkan ide solusi tersebut dibagi dalam 4 kuadran (Do Now, Do Next, Do Later, Do Last).

Solution Idea🔑

Berdasarkan HMW yang telah ditentukan, kelompok kami berhasil memperoleh 28 solution idea.

Affinity Diagram🔑

Seluruh solution idea selanjutnya dikelompokkan berdasarkan poin-poin yang memiliki kesesuaian. Kami memperoleh 8 pengelompokkan yang terdiri dari ranking, fitur point, visual, informasi pengiriman sampah, voucher, notifikasi, mempermudah flow, dan how to.

Prioritization Idea🔑

Dalam langkah prioritizing idea, pengelompokan tersebut dibagi kedalam 4 kuadran yaitu Do Now, Do Next, Do Later, Do Last. Do now meliputi kelompok visual, fitur point, notifikasi, dan mempermudah flow. Do next meliputi kelompok ranking dan informasi pengiriman sampah. Do later meliputi kelompok voucher. Sedangkan do last meliputi kelompok how to.

4️⃣ Prototyping

Photo by Alvaro Reyes on Unsplash

Prototyping merupakan langkah untuk merealisasikan ide yang telah diperoleh mulai dari flow yang akan terjadi hingga tampilan aplikasi ketika nantinya di develop. Pada langkah ini dilakukan pembuatan user flow dari masing-masing alur dalam aplikasi, wireframe, UI style guide untuk konsistensi hasil desain, UI style aplikasi berdasarkan wireframe yang telah dibuat, dan prototyping dari hasil UI untuk pengguna coba.

Link Prototype ada disini 📢

User Flow🔑

User flow adalah langkah-langkah yang dilakukan pengguna untuk mencapai suatu tujuan pada fitur tertentu. Pada final projek ini, kita membuat user flow menggunakan FigJam dan membagi 4 flow utama yang biasa dilakukan user.

Wireframe🔑

Wireframe adalah sketsa kerangka untuk mengatur posisi tata letak komponen pada aplikasi yang akan dibuat. Sehingga dengan adanya sketsa, stakeholder dapat menyetujui letak-letak informasi yang akan ditampilkan sebelum masuk ke tahap pembuatan UI. Kami menggunakan Figma dalam pembuatan wireframe ini.

UI Style Guide🔑

UI Style Guide adalah kumpulan elemen yang akan digunakan pada proses pembuatan UI. Tujuan pembuatan style guide ini adalah agar tampilan aplikasi yang dibuat dapat konsisten baik dari segi warna maupun ukuran. Kami membuat beberapa style guide untuk final projek ini seperti warna, tipografi, general (status bar), tab, radio/checkbox, toggle, bottom tab, header, button, dan input field.

UI Design🔑

Setelah proses pembuatan style guide, langkah selanjutnya adalah pembuatan UI Design. UI Design adalah penerapan style guide ke dalam wireframe yang telah dibuat. Pembuatan UI ini diusahakan selengkap mungkin seperti tampilan respon ketika pengguna mengklik sesuatu agar dapat digunakan ke langkah selanjutnya, yaitu prototyping sebagai bagian dari Usability Testing.

5️⃣ Testing

Photo by Timothy Hales Bennett on Unsplash

Testing adalah tahap pengujian terhadap desain aplikasi yang telah dibuat untuk memperoleh feedback dari pengguna. Pada tahap testing ini, kami memilih menggunakan metode In-Depth Interview. Sebelum melakukan testing, kami terlebih dahulu mempersiapkan stimulus research yang akan digunakan sebagai panduan ketika melaksanakan interview. Interview dilakukan secara online menggunakan zoom dan direkam, moderator dan responden menyalakan kamera guna mengetahui ekspresi responden ketika mencoba aplikasi, dan mengharuskan responden untuk sharescreen prototype yang dijalankan melalui handphone.

Research Date🔑

Interview dilakukan pada hari Minggu, 18 September 2022 pada pukul 20:00 WIB. Interview berlangsung selama 32:57 menit.

Research Objective🔑

  1. Apakah user dapat memahami program layanan Berhadian (SYW Berhadiah) yang tersedia pada aplikasi?
  2. Apakah user dapat melakukan proses redeem point pada aplikasi?

Respondent Criteria🔑

  1. Wanita
  2. Berusia 25–40 Tahun
  3. Pekerjaan sebagai karyawati/ ibu rumah tangga
  4. Domisili jawa
  5. Pernah menggunakan web app Waste4Change

List Of Questions🔑

  1. Bagaimana pengalaman dalam membuang sampah?
  2. Apakah pernah menggunakan aplikasi layanan pembuangan sampah daur ulang?
  3. Jika pernah, aplikasi apa yang anda gunakan?
  4. Bagaimana pengalaman anda ketika menggunakan aplikasi tersebut?
  5. Apa saja yang anda suka dan tidak suka dari aplikasi tersebut?

User Expectations and Impressions Questions🔑

  1. Apa kesan (pertama) Anda terhadap produk ini?
  2. Apa yang Anda pikirkan setelah menggunakan produk ini?
  3. Apa yang menghalangi Anda untuk menggunakan produk ini?
  4. Apakah anda memiliki masukan untuk produk ini?

Research Scenario🔑

Source: https://docs.google.com/document/d/18TDvjgFjwF8TD0m1TlsDbNoxtsYyGHSJNW2uLnaABfU/edit?usp=sharing dan https://docs.google.com/spreadsheets/d/1omssYgO3SCY2ZFflftFS3rqRuVhQ4dPf-dFi5Mjfy3k/edit?usp=sharing

Result🔑

Berdasarkan hasil interview yang dilakukan, kami menggunakan Single Ease Question (SEQ) sebagai tolak ukur kemudahan aplikasi. Poin untuk single ease question berada pada range antara 1 hingga 7 dan pengguna memberikan poin 7 terhadap prototype yang telah dicoba. Hal tersebut menunjukkan bahwa solusi desain yang ditampilkan memiliki flow yang mudah untuk digunakan.

Feedback🔑

  1. Untuk flow penambahan jenis sampah diberi perbaikan tampilan atau mungkin bisa diberi confirmation untuk menginfokan user bahwa dia bisa menambahkan jenis sampah lain.
  2. Menambahkan suggestion semacam chip untuk menunjukkan jumlah poin yang dimiliki.
  3. Menambahkan confirmation ketika melakukan redeem poin.

📃Kesimpulan

Berdasarkan semua yang telah dijelaskan diatas, dapat diambil kesimpulan bahwa latar belakang yang telah disebutkan dan solusi yang telah kita berikan telah sesuai dan memudahkan pengguna dalam menggunakan aplikasi dengan poin SEQ yang diperoleh adalah 7.

🥇Rekomendasi

Program Skilvul DTS PROA UI/UX Design Batch 3–2022 ini menurut saya memiliki materi yang sangat mudah dipahami terutama bagi pemula. Materi yang diberikan juga benar-benar mulai dari dasar hingga kita bisa melakukan Usability Testing kepada real responden. Sehingga saya sangat menyarankan bagi pemula untuk mengikuti program ini di batch-batch selanjutnya.

Waste4Change sebagai challenge partner pada program ini juga cukup menantang untuk memecahkan case study yang diberikan. Sehingga hal tersebut cocok bagi orang-orang yang ingin mengasah kemampuannya dalam research.

Kami juga berharap solusi design yang telah kami buat dapat bermanfaat bagi seluruh pihak baik penyelenggara program, challenge partner, maupun yang membaca artikel ini. Semoga kedepannya bagi mentee yang mengambil challenge partner apapun dapat memberikan solusi yang out of the box untuk kemudahan pengguna.

Saya pribadi mengucapkan terimakasih banyak kepada Digital Talent Schoolarship (DTS), KOMINFO, Skilvul, dan Waste4Change yang telah memberikan kesempatan untuk belajar dan mengembangkan minat kami pada bidang UI/UX. Saya juga mengucapkan terimakasih kepada kakak mentor Michael Halomoan Sihombing yang telah memberikan waktu dan ilmunya selama kurang lebih 2 bulan kepada kita. Dan tak lupa saya berterimakasih kepada teman A19-Kelompok 6 yang mau belajar dan berproses bersama dalam pelatihan ini hingga akhir. Semangat untuk siapapun yang membaca artikel ini, semangat untuk meneruskan minat pada bidang UI/UX baik untuk tujuan pekerjaan atau hanya sekedar menambah skill, dan semoga segera mendapat email “SELAMAT”, “WELCOME”, atau apapun itu dari perusahaan impian yaa! ❤🤗❤

--

--

No responses yet