top of page

Eco Fix App

Project Type: BrainStation Capstone Project
Timeline: 11 weeks May-July 2024
Roles: UX Researcher, UX/UI Designer
Tools: Figma

This case study explores the design process behind Eco Fix, a mobile app designed to help busy professionals easily adopt and maintain sustainable habits. Through user research, I discovered that common barriers to eco-conscious living include perceived inconvenience, lack of knowledge, and the overwhelming nature of the "zero-waste" movement.
​
To address these challenges, I focused on creating an intuitive, user-friendly app that provides easy-to-follow repair guides, personalized recommendations, and a supportive community.  By prioritizing convenience and emphasizing small, achievable steps, EcoFix aims to reframe sustainable living as a positive and rewarding lifestyle choice.

Take a Look

Eco Fix.png
2.png

Creating Eco Fix

72%

72% of people say that they actively try to reduce waste

40%

 40% of the actions people performed each day weren’t actual decisions, but habits

Problem Space

People want to reduce waste but feel overwhelmed by the perceived cost, inconvenience, and all-or-nothing pressure associated with the zero-waste movement. This leads to frustration, a cycle of unnecessary purchases, and quickly discarding items. However, by focusing on small, achievable changes in everyday habits, we can make a significant positive impact. 

Method

Guided by the Double Diamond Design Methodology's principles of convergent and divergent thinking, I embarked on an expansive exploration of ideas before narrowing my focus to actionable solutions. This structured creative process, divided into four distinct stages, provided a framework for my design journey, ensuring a thorough and innovative approach.

double diamond 2.webp

Dan Nesser - British Design Council

Secondary Research 

Our consumer-driven society generates massive amounts of waste, with trillions spent annually on goods and services. This unsustainable consumption strains resources and fails to bring lasting happiness. However, a shift to sustainable living is possible through small, habitual changes. By understanding the "habit loop," we can replace wasteful behaviors with eco-friendly alternatives, ultimately reducing waste and fostering a more sustainable future.

$44 Trillion

We buy an astounding $44 trillion worth of goods and services annually

2.12 Billion

We generate 2.12 billion tons of waste annually

Research Objectives 



    Understand Barriers to Sustainable Habits



    ​​


    Impact of Consumerism


    ​​



    Investigate Effective Habit Change Strategies



    ​​



    Assess the Role of Budget Constraints

Assumptions



    People lack knowledge on how to reduce waste and live sustainably



    ​​


    Small, consistent changes are more effective for lasting sustainable behavior than major overhauls


    ​​



    Finances greatly influence people's ability and willingness to adopt sustainable practices.

Hypothesis Statement

I believe people struggle to adopt sustainable habits due to uncertainty about the most impactful, convenient, and affordable actions. I'll be right if 2 out of 3 participants express feeling overwhelmed or unsure about integrating such practices into their daily routines.

HMW Question

How might we empower budget-conscious young adults living in major North American cities to easily adopt and maintain sustainable habits that reduce waste and save them money?

Data Collection and Analysis

Methodology

One-on-one decontextualized interviews with three target users, where I’ll gather qualitative and attitudinal data. Questions were prepared under the interview guide.

Participant Criteria

Age Group: Millennials; 
Location: Residing in a major North American city; 
Financial Status: Mindful of their spending;
Interest in Sustainability: They express a desire to reduce their environmental impact and waste, but may face challenges in doing so;

Affinity Map

To uncover deeper insights from my interviews, I used affinity mapping to organize and synthesize the collected data. This visual approach helped me identify patterns, connections, and overarching themes that emerged from my conversations with users. 

affinity map1.png

Revised HMW Question

How might we reframe sustainable living as convenient, enjoyable, and financially rewarding for budget-conscious young adults in major North American cities, enabling them to effortlessly reduce waste and save money through everyday choices?

Untitled design (1).png

Define

User Persona

Based on the insights gathered from my interviews and analysis, I developed a comprehensive user persona that embodies the target user group and aligns with the chosen theme.

Complete user persona

Meet Emily

Emily, Age: 32; Location: Vancouver, BC



    Emily is feeling overwhelmed by the vast amount of information about sustainability.


    Emily feels that sustainable choices require too much effort and sacrifice.


    Emily Lacks the time and resources to research and implement sustainable practices.


    Emily feels guilty about not doing enough for the environment.

Untitled design (2).png

 Ultimately, I think the biggest obstacles I face are time and convenience.

User Experience Map1x.png

User Experience Map

To better understand our user persona, Emily, I created an experience map that illustrates her journey towards a more sustainable lifestyle. This map visualizes her challenges and frustrations with current eco-friendly options, highlighting opportunities to simplify and streamline her path to greener choices.

​

 

​
 

Complete Experience Map

User Stories & Epics

After analyzing my research findings and considering Emily's experiences, I transformed user insights into actionable user stories. These user stories were then grouped into four distinct epics, each representing a key phase in the user's journey towards sustainable living. This organization helped prioritize features and create a clear roadmap for the app's development. From these epics, I selected a core epic and translated its user stories into specific tasks, forming the foundation of my user task flow.

Finding and Using Sustainable Products


    As a busy professional, I want a curated list of sustainable brands and products that are high-quality and time-saving so that I can make informed purchases quickly and confidently


    As a busy professional, I want to know the financial benefits of sustainable living    so that I can justify the investment in eco-friendly products and services


    As a busy professional, I want to easily compare the cost and environmental impact of different products so I can make quick, informed decisions.


    As a busy professional, I want to find sustainable alternatives to disposable products that are just as effective and easy to use    so that I can reduce my waste without sacrificing convenience or performance


    As a busy professional, I want the app to automatically suggest sustainable alternatives for products I frequently buy so that I can make eco-conscious choices without having to research every time


    As a busy professional    I want to invest in high-quality, durable products that will last longer so that I can reduce the need for frequent replacements.

    As a busy professional, I want a list of products and their environmental impact so that I can check before buying anything new

Chosen Epic

The chosen epic aligns perfectly with the "Convenience vs. Perceived Gain" theme, tackling the common barrier of perceived inconvenience in sustainable practices. By offering accessible repair guides, we aim to showcase the immediate benefits – saving money, reducing waste, and fostering empowerment – making sustainable choices more attractive and feasible for busy individuals.

Enhancing Lifestyle and Habits

As a busy professional, I want to access quick and easy DIY repair guides for common household items and clothing so that I can fix things instead of throwing them away.

Task Flow

After selecting a user story and task from my core epic, I developed a task flow for Emily. In this flow, she'll be accessing the EcoFix app to find a repair guide for her malfunctioning coffee maker. She hopes to fix it herself to save money and reduce waste.

Legend
2.png

Ideate

Sketches

Guided by my task flow, I gathered UI inspiration images to explore design options for each of the app's five screens. I created 17 exploratory sketches, experimenting with various layouts and features to address user needs effectively.

Building on the most promising ideas, I refined my sketches into more polished solution sketches, incorporating feedback and insights gained from the exploration phase.

Frame 1.png

Home Screen

A personalized gateway to a more sustainable life.  Discover inspiring stories, expert tips, and local events, all while easily accessing the tools the user needs to fix, reuse, and reduce your environmental impact.

Key Takeaways:



The exploratory sketches helped to experiment with different layouts and content hierarchies.


The solution sketches refined the chosen layout, focusing on improving visual clarity, navigation, and content discoverability.


The final design incorporates elements from both initial sketches, such as a prominent search bar and a visually appealing news carousel

Prototyping & Testing

Building upon my UI inspiration and refined solution sketches, I created grayscale, mid-fidelity wireframes in Figma.  This initial prototype served as a foundation for usability testing, allowing me to observe how users interacted with the app's core features and navigation.  Valuable feedback from these tests highlighted areas of confusion and opportunities for improvement, guiding my iterative design process toward a more intuitive and user-friendly experience.

 Round 1 

These wireframes were developed into an interactive prototype, incorporating essential functionality and preparing them for the user testing that I will showcase next.

 Round 2 

Following the prioritization matrix, I strategically enhanced the wireframes and prototype. I began by implementing revisions identified in the High Impact, Low Effort category, maximizing improvements with minimal effort. Next, I tackled some changes from the High Impact, High Effort category, recognizing their potential for significant user experience enhancements. I still had time to apply a few changes placed in the Low Effort, Low Impact. The remaining items will be considered for future iterations as time and resources allow.

Untitled presentation (5).png

Home Screen

After
Before

With the revised prototype completed, I conducted a second round of user testing to ensure a human-centered design and identify potential usability issues. This round focused on validating the effectiveness of the changes made based on the initial feedback, observing how users interacted with the new features, and gathering additional insights to further refine the app's functionality and user experience.

Frame 430.png

 Final LO-FI Prototype 

Based on feedback from the last round of testing, I made minor alterations and implemented smart animations in the third prototype to create a more dynamic and engaging user interaction.

Untitled presentation (9).png

Home Screen

Before
After
Untitled design (1).png

Deliver

Brand Development

After revising the prototype based on user testing feedback, it's time to focus on the final visual design. The first step is to develop a strong brand identity that aligns with the desired user experience and emotions. 

By carefully considering the brand's visual elements, I can create an interface that is both aesthetically pleasing and emotionally resonant, ultimately motivating users to adopt sustainable habits.

Adjectives



    Convenient


    Supportive


    Optimistic


    Forward-thinking 


    Transformative


    Resourceful


    Sustainable

More A than B



    More motivating than guilt-inducing


    More convenient than demanding


    More supportive than preachy


    More optimistic than doom-and-gloom


    More forward-thinking than traditional


    More transformative than simply informative.


    More resourceful than wasteful.

Brand Name

The app's name evolved through brainstorming, exploration, and refinement. While several strong options emerged, 'Eco Fix' ultimately stood out for its ability to capture the essence of the app's mission and resonate with users on an emotional level.

EcoHabit

This name directly communicates the app's focus on fostering eco-friendly habits and is versatile across various contexts.

Eco Fix

The word "fix" implies taking action and solving problems, aligning with the app's emphasis on repair guides and DIY solutions. It also suggests positive change, motivating users.

SustainAble

This name cleverly plays on the word "sustainable," emphasizing that it is achievable and accessible to everyone.

Mood Board

During my initial mood boarding for Eco Fix, I gathered around 50 images aligning with the chosen adjectives and evoking the desired feeling of the app.  From this collection, I curated a more focused mood board, refining the visuals to better encapsulate the brand identity and ensure a cohesive representation of Eco Fix's values and aspirations.

moogboard.png

UI & Branding

Colour Extraction

After analyzing my mood board, I extracted a wide range of colors that reflected the desired brand identity for Eco Fix. To simplify the selection process, I grouped these colors into distinct palettes based on their shared tones and moods.

​

Colors.png

 Final Prototype 

After completing the steps outlined previously, I arrived at my high-fidelity prototype, incorporating color injection and iterative improvements based on feedback from the third prototype.

Eco Fix.png

UI Library

Now that I've shown you the brand development process, let's explore the UI library I created to streamline colour injection and final touches. This library will also make future updates and additions faster and more accessible to anyone on the team.
Using the Atomic Design methodology, I've organized the library into the following categories:



Foundation: Grids.


Atoms: Basic building blocks of the interface.


Molecules: Simple groups of UI elements that function together as a unit.


Organisms: More complex UI components composed of molecules.


Templates: Page-level objects that place components into a layout.


Pages: Specific instances of templates with real content.


Let's explore each of these in more detail in the following slides.

Untitled presentation (11).png
Atomic Design Methodology

Atomic Design is a methodology for creating design systems that help manage the complexity of large projects with numerous components. The need for such a system becomes evident when the sheer number of elements becomes overwhelming, making it difficult to maintain consistency and efficiency in the design process. Let's take a look in how I organized the elements of my UI Library. 

2.png

Marketing

Market Research

To successfully launch Eco Fix, I've begun exploring marketing strategies and discovered that a strong online presence is crucial. Studies show that 75% of consumers judge a company's credibility based on its website design. This highlights the importance of creating a visually appealing and trustworthy platform to encourage downloads and build user confidence.

 

A marketing website acts as a central hub for the Eco Fix app, providing a dedicated space to showcase its features, benefits, and value proposition. This website can effectively leverage various online marketing techniques, including content marketing, email marketing, social media promotion, and search engine optimization, to reach a wider audience and drive downloads.

UI Inspiration
Desktop.png
Mobile_edited.jpg

 Chosen Prototypes 

After careful consideration and further peer feedback, I selected this high-fidelity prototype as the most fitting representation of Eco Fix's brand identity and user experience goals.

MacBook Pro and iPhone 15 Pro Mockup.png
Untitled design (1).png

Multi-Platform 

Eco Fix for Tablet

To expand the reach of Eco Fix and enhance user engagement, I challenged myself to explore an additional interface beyond the mobile app.

 

Given the need for convenient solutions for sustainable living, I decided to focus on a platform that could offer a larger screen and more versatility than a phone. I determined that tablets presented a unique opportunity to create a more immersive and engaging Eco Fix experience, especially for activities like following repair guides or browsing through educational content.

iPad Pro 12.9_ Screen Mockup.png
2.png

Future Thinking

Untitled design (1).png
The Catalyst: Shifting Cultural Norms

Like the Catalyst card, Eco Fix aims to ignite a transformation in how we view consumption and waste. By empowering individuals with accessible tools and knowledge, we're fostering a cultural shift towards repair, reuse, and mindful consumption. As more people adopt sustainable habits, the ripple effect can influence social norms, inspire collective action, and ultimately create a more conscious consumer culture.

2.png
The Smash Hit_edited.jpg
 Smash Hit: A Vision for a Sustainable Future
 
Imagine 100 million people using Eco Fix: A global community of repairers, upcyclers, and eco-conscious consumers sharing knowledge and inspiring each other. We envision a world where broken items are treasures to be fixed, where resources are cherished, and where every small action contributes to a healthier planet. Eco Fix is more than an app; it's a catalyst for a sustainable revolution.
Untitled design (1).png

Closing Remarks

Key Learnings & Next Steps

In closing, my journey with Eco Fix has been an illuminating one, filled with valuable lessons. I've seen firsthand the power of iterative design, user feedback, and the importance of aligning design choices with the target audience's needs and preferences. The positive reception to the app's concept and functionality validates its potential to make a real impact in promoting sustainable living.

 

Moving forward, I'm excited to implement the valuable feedback received during usability testing. Key next steps include refining the navigation, adjusting button placement, and enhancing the feedback mechanisms to create an even more seamless and rewarding user experience. I also plan to explore adding features focused on preventative maintenance, as suggested by our users.

 

Ultimately, my goal is to launch Eco Fix as a comprehensive and accessible tool that empowers individuals to embrace sustainable habits and reduce their environmental impact. By making repair, reuse, and responsible consumption more convenient and enjoyable, EcoFix can help pave the way towards a brighter, greener future for all.

bottom of page