Mobile app
Kiwi
A solution to help users quickly identify recyclable beauty packaging components, saving time and encouraging sustainable habits.
My role
Research
Ideate
Design
Prototyping
User testing
Project Brief: Many beauty consumers are concerned about the environment and want to recycle their product packaging. However, they lose their motivation since it's time-consuming and difficult to identify where each component of a packing belongs.
Project Result: KIWI – An elegant app with user-centered features that make recycling beauty product packaging less confusing and save consumers time so that they can continue to protect the environment.
Timeline: 3 months
Tools: Figma, Maze, Google Suite
Deliverables: Persona, Competitive Analysis, Affinity Mapping, Site-map, User-flow, Sketches, Wireframes, High-fidelity Design, Prototype, Design System, App logo, App store Screenshot
App showcase with 3 main features
Time saving & Confusion reduction
Revolutionize recycling with a sleek barcode scanner and tailored product recycling instructions, enhancing user efficiency and providing recycling clarification.
Convenience
Provide users with the ultimate convenience in finding nearby recycling facilities with recycling locator features.
Incentive
Encourage continued recycling commitment by rewarding users with an incentive (exclusive promo code) after each recycling session.
Process
Interested? Keep scrolling for in-depth design process
Discover
Initial problem discovery
What is the problem?
There’s a disconnection between what people say and their actions when it comes to recycling.
Only 9% of 120 billion units of personal care/beauty packaging get recycled. Research has found that 94% of Americans support recycling and 74% say it should be a top priority. But only about 35%(or 1 in 3) of people actually recycle.
Initial Research
Why is there a disconnection?
To understand what actually caused the disproportion, I conducted initial quantitative research by sending out a Google form survey to 21 people, and the reasons came down to:
Confusion: people don’t know how to recycle, what components can be recycled, or what to do with it
Inconvenience
It’s time-consuming
6 people
5 people
4 people
*4 others said they recycled properly, 2 didn’t give an answer
Problem Statement
Lack of instruction, resources and time make it difficult for beauty consumers to know how to recycle packaging properly.
Why does this matter?
This confusion leads to frustration, recycling mistakes which defeat sustainability goals and result in recyclable plastic being thrown away.
Define
Understand My Target Audience
Who are they?
Based on my survey performed earlier, I was able to collect data on my audience – the potential users.
Genders: all (women take a higher percentage due to their higher need for beauty/personal products)
Age: 15-45
Location: in the US, bigger cities
Experience: tech-savvy, frustrated when not knowing how to recycle effectively
Value: time, convenience, environmental, global issues
Secondary Research Methods & Takeaways
What methods of UX research that I’m using to find out the solution, and why?
UX RESEARCH METHOD 1: USER PERSONA
To solve problems for users and create user-focused designs, I need to empathize with them by understanding their pain points and aspirations.
This persona was made based on data collected from my initial research, making sure user’s pain points and aspiration are relevant.
UX RESEARCH METHOD 2: COMPETITIVE ANALYSIS
Analyzed the current market, what works, and what doesn’t
This step helps me explore if there’s anything like this app out there, understand what existing features are working, and what my app can utilize and improve upon.
These listed apps are not working because:
Figuring out the product still requires manual typing, which takes a long time(Recycle coach-most left)
Not providing people specific instruction on how to recycle each component (Bower-center)
Not having features to encourage continuous app usage(iRecycle-most right)
What are my takeaways?
#1 People struggle with identifying what components of their beauty product packaging are recyclable
#2 People don’t have time to figure out which components are recyclable
#3 People find it inconvenient to find recycling facilities.
#4 People struggle to stay motivated to create sustainable habits
From my research, the initial hypotheses were the following:
If we provide users with a quick way to identify recyclable components in beauty product packaging and incentives, users would be more likely to recycle with less confusion
How Might We?
“How might we simplify the identification of recyclable components in beauty product packaging to reduce confusion and promote continued recycling?”
Opportunity spaces
(aka how am I going to address the problem in my design)
#1. People struggle with identifying what components of their beauty product packaging are recyclable
➡️ Providing product-specific and actionable instructions on how to recycle packaging components will solve consumers’ major pain points of not knowing how to recycle.
#2. People don’t have time to figure out which components are recyclable
➡️ Incorporating the barcode scanner feature will save consumers time trying to identify the product.
#3. People find it inconvenient to find recycling facilities.
➡️ Adding recycling facility locator feature will help consumers find recycling locations more easily.
#4. People struggle to stay motivated to create sustainable habits
➡️ Offering incentives(money, badges, or monthly mission) feature will motivate consumers and promote more sustainable engagement with the app.
Develop
Solution
With potential features above, I created a site map that would help me visualize the app structure.
user flow & sketches
This enabled me to plan and communicate the layout, hierarchy, and relationships between different screens within my recycling app. Please note that the sitemap was subject to change as the project progresses.
When creating user flow, I focused on the sequence of steps that users need to perform to get recycling instructions, making sure that it’s straightforward.
wireframes
User testing on low-fi wireframes
Usability testing to pinpoint any usability issues that users experience while using the app before applying the design system on Maze.com
Improvement #1
From user testing feedback, most users struggle to figure out how to copy the code because the copy text was too small and hard to see. So, the copy is put into a button.
Improvement #2
From the heat map in my user testing, the bottle on the top was too big and it distracted people from the recycling instruction, and the button for the next step. So, the bottle size is reduced.
Improvement #3
According to material.io for choosing button, the primary button on a screen should be a filled button, outline button can be used for actions that need attention but aren’t the primary action, such as “See all” or “Add to cart”. So, I changed “Add to basket” to an outline button.
The color green was chosen as the main color because it is strongly associated with nature, sustainability, and the environment. The UI style is clean and simple for users to focus and perform their tasks effectively.
Design system
1. Barcode scanner & product-specific instruction features help save users time and make recycling less confusing.
2. Recycling facility locator feature makes finding recycling facilities more convenient.
3. Coupons features keep users motivated.
Even small elements have a drastic impact on the user experience and the end result.
User testing is critical for ensuring usability and identifying areas for improvement.
Reflection