NoWaste Redesign
A mobile redesign project for a food inventory app that can easily track, organize and manage the food in your home.
Duration: 12 weeks Team: Independent project Design Tool: Figma, Miro
Overview
As an international student who missed the food back home, I started to follow my mom's recipes and cook more often. However, I was frustrated with how I failed to use all my ingredients before they expired. NoWaste is an app that I discovered and I hoped it would help me manage my at-home food inventory.
PROBLEM
The app has a simple and clean design with easy-to-understand navigation. However, it is not intuitive and functional enough to track food, avoid food waste, and manage inventory at home.
SOLUTION
Focused on improving its efficiency in tracking food inventory, I redesigned this mobile application with better user interfaces and useful features that truly fit the users' needs.
Design Process
Empathize
-
User research
-
Competitive analysis
-
Pain points
Define
-
User persona
-
User journey
-
Problem statement
Ideate
-
User flow
-
Wireframes
Design
-
High-fidelity prototype
-
Usability testings
-
KJ analysis
Reflect
-
Final design based on user feedback
EMPATHIZE
User Research
I conducted 5 interviews with participants who regularly cook at home to gain a deeper understanding of how they manage to track their food inventory at home.
.jpg)
4 Major Research Insights
-
People tend to cook based on what they have but have difficulties coming up with recipes to use up all of their ingredients.
-
People who use food inventory apps often forget to update their ingredients because it's time-consuming.
-
People who use food inventory apps enjoy browsing recipes and creating shopping lists.
-
People believe the steps to add inventory should be quick and the dashboard should be informative on food inventory apps.
EMPATHIZE
User Persona & User Journey
Based on my user interviews and research insights, I created this user persona to discover users' pain points as well as opportunities to further redesign the NoWaste app.
In order to help Amy achieve her goal, I identified the following opportunities:
-
Create food categories for quicker search
-
Make expiring food easily noticeable
-
Develop easy-to-use shopping lists
-
Recommend recipes with current food inventory
ANALYZE
Competitive Analysis
After learning the users' needs, I decided to analyze 2 mobile applications my interviewees used before: emptymyfridge and Cooklist.
Both products serve similar purposes but have different features. While analyzing, I took notes on how to make NoWaste stand out but keep its clean look. I was also aware of the need to add a search recipe feature so that the product doesn't fall behind.
Main takeaways:
-
User interfaces should be simple and straightforward
-
Users can easily notice what food inventory is expiring
-
Provide food suggestions to help users save time typing down food names
DEFINE
Keeping in mind a major pain point addressed in my user interviews was updating inventory was too time-consuming, and by combining my research insights and synthesis, I found that...
Efficiency is the key to helping users continuously use the NoWaste app.
Design Goals:
-
Reduce unnecessary white space for users to see more content at a glance
-
Minimize clicks for users to find information more quickly
-
Use intuitive words and icons that are clear and direct to guide users' actions
-
Add a feature to search recipes so users can finish their food before it expires
PROBLEM STATEMENT
How might we help users manage food inventory more efficiently and assist them in using up their food before it expires?
IDEATE
User Flow & Wireframes
Creating a user flow map helped me organize what features to include on my inventory home page and plan for a better user experience.
DESIGN
First Iteration
.png)
.png)
TEST
Issues found in the usability tests
I did usability testing with 3 peers and these are the key findings:
Card Sorting and KJ Analysis after the usability tests:
Moving forward to make future improvements, I incorporated the key findings from the usability tests and the results of my KJ analysis with a prioritized list into my final prototypes.
ITERATE
3 major improvements in my design
1. Better visual presentation
-
Based on users' feedback, the blank white background looked too simple so I added a light color to divide food categories and fill up the blank space
-
Resized food inventory boxes and made each component tighter so users can see more content at a glance
2. Provide users with more options to sort food items
-
Users can now sort multiple food categories at one time
-
Based on users' feedback, sorting food items by expiration dates can help them keep track of what ingredients should be prioritized
3. Improving the shopping page with new features
-
Include food categories for users to shop more easily
-
Create an "Add New List" button to fulfill users' need to make multiple lists
THE FINAL SCREENS
Final Designs
REFLECT
Takeaways
1. Feel comfortable receiving critical feedback
I discovered this NoWaste app as a user, and I thought I was doing a good job in my first iteration since I redesigned it from a user's perspective. However, when I received feedback from my peers during the usability tests, I realized there was a lot to revise. In the beginning, I felt frustrated not being able to come up with the best solution and look at the bigger picture. After my own reflection after the testing sessions, I then understood the importance of usability tests in getting user feedback to help me further improve my design solutions.
2. Simplify doesn't mean reduce
When I started iterating, I kept thinking about how to help users complete tasks faster. Once I had this idea, I couldn't help but begin reducing features and components I considered useless. I found out later in usability tests that this was the wrong mindset and created design flaws. Knowing how to step back and explore more ideas before reducing things without a second thought is a lesson I should remember in the future.