Design a recipe organizer app for a bakery
Sierra Scott
The product:
Cibo is a new app for bakeries, restaurants, or individuals. Cibo wants to decrease food waste by providing users with an easy way to use leftover ingredients to create new recipes.
Project overview
Project duration:
March - April 2023
The problem:
Busy owners and cooks throw out a lot of food if it’s not used before it expires.
Project overview
The goal:
Design a recipe app that allows users to create and find recipes that use ingredients they already have.
My role:
UX designer and researcher designing an app from concept to delivery.
Project overview
Responsibilities:
Conducted interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting useability studies, accounting for accessibility, and iterating on designs.
Understanding
the user
User research: summary
I started by doing research and from there, conducted interviews that helped me figure out the overarching issue for people when managing their lives and others. I created empathy maps to better relate to the potential users. There were two user groups that I identified (1) single parents who are trying to manage schedules and meal time and (2) middle-age business owners or aspiring business owners who need help managing the business logistics.
User research: pain points
Time
Working adults who cook find it hard to satisfy everyone's needs, including themselves.
Waste
Wasting food wastes time and money that can be spent in other ways.
Organization
With so much going on in people’s lives, it’s hard to juggle it all.
1
2
3
Persona: Leo
Problem statement:
Leo is a food truck owner
who needs to better manage the food he buys because he doesn’t want to waste food he cannot/does not use.
User journey map
Mapping Leo’s journey allowed me to think of different pain points and areas of improvement.
Starting
the design
Paper wireframes
Taking time to think about the user flow and draft iterations on paper first helped me figure out the layout and navigation before translating the frames into digital wireframes.
Digital wireframes
I wanted to make the main goal of the app (creating new recipes from ingredients the user already has) easy to accomplish.
Users can easy create a new recipe from the homescreen.
Users can view popular recipes that other users have made.
Digital wireframes
I wanted to make sure that adding ingredients was easy so I made two separate ways that this task can be accomplished.
Easily search for ingredients or quick add common ingredients.
Users will build out their list and it will be visible here.
Low-fidelity prototype
Usability study: findings
Conducted two rounds of usability studies on the high-fidelity prototypes and recorded my findings.
Round 1 findings
Users wanted a way to engage with the recipes they make by commenting, reviewing, and adding photos
1
Round 2 findings
Users want to filter/sort recipes
1
Users want more recipe information
2
Users want to save recipes/ingredients
3
Refining
the design
Mockups
[Your notes about goals and thought process]
Before usability study 2
After usability study 2
Mockups
After the second useability study, I learned that users wanted to engage with the recipes more by seeing what others have done and have the ability to comment and share their experience. Not pictured: [I made it!] button.
Before usability study
After usability study
Mockups
High-fidelity�prototype
The final high-fidelity prototype presents a clear user flow from adding ingredients to choosing a recipe and saving the ingredients.
View Cibo app high-fidelity prototype.
Accessibility considerations
Added alt text to image for users who are vision impaired.
Made important text large and easy to read. Also there are options to increase the font size in the app setting if overall text needs to be larger.
Used universally known icons to communicate functionality that all users will understand.
1
2
3
Going forward
Takeaways
Impact:
The app allows users to minimize food waste while taking into account time restrictions and cooking ability.
What I learned:
While designing this app, I learned that continuous improvement and iteration is important to fully and completely understand the users needs, even the needs they don’t know themselves.
Next steps
Conduct another round of useability studies to ensure that the most recent improvements speak to the users comments in the last study.
Alter some design and button functionality to better improve the flow and make it clear what the CTAs are.
1
2
Let’s connect!
Insert a few sentences summarizing the next steps you would take with this project and why. Feel free to organize next steps in a bullet point list.
Thank you for taking the time to view my work on the Cibo app! If you would like to see more of my work or contact me, visit my portfolio:
https://www.sierramscott.com/