ecopantry mockup

EcoPantry: Simplifying Food Conservation with Accessibility in Mind

Designathon Project   15 min read

Designathon

UXathon 2024 by UBC UX Hub

Theme

Sustainable Design: creating an innovative and user-friendly app designs that contribute to a more eco-conscious and sustainable world.

Timeline

8 hours

Team

3 Designers

Tools

Figma, FigJam

A Quick Overview

🤔

Background

50 MILLION tonnes: a glimpse of Canada's food waste challenge
Each year, Canada wastes over 50 million tonnes of food. This colossal figure impacts not just landfills but also 4 million Canadians, including 1.2 million children, who struggle with food insecurity. EcoPantry arises to transform this challenge into an opportunity for change.
💭

Problem

Forgetting what's in the fridge: the cycle of domestic food waste
In many homes, good food turns into waste due to a common oversight: losing track of groceries. This leads to a continuous cycle of over-purchasing and wasting. Despite increasing awareness, there is a significant gap in accessible, sustainable management tools.
💁🏻

Target Audience

Young adults and families saving the planet one meal at a time
EcoPantry is for those who are tired of throwing away food and money. It attracts environmentally and budget-conscious young adults and families eager to adopt a more mindful approach to their food habits.
💡

Goal

Simplifying and making food conservation more accessible
EcoPantry's core mission is to simplify food conservation and make it more accessible through smart pantry management, community engagement, and intuitive meal planning. The app aims to empower users to save food and resources, encouraging a lifestyle that benefits both the planet and personal budgets.

Solution

So we bring to you...

EcoPantry
My Pantry Management
Keep an eye on your pantry effectively
Track your groceries in real-time, receive alerts before items expire, and prevent food from spoiling. Use what you buy and cut down on waste significantly.
Smart Grocery & Recipe Suggestions
Shop and cook smarter, not harder
Enhance your shopping and cooking experiences with machine learning. Generate smart grocery lists tailored to reduce waste and receive custom recipe suggestions based on what’s currently in your pantry.
Rescue and Donate
Share more, waste less
Take part in a communal effort to reduce food waste. Our platform allows you to discover or donate excess food locally, making it simple to help others while contributing to sustainability.
Community Engagement
Connect, share, and learn
Dive into a community of eco-conscious individuals who are passionate about sustainable living. Exchange tips, engage in discussions, and participate in events that promote sustainable cooking practices. Together, we can inspire change and foster a greener future.
Rewards and Achievements
Earn while you save
Get rewarded for your dedication to reducing food waste. Earn points for your sustainable actions and redeem them for discounts and special offers. Our gamified approach makes saving the planet rewarding and fun.

Prototype

Entering EcoPantry...

Interact with the prototype

Design Process • At a Glance

How Did EcoPantry Come to Life?

01 Empathize
• Personal Experience
• User Interviews
02 Define
• User Persona
• Problem Statement
• Hypothesis
• User Journey
03 Ideate
• Competitive Analysis
• Feature Brainstorming
04 Prototype
• Style Guide
• Low Fidelity
• High Fidelity
05 Test
• Feedback
• Key Learnings

Design Process

How Might We Reduce Food Waste and Foster Sustainable Habits?

In the first phase of our design process, we delved deep into the everyday experiences of our users, starting with personal reflections in my own kitchen and extending to broader community engagement.

Starting the Journey with Self-Reflection 💡

From my kitchen to ours: a shared struggle in food conservation
My journey to tackling food waste began in the most familiar place: my own kitchen. Observing my habits, I realized how often I overlooked expired foods and repeatedly purchased items I already had. This sparked crucial conversations with friends and family, uncovering a shared struggle across many households: managing groceries efficiently is harder than it seems.

Learning from Diverse Experiences 🔎

User research questions
We reached out through Instagram polls to connect with a wider audience and learn about their food management habits
• More than half of respondents expressed a preference for categorizing food by type, which they felt streamlined their pantry management.
• The majority admitted to regularly discarding food, highlighting a gap in tracking expiration and consumption.
• Despite efforts to economize through sales, bulk purchases and meal planning, many still faced the paradox of saving at the store but wasting at home.
In the second phase of our design process, we honed in on defining our users' needs by creating detailed personas. This crucial step shaped a focused problem statement and laid the foundation for a hypothesis that would set a clear direction for our design solutions.

Humanizing the Data 🙋🏻

We crafted user personas to understand EcoPantry's user base
In crafting EcoPantry, it was crucial to first understand who we are designing for. This led us to create detailed personas that represent our primary users, ensuring our solutions are finely tuned to their lifestyles and challenges.
Emma: Championing Eco-Friendly Living with Every Meal
Environmental Activist from Toronto, ON
The Eco-Warrior's Daily Battle
At 30, Emma dedicates her life to environmental activism, but managing her kitchen efficiently remains a challenge. Her days are packed, and despite her best efforts, food waste is an inevitable setback in her quest for sustainability.
Goals and Aspirations
Emma is committed to reducing her environmental footprint by minimizing food waste. She looks for a solution that can integrate into her active lifestyle and help her manage groceries more effectively.
Pain Points
Balancing a hectic schedule with her environmental goals often leads to overlooked groceries and regrettable waste. Emma craves a community that shares her passion and offers practical support and ideas for sustainable living.
Emma's EcoPantry Vision
She imagines an app where she can track her pantry items easily, receive timely reminders before foods expire, and connect with a network of eco-conscious individuals. This tool would not just manage food—it would nurture her commitment to the planet.
Ethan: Navigating Time and Budget in the Kitchen Maze
Elementary School Teacher from Vancouver, BC
The Time-Pressed Teacher
Ethan, 22, juggles a packed schedule filled with lesson plans and extracurricular activities, all on a tight budget as he comes from a lower-middle class income. Amidst his passion for teaching, he finds himself racing against time, struggling to manage his grocery shopping and meal prep efficiently.
Goals and Aspirations
Ethan's primary goal is to streamline his daily tasks, seeking time-saving solutions that align with his budgetary constraints. He dreams of a tool that helps him plan meals quickly and economically, minimizing food waste without compromising quality.
Pain Points
Time constraints often push Ethan into hasty, unplanned grocery runs, leading to repetitive purchases and spoiled food. With a modest income, he's always looking for cost-effective ways to maximize his resources.
Ethan's EcoPantry Vision
Ethan envisions an app that fits seamlessly into his busy life, offering quick meal planning and smart grocery suggestions that keep his pantry and wallet in check. A tool that not only saves time but also fosters his growing interest in sustainable living.

Defining the Problem 💭

People want an intuitive solution that not only helps track and manage food but also integrates seamlessly into varied lifestyles, encouraging long-term sustainable practices
In confronting the realities of food waste revealed through our personas, we identified that despite an increase in environmental awareness, many households still find themselves caught in a wasteful cycle due to inadequate food management tools. It's not just about spoiled milk or stale bread; it's money in the trash and more strain on the planet. This gap highlights a broader issue: there is a need for an intuitive solution that not only helps track and manage food but also integrates seamlessly into varied lifestyles, encouraging long-term sustainable practices.

Formulating the Hypothesis 🤓

By providing a user-friendly tool that simplifies pantry management and grocery tracking, EcoPantry makes reducing waste, saving money, and embracing sustainable living a no-brainer
This hypothesis builds on the identified need for a more intuitive solution to food management, anticipating that improved visibility and control over pantry items will lead directly to reduced waste and enhanced sustainability in everyday life. We predict that by embedding EcoPantry into the routine processes of planning, shopping, and cooking, we can facilitate a substantial shift towards more conscious consumption patterns. This will not only save money and reduce environmental impact but also promote a culture of sustainability that aligns with modern lifestyles.

Mapping the User Journey 🏃🏻

Understanding and catering to both the emotional and practical phases of the user's interaction with EcoPantry—from discovery to daily use—is fundamental to our design process
This visualization acts as a roadmap, guiding our design at every stage. By mapping the user journey, we identify moments of delight, frustration, or need, allowing us to tailor EcoPantry’s features to not only meet but also anticipate user needs, making each interaction intuitive and engaging. This ensures the app resonates deeply with users like Emma and Ethan, who are committed to sustainable living.
user journey map
In the ideation phase, we delved into generating a comprehensive set of features that focused on user needs and practical usability.

Benchmarking for Innovation 🧐

We analyzed the market landscape, examining existing platforms that are also battling against food waste
This allowed us to identify what these platforms were missing and how EcoPantry could uniquely fill those gaps. Our competitive analysis revealed that while some apps offered basic inventory management, none provided the integrated community engagement and personalized grocery list suggestions to further motivate efforts in food conservation.
competitive analysis

Brainstorming EcoPantry's Features 🧠

Guided by our user insights and competitive analysis, we brainstormed a set of features tailored to the needs of our target audience
Our aim was to design functionalities that not only facilitate easy management of kitchen inventory but also foster a supportive and interactive community focused on sustainable living. By integrating feedback from potential users and identifying gaps in existing apps, we were able to prioritize features that enhance convenience, encourage responsible consumption, and build a sense of community among users who are passionate about reducing food waste. This creative process ensured that EcoPantry would offer unique solutions that resonate deeply with users' daily habits and environmental values.
feature brainstorming overview
We chose features that mirror the common practice of sorting by type to simplify pantry management. Recognizing the importance of community in sustainability efforts, we wanted EcoPantry to let users build a supportive network together. We also implemented features to ensure users are aware of their grocery shopping patterns and expiry dates to minimize waste. Additionally, we opted to steer clear of having a monetary-based feature to maintain the community-focused spirit of the app and avoid introducing competitive elements that could detract from its primary goal of fostering a sustainable lifestyle.

Designing for a Greener, More Inclusive Future 🌍

As part of our mission to make EcoPantry accessible to a diverse user base, we conducted further research into it
We chose to design the app to work with screen readers after learning that, according to the World Health Organization, at least 2.2 billion people worldwide live with vision impairment or blindness. By integrating this capability, EcoPantry ensures that individuals with visual disabilities can navigate the app independently and reduce food waste without limitations.
Additionally, we decided to add a new speech-to-text feature to ease the process of adding items into their pantry. This decision was driven by the fact that many users, particularly those with mobility challenges, rely on voice input. A survey by Google revealed that 27% of the global online population already uses voice search on mobile. By incorporating speech-to-text, EcoPantry becomes more accessible to those who prefer or need voice-based navigation, allowing them to efficiently manage their pantry without typing.
In this crucial phase of the design process, we transitioned our well-researched concepts into tangible forms, crafting the visual and interactive elements of EcoPantry.

Establishing a Cohesive Visual Language 🎨

We developed a comprehensive style guide that defined EcoPantry’s visual identity
Our research into sustainability showed that using darker colors—along with red and green—on OLED displays (which is used by most mobile devices nowadays) is more energy efficient. Because of that, we decided to use a dominantly green color palette for EcoPantry, reflecting both our commitment to environmental sustainability and user inclusivity.
EcoPantry's Styleguide
We also made sure to use the Contrast Plugin by WillowTree in Figma to check that our design's contrast ratio for text meets the WCAG standards Level AA & AAA. These standards ensure that text is readable by people with moderately low vision, including those with color blindness.

Designing Intuitive Navigation 🧘🏻

Detailed mapping of every user flow within the app was conducted to ensure a smooth and intuitive navigation experience
By understanding the typical paths users would take, we optimized the app’s architecture, making every interaction straightforward and minimizing user effort.
user flow

Sketching the Foundation 👐🏻

The creation of lo-fi wireframes allowed us to layout the basic structure of EcoPantry’s interface
At this stage, our focus was on functionality and layout, avoiding intricate design elements that might distract from the core user interactions. These wireframes served as a blueprint for further refinement and high-fidelity development.
lo fi wireframes

Realizing the Vision 🙌🏻

With the foundation set, we moved on to crafting hi-fi designs that brought our designs to life with polished, detailed visual elements
These high-fidelity prototypes provided a realistic preview of how EcoPantry would look and feel to the end-user. Our goal was to create an interface that not only looked good but also promoted a seamless and inclusive user experience, ensuring that EcoPantry could be easily navigated by everyone, fostering a broader adoption and making sustainable living accessible to the wider community.
User Registration
splash screen
login screen
sign up screen
Home - My Pantry
my pantry screen
add items to pantry (barcode scan) screen
add items to pantry (manual entry) screen
Smart Grocery List
Smart Recipe List
smart grocery list screen
smart-suggest recipe screen
Donate & Rescue
donate and rescue screen
donate screen
rescue screen
donate & rescue messaging screen
My Communities
my community screen
community posts screen
community achievements screen
User Profile
Achievements
Rewards
user profile screen
user achievements screen
rewards shop screen
As we moved into the final stages of the design process, we showcased our prototype, and well...
We won second place 🎉

Receiving Feedback from Experts 💬

We engaged with a panel of design professionals from WillowTree and Vancouver Design Check-In
Their insights were invaluable, highlighting both the strengths and areas for improvement in EcoPantry:
1. The design was praised for its strong connection to sustainability with measurable outcomes. Our use of colors and graphics was noted for enhancing usability while maintaining thematic consistency.
2. Feedback commended the thoroughness of our user research and the effective alignment of user flows and interaction designs with user personas and their goals.
3. The necessity for a more refined gamification system was pointed out, with a focus on how it could better serve the app’s mission to enhance user engagement and contribute meaningfully to sustainability goals.

Key Takeaways for Future Designs 🏆

This feedback session provided invaluable lessons that extend beyond this single project
I am grateful for this opportunity to enrich my overall approach to design and further grow as a UX designer.
0
1
Focus on purpose-driven design
Every aspect of a product should directly support its core objectives. This ensures that features are meaningful and aligned with the mission, an insight reinforced by feedback on our gamification system.
0
2
Design with a user-centered approach
Thorough user research and alignment with user needs are foundational to effective design. This project highlighted the importance of deeply understanding user personas and designing with their specific goals and challenges in mind.

The Minds Behind Ecopantry 

3 People • 1 Goal • Countless Ideas 💡

A huge shoutout to my teammates 🤩

Personal Reflection

Looking Back...

This was my second time diving into a designathon, and wow, was it a blast! I had so much fun and learned a ton from some really cool mentors. It was eye-opening to see how much goes into understanding what users really need and how we can help solve those needs with our designs. I'm super thankful for the experience and can't wait to jump into more designathons in the future. Here's to more learning, designing, and solving problems!
Thanks for stopping by; let's chat soon!

You've reached the end!

ON THIS PAGE
IntroductionOverviewSolutionPrototypeDesign ProcessEmpathizeDefineIdeatePrototypeTestTeam ShoutoutReflection