My EcoBrick Buddy
This case study adheres to the Stanford d.school Design Thinking framework, selected to prioritize verifiable technical outcomes over abstract theory. Every design decision drives a measurable business result.
The Action Gap
I began by seeking to understand the root cause of "Eco-Inaction." Research revealed a paradox: users possess high intent to help the environment, but complex rules and fear of "doing it wrong" cause them to freeze.
"It's not apathy. It's anxiety. The user needs validation, not just information."
The Market Gap
High awareness, low action.
Gamified, but digital only.
Combine Physical Action with Gamified Retention.
The Blue Ocean: Competitors focus on carbon tracking or solitary litter cleanup. MEB creates a niche by combining physical waste reduction with community-driven gamification.
High Intent, High Anxiety
"I spend so much time worrying about the planet. I need a clear way to just do something that actually helps."
Motivation is high, but research confirms that complex recycling rules create cognitive overload. Tini freezes in the face of uncertainty. She needs a "Learn-First" flow to validate her efforts immediately, not another lecture.
The Insight: Tini doesn't need more information, she needs validation. Design must reduce friction and reward action immediately.
Turning "Eco-Guilt" into Data
I applied a "Don't Make Me Think" philosophy. By automating the complex recycling rules, I converted Tini's anxiety into a simple, gamified data loop. Zero friction, instant relief.
Transform emotional stress into quantifiable impact.
Primary User Journey
To cure analysis paralysis, the flow is strictly linear. I removed navigation choices until the user completes their first success metric.
Diverge to Converge
Rapid PrototypingBrainstorming led me to 13 key sketches. I focused on "Yes, And..." thinking to explore as far as possible before converging on the final solution.
View All Sketches →Structure Before Style
Structural DesignI built the Hi-Fidelity wireframes in grayscale first. This forced me to solve layout, spacing, and hierarchy issues without relying on color to guide the eye.
A System Built for Scale
Scalable ArchitectureI prioritized engineering over aesthetics. By leveraging Figma Variables and Boolean logic, I built a system that supports instant theming and strict accessibility compliance without manual repainting.
I enforced strict contrast ratios and touch targets to meet WCAG standards globally.
I built components for iteration. Top-level toggles eliminate layer digging.
Zero manual repainting required. The system operates on Global Color Settings.
Modular Construction
Iteration OneThis was about being testable. I built V1 as a modular puzzle, knowing the layout would be torn apart. Mentor feedback brutally exposed gaps in the engineering logic, leading to a significant rethink of the core architecture.
One of my focuses on this project was to seek direct, actionable feedback that could show design growth. I appreciate every participant who looked at this and said, "it's good but..." It is this kind of push that keeps me interested and inspired.
Testing Outcomes
While motivation was high, 2 out of 5 users failed to locate the "Log Plastic" feature. The floating action button icon resembled a decorative ribbon—a critical hidden affordance.
"I realized the icon on the top right is a plus sign... it didn't occur to me that was the record button."
Evaluation Outcome
We conducted a structural audit against Nielsen's Heuristics and WCAG 2.1 standards. While the gamification logic is sound, specific fidelity issues created barriers.
Badges and "Lifetime Stats" proved to be inclusive motivators across all user demographics tested.
Language aligns with real-world concepts. The "Achievement Shelf" provides clear system status visibility.
- Tap targets on Edit Profile < 44px minimum
- Static images (Stats) not screen-reader friendly
A Unified System
With the timeline extended, I revisited the core components to ensure the visual language progressed alongside the UX. This phase focused on merging Light and Dark modes into a cohesive system and reinforcing the linear journey.
Product Impact
My Ecobrick Buddy End-to-End Product Design
Users weren't apathetic; they were anxious. Complex recycling rules created "Paralysis by Analysis," leading to high intent but low action.
Shifted focus from teaching to rewarding. Built a gamified system that simplified input and validated physical action immediately.
100% of users understood the value prop. A unified design system (WCAG AA) ensures the product scales without technical debt.