-Planned & conducted user interviews
-Paper & digital wireframes
-Low & high-fidelity prototyping
-Conducted usability studies
-Accounted for accessibility
-Iterated on designs
-Strategizing information architecture
-Designed responsive website
Most interview participants in the target audience reported feeling ill-prepared to plan and prepare meals that met their health and budget goals as young adults.
The feedback received through research made it clear that users would be open to planning and preparing meals if there were an easy-to-use tool to guide them through the process if it ultimately saved them time, money and improved overall health.
Online recipes often force large amounts of texts and ads before allowing the user to view the recipe details
Finding recipes that accommodate for specific food preferences and allergies is difficult to navigate
Developing a grocery list for specific recipes within a budget can be complicated and overwhelming
"I'm a busy student who wants to learn how to cook quick, healthy, and budget friendly meals" - Mei
After ideating on paper wireframes, I developed the initial digital design for the Yumo! App. These designs focused on:
To prepare for usability testing, I created a low-fidelity prototype that connected the user flow of browsing & filtering recipes, adding to shopping list, and leaving to checkout through a grocery store partnership.
People want easier access to recipes through search and filter.
People like seeing the recipe overview right away to quickly gage if the recipe is appropriate.
People prefer easier ways to change quantities of ingredients in bag.
The high-fidelity prototype uses the same user flow as the low-fidelity prototype and includes design changes made after the usability study.
Clear labels for interactive elements that can be read by screen readers.
Color choices pass all WCAG requirements for color contrast accessibility needs.
Microphone icon in search feature provides voice to text option for users with accessibility needs.
After completing the app design, I started designing the responsive website. I created a Yumo! sitemap to:
The screen size variation designs are optimized to fit specific user needs of each device and screen size.
Young adults now have an easy-to-use tool to help newer cooks find level appropriate recipes, prepare food budgets and work towards a healthier lifestyle.
Applying user and peer feedback throughout the design process is really rewarding. I really enjoy seeing that specific user needs are met through creative problem solving.
1. Conduct additional research on how the app impacts user’s overall health
2. Add additional resources for meal planning
3. Provide incentives and rewards for meal prepping and saving money on food
I hope you enjoyed viewing Yumo! Mobile First Approach App & Responsive Design. Thanks for checking it out!
Creative coffee sessions encouraged
