Reducing contamination and waste one photo at a time.
EcoSort is a mobile app designed to help San Francisco residents properly sort their waste and reduce contamination. Using image recognition technology, the app identifies items and provides clear disposal instructions based on the city’s recycling, composting, and trash guidelines. By promoting accurate waste sorting, EcoSort aims to minimize landfill contribution and support San Francisco’s Zero Waste goals.
My Role
UX/UI Designer & Researcher
Deliverables
literature review, expert interviews, user research and testing, prototypes
Read Time
10 minutes
The Problem
01
Sorting to Zero Waste
Your 'waste'—better described as 'resources'—never leaves the planet. So, where does it all go? Typically, it ends up in a landfill or municipal waste center, where it is either burned or buried, releasing greenhouse gases and contaminating nearby communities. Thanks to alternative waste streams like recycling and composting, we’ve significantly reduced what reaches the landfill.
San Francisco has been a leader in the Zero Waste initiative, diverting 80% of its waste from landfills through mandatory ordinances. However, the chain of resource disposal starts with you. How do you know what goes where?
EcoSort uses AI-powered image recognition to help users properly sort their waste. By combining intuitive guidance with insightful feedback, the app empowers people to compost and recycle more, while encouraging them to rethink their consumption habits.
Photo Credits -https://www.sfenvironment.org/zero-waste-faqs
Literature Review
02
Building Blocks of EcoSort
Waste Management
“Contamination in recycling streams continues to undermine diversion efforts, making it imperative to address these gaps through ongoing public education and stricter compliance measures”
Achieving Zero Waste in San Francisco: Successes and Challenges - Michael Sangiacomo
AI Image Recognition
“AI systems can detect contamination with a level of accuracy comparable to human experts”
ContamiNet: Detecting Contamination in Municipal Solid Waste - Ibrahim Khoury, et al.
UX/UI Design
“Visual progress tracking, such as showing reductions in waste or carbon footprint, instills accountability and motivates users to continue their positive behaviors”
Persuasive Mobile Apps for Sustainable Waste Management: A Systematic Review - Banuchitra Suruliraj, et al.
Expert Interviews
03
Insights from the Experts
Maria Casey
Director of Business Development at Reuseo LLC
“Education only goes so far—when it’s time to toss something, the decision happens in a second.”
Jessica Narvios
SF Environmental Department Residential Zero Waste Associate
“We all share a responsibility in preserving this planet. It is important that we take proactive steps now to ensure sustainability for future generations.”
Omar Sosa-Tzec
Associate Professor of Visual Communication Design at SFSU
“Experiences involving delightful design entail joy combined with remarkable moments of unexpectedness, immersion, and aesthetic appraisal.”
User Research
04
Designed for the User, Informed by the User
To better understand user behavior and attitudes, I conducted 35 anonymous surveys to assess people’s familiarity with recycling and composting.
Additionally, I interviewed 5 individuals to explore their feelings toward waste management in San Francisco and gauge the desirability of a tool like EcoSort.
What frustrations (if any) do you face with recycling and composting?
Where does this dirty pizza box belong? (correct answer: compost)
"It’s frustrating to see so many people just toss everything in the trash — it feels like they either don’t know or just don’t care."
-Anonymous
"I know recycling and composting are important, but sometimes it feels like my small efforts don’t really make a difference."
-Anonymous
Mapping
05
Organizing Insights into Action
Empathy Mapping
User Journey
User Flow
Competitive Analysis
06
Learning From What’s Out There
Through my analysis of existing apps, I examined their branding, key features beyond image recognition, and the strategies they used to motivate continued user engagement.
Most focus solely on recycling and are restricted to specific regions due to varying city regulations. This lack of coverage creates a gap in accessibility and effectiveness, highlighting the need for a solution tailored to San Francisco.
Many apps also relied on monetary rewards that ultimately cycled back into consumerism—an approach I intentionally avoided, as EcoSort is designed to reduce waste, not promote further consumption.
DeepWaste AI Home Screen
EcoScan Home Screen
Wireframe Sketches
07
Ideating Key Features and Flows
Ideation focused on providing clarity on users' impact in recycling and composting, as well as finding ways to motivate people to care about the issue, based on survey results and research.
Iteration
08
Mid-Fi Wireframes
Refining the Experience
Through user testing, the wireframes were refined to boost engagement and encourage continued app usage.
The home page was updated with weekly goals, progression levels, and visuals of recently redeemed rewards, motivating users by tracking their impact and reinforcing positive habits.
This led to the creation of the Education page, where both in-depth and digestible information informs users about Zero Waste principles and better disposal habits. It also introduced a gamified element, knowledge levels, rewarding users for expanding their understanding.
Design System
09
Typography
Color Palette
The color palette reflects earthy tones inspired by recycling and composting, with greens symbolizing sustainability and yellow and blue as secondary accents for energy and balance. The mascot and illustrations extend this palette with complementary tints for added character.
Hex: #015002
RGB: 1, 80, 2
Hex: #57AE09
RGB: 87, 174, 9
Hex: #BCD829
RGB: 188, 216, 41
Hex: #0A0908
RGB: 10, 9, 8
Hex: #FFFCF2
RGB: 255, 252, 242
Hex: #BCD829
RGB: 188, 216, 41
Hex: #2D6AF5
RGB: 45, 106, 245
Hex: #90CAF9
RGB: 144, 202, 249
Hex: #FFD900
RGB: 255, 217, 0
Logo
Mascot & Illustrations
The mascot, a friendly seagull, appears throughout the app to reinforce positive achievements and add a touch of delight to the user experience.
Illustrations are inspired by Edward Tapia’s Go Green, with additional custom artwork in a matching style to maintain visual consistency.
User Testing
10
Putting EcoSort to the Test
Final testing included 5 participants from the original interviews, all of whom expressed excitement and enthusiasm about the design. The process combined the “think-aloud” protocol, encouraging participants to verbalize their thoughts, with “fly-on-the-wall” observation to capture natural user behaviors during interaction.
User 1
"The visual identity of the app is what really kept me interested — it felt refreshing and different from other apps I’ve used."
User 2
"I love the environmental impact tracking — seeing the difference I’m making motivates me to keep using the app."
User 3
"The education page is so cool! I learned things I didn’t know before, and I’m definitely going to start implementing them."
Final Design Solution & Prototype
11
Highlights
Inspiring Everyday Sustainability
The home page welcomes users with a motivating message and clear progress tracking. It highlights weekly recycling and composting goals, making sustainable habits feel achievable. The seagull mascot celebrates milestones, while recently redeemed rewards offer fun incentives, turning eco-conscious choices into lasting habits.
Tracking Your Eco Impact
The profile page provides users with a personalized overview of their waste reduction journey. It displays their landfill diversion percentage, collection day reminders, and a detailed breakdown of their recycling, composting, and trash habits.
By visualizing their impact, users stay motivated and mindful of their waste habits.
Motivating Green Habits
The rewards page incentivizes sustainable behavior by offering real-world benefits.
To align with the app’s mission of reducing waste, the rewards focus on experiential activities rather than physical or monetary perks—deflecting from consumerist habits. Users can redeem points for discounts at local San Francisco attractions, encouraging consistent app engagement while promoting eco-friendly lifestyles.
Empowering Through Knowledge
The education page empowers users with valuable insights into waste reduction and proper disposal practices.
It features knowledge levels that gamify learning, rewarding users for expanding their environmental awareness.
With background information on the Zero Waste Initiative and practical tips for reducing waste, the page encourages users to make more informed and sustainable choices.