FreshTrack
A food management app that focuses on food waste & expiration, grocery shopping lists and more.
Background
When we go shopping, we tend to think of what we need at the moment. We want to make sure that the food we buy is fresh and isn’t expired. Almost everyone has seen or read labels on food products that note “Sell by”, “Use by”, or “Best before”, which we believe indicates the expiration of that food product.
Yet, more than 80% of Americans consistently discard perfectly, good food and actually have expired food sitting in our fridges at home.
This project focuses on creating a food management / expiration app, to assist users with reducing food waste, identify which foods are more prone to expiration, and how to utilize those foods with recipes to be more food-efficient.
Role
End-to-End UX Designer
UX Researcher
UI Designer
Branding
Graphic Design
Project TypeEnd-to-End App
Tools
Figma
FigJam
Whimsical
1 / Research
This idea originally came about as I was staring into the fridge in my kitchen - I didn't realize how much food I wasn't keeping tracking of, and occasionally, I had to throw out perfectly good food.
Why would an app about food waste be helpful?
As reported by the U.S. Department of Agriculture, "food waste is estimated at between 30-40% of the food supply - consumers also contribute to food loss when they buy or cook more than they need and choose to throw out the extras."
In a much more simple translation, this means that more than 80% of Americans discard perfectly good, consumable food, and most of this is due to over-assessing how much food we need, buying on impulse, and buying due to not knowing what foods we actually have at home.
What is the problem we're solving?
- People have trouble identifying what foods are expiring in their kitchen, and tracking which foods are going bad.
User Goals
- More efficient food management.
- Simplify meal planning.
- Staying organized with grocery lists.
Business Goals
- Build brand loyalty.
- Generate revenue streams based on premium subscription and features.
- Increased user engagement on the product.
What is our research goal?
- To understand how people track and use the food they buy, and how we can help them be more cognizant and efficient with using food wisely
User Interviews
I conducted interviews with 5 people, and focused on their experiences with:
- their current food management process
- what they prioritized when grocery shopping
- how they tracked expired food, and how often it was thrown out
Affinity Mapping
I also conducted affinity mapping to gather user data and key quotes - this helped to synthesize the main themes of the problems we were aiming to solve.
Key Insights
- Participants noted they had trouble tracking expired foods and what type of foods expire easily.
- Many participants noted they frequently went grocery shopping and cooked at home often.
- Participants expressed a desire to be reminded when foods expired, or were expiring soon.
- Participants also noted they would like to utilize expiring foods more efficiently.
Competitive Analysis
While there were a decent number of food management apps on the market, very few focused on food expiration, or did not make this their primary feature.
Of the few direct competitors, resulted in the following:
Key Insights
- All apps had a basic form of food management, such as inputting the quantity of specific foods in your fridge.
- Only 2 apps, KitchenPal and Fridgely, had a feature to track expired foods.
- All apps lacked in-depth features for food management (e.g. utilization in recipes, larger database of foods)
2 / Define
User Personas
Most of the users I interviewed shared similar thoughts, perceptions and mindsets when it came to food management.
Here's Tara and Sara - two user personas I designed that fully encompass the people that we're trying to solve the problem for.
Feature Prioritization
Understanding what users were struggling with when it came to food management helped me prioritize the most important features for building out the app.
The must-have features:
- Food Inventory Management
- Expiration Notifications
- Food Waste Tracking
- Grocery shopping lists
- Recipe Suggestions
User Flows
I wasn't quite sure on how users would interact with the above features yet , so I created two user flows to help with this visualization.
Adding a food item to inventory
Checking the fridge inventory
Sitemap
Now that I had my user data, personas and research insights, I began to categorize information based on what would be the most clear, concise and intuitive.
3 / Design
Logo
For the logo design, I focused on images that came up when searching for these keywords:
- healthy
- clean
- organized
- fresh
- management
The goal was for the logo to encompass a simple, straightforward and minimal design that embodied the purpose of the app - it was crucial to keep the logo and design as "clean" as possible, as the app represented the idea of management and organization.
Much inspiration came from pre-existing grocery brands that promoted "healthy" or "organic" produce, such as Whole Foods, Trader Joe's and Sprouts.
Component Library
Noting the keywords above, I aimed to focus on a color palette that was fresh, inviting and calming. The typography also focused on simplicity as it would reflect the values of this product.
The navbar focused on the main features gathered from user data & interviews.
The component library above lists out every component that is used in the product, as well as showcasing the primary features.
Low-Fidelity Wireframes
It was difficult to come up with any type of initial sketches - there weren't many popular or highly used food management apps out there.
The user research and feature prioritization helped zone in on what should be the primary features and screens when interacting with the app.
Mid-Fidelity Wireframes
While creating the mid-fidelity wireframes, I ran through several quick user tests with participants to get an initial idea of the user flows.
Gathering valuable feedback from early user testing, this helped to lay down the foundation for building out the rest of the screens.
Below is an example of a user flow that participants ran through - this helped me get an idea of what worked well, what didn't, and where improvement could be made.
Adding food to inventory
High-Fidelity Wireframes
4 / Testing
Usability Tests & Results
Tasks
- Add a food item to their current inventory.
- Check what is currently in their fridge inventory.
Success metrics
- There was a 95% or higher completion rate of the tasks.
- Less than 5% of errors encountered (this included navigating to a different page, mis-clicking, unable to complete the task, etc.)
Testing method
Participants were provided detailed instructions on the user flow, and were instructed to run through a final prototype via unmoderated testing. A post-survey was included at the end of the flow to gather users' final thoughts and feedback.
Results
100% of users completed their given tasks! However, some users noted that they were not able to easily identify what some of the navbar icons represented, or where they would navigate to.
Overall, all participants noted that they found it moderately easy to navigate through the FreshTrack app.
Iterations
Participants noted that it would be helpful to see the navbar icons labeled, or give some identification as to what they would do.
Final Product
5 / Conclusion
Challenges
- When looking into the topic of a food management app, it was difficult to find any pre-existing apps or websites that was utilizing this effectively - adding on to the fact that there weren't that many on the market to begin with.
- Additionally, it was tricky to come up with a concept for a food management app that also incorporated focus on expiration as the only references to be used for this were very few apps, which only threw them in as a secondary feature.
Final thoughts & next steps
- This was a very iterative process, and was an incredible experience to have stepped into the role of a end-to-end UX Designer. Many parts of the process, such as additional research and testing, were re-visited because it would contribute more to the final outlier of the product itself.
- I was also able to better understand on how to work within realistic timeframes, and working with design systems that would follow best practices in app design.
- My next steps to action would be to observe the usability of participants with the app, focusing on areas of improvement or areas that could use more discoverability.