Send Your Waste From Home | Waste4Change Web-App: UI/UX Case Study

Nadya Cahyaningsih
5 min readMay 23, 2022

--

Duration: 4 months (03/2022 -06 /2022) | Waste4Change released on 2018

⚠ Disclaimer

I’m not hired or have professionally contracted with Waste4Change, This project is purely a part of UI/UX Design Bootcamp, a collaboration between the Indonesian Ministry of Communication and Technology and Skilvul.com with them as The Challenge Partner.

Introduction

This year, I got a great opportunity from Digital Talent Professional Academy after being selected to join one of their classes. For this class, they partnered up with Skilvul as the learning platform. In this platform we can choose real projects from Their Challenge Partner, Waste4Change is one of them. Because I have another mission too, that not only helps them solve some interface problems, but I also want to make everyone can sort or send their waste to a proper place so their waste can be recycled to reduce waste, and I hope our ideas can get through/released so it will be helping a lot of people.

Who Is Waste4Change?

Waste4Change is a start-up that focuses on recyclable waste so it will reduce waste in the final waste place. Until now they already

In 2018, they released the Send Your Waste program. In This program, people can send their waste to their recycle house from home. And this program is what our team focused on. Now let’s get dive into it^^

Goals

  • Making login system easier and faster, so users can enter the app to process their needs faster and make things more for them and Create more a easier flow for users to join some campaign and they can send their waste
  • Re-designing redeem page structure to become easier for them to redeem their points and choose what rewards they want to redeem.

Role in Team

This is a team project. Teammates have already decided from the first day of Bootcamp. I am working on this project with M Kuncoro dan Yanuar Baidowi Together, we collaborated to make better User flow for helping users to send their waste to a proper place. Our Role is also the same, as UI/UX Designer. Our Jobs consist,

  1. Conduct Secondary Research
  2. Construct User Flows, Information Architecture, and UX Writing
  3. Create Design Systems
  4. Design UI (Crazy 8’s, Wireframe, Hi-Fi, Prototype)
  5. Conduct Usability Testing

Design Process

So, For working with this project, we are using Design Thinking as our design process base.

01. User Research

Our research begins with Secondary Research. So for the first step, we need to Analyze The competitors, Find the weakness via low-rated reviews on their social media (Instagram), because they don’t have an app yet, so to find it we need to get through some comments on Instagram and some reviews on google maps. We also review Challenge Partner Interviews. You can check the Documentation here

02. Ideate

At this step, we are combining so many ideas on how to solve the problems. We try to grasp what makes the users feel confused. To do it, we are doing a few things like Collecting our ideas, grouping them into some categories, then we choose what kind of idea we should execute first.

03. Prototyping

After doing so much big brain time to solve the problems, we are doing a quick sketch of how our apps will gonna be,

After we vote some of our screen sketches, we started doing wireframes

release a relieved breath. Now we can do the art works one of my favorite steps when doing UI (since we are doing some design hehe). I also documented my UX Writing, which you can access here,

04. Testing

This is the part that I think is the most crucial for designing UI. Of course, it’s whether our design is useful for the users or not hehe. For this part, we are fortunate enough to interview 3 users (even though it’s on the last-minute call, but we got it!! yay).

For scoring, since I was an admin for some online classes for women and encountered many many moms there, and I know for being interviewed like this, I already put weights on them, so I only need to set my Likert scale from 1–5. For the documentation, you can view it here

In the end, The results of our design score are 6,5 to 7. So it passed the usability testing score. It means, our design helps and can navigate our respondents easily. But of course, there is still a design iteration^^ and something that we need to change based on our respondents. Let’s go to the next part,

05. Iterations

So after doing some Usability testing, we discover something wrong and make our users confused.

That’s how we do our work. This is the last part. If you read this until the end you sure a curious mind hehe^^ (I’m glad, Yokatta ne)

Reflection

What I learned after doing this project is, Just slightly not responsive/slow can make users feel confused and scared like something went out. I need to be more careful about the interaction and make sure it will not happen again, And always double-check how it’s gonna be present.

Conclusion

I’m really glad I can do this project. Since we have a tight schedule, I hope I can do some designs longer hehe. This is a fun project to work on too^^. The thing that I love when doing research like this is, that we always find new perspectives and it will widen our minds and also help us to sharpen our skills.

--

--

Nadya Cahyaningsih

An Indonesian UI/UX Designer and Graphic Designer for almost a half decade