Personalized Meal Planning for Students
UW-Madison - Intro to Human Computer Interaction
Create a recipe website to better support how real students discover, save, and plan meals.
Role
UX Designer
UX Researcher​
Tools/Skills
Figma
HCD
Team
1 UX Designers,
2 UX Researchers
Duration
5 Weeks
​
Overview
​​​
This project was completed as part of UW–Madison’s Intro to Human–Computer Interaction course, where we applied diverse human-centered research and design methods to create a tool for everyday efficiency. My team focused on enhancing the recipe discovery experience by designing a mobile website that helps users filter by ingredients, cook time, and dietary preferences while saving and organizing meals in a simple, intuitive way.
The Problem Space
College Students' Cooking Habits Look Different than Most
For many college students, cooking is squeezed between classes, work shifts, and social commitments. With limited time, tight budgets, and shared kitchens, preparing home-cooked meals often feels more stressful than sustainable.
Research shows that over 60 percent of college students report feeling consistently pressed for time, making efficiency a key factor in everyday decisions.
Initial Research
Student Recipe Choices and Considerations
As a team, we conducted three contextual inquiries with students who had different levels of cooking experience, ranging from beginner to frequent home cook.
We asked each student to think out loud while finding a new recipe they would realistically want to make. Through environmental observation and follow-up questions, we noted their eating habits, searching strategies, and decision-making in real time.
The visuals above feature work from our data analysis including portions of our affinity & bullseye diagramming.
Patterns that Emerged
01 Students are on a time crunch
Most students were looking for quick, convenient recipes that could stretch into multiple meals.
02 Saving recipes is harder than it should be
Many students mentioned losing recipes to forgotten screenshots or random notes scattered across their phones
03 Searching begins without a clear plan
Students didn’t always know what they wanted to cook, and by the time they found something that fit, they were often too tired to actually make it.
04 Ingredients Come First
With grocery stores not always close by, students preferred recipes that worked with what they already had, avoiding last-minute trips.​
Human-Centered Modeling
Visualizing Surrounding Systems
I created 5 diverse human-centered models to further break down existing relationships and how recipe searching goes beyond our interviewees' individual screens. Cultural, artifact, sequence, flow, and physical models helped us visualize how habits, environments, and tools shape decision-making across the entire experience.
This process taught me how the perspective of our sole user group fits within a larger ecosystem of digital and physical environments. Reminding me to consider how different stakeholders interact with recipe-finders and leading me to consider different use cases of our product, despite not having interviewed all groups.
Storyboarding
Ideating Within the Student Experience
Applying qualitative insights from our interviews, personas, and models, I used journey mapping and storyboarding to explore how potential design solutions could fit into a student’s everyday life and address common frustrations. Observing that all participants relied primarily on their phones to search for recipes reinforced the importance of designing with a mobile-first mindset.
Initial Wireframes & Heuristics
Once the storyboards clarified how the experience should fit into students’ daily routines, we shifted into rapid wireframing to explore layout and interaction ideas. Using the Crazy Eights method, I quickly generated multiple variations and narrowed down the top solutions.
Wanting to catch usability issues early, I conducted a heuristic evaluation for each screen, following Jakob Nielsen’s 10 usability heuristics, which refined our wireframes before moving into prototyping.
​
Learnings from Early Wireframe Assesment
Moving quickly through wireframes and running a heuristic evaluation helped me uncover a few small but impactful usability issues early on. Before moving into prototyping, I addressed key gaps that could have slowed users down:
​
01 Added a clear way to reset and adjust filters so users could easily recover from mistakes
02 Introduced visual indicators to show how well recipes matched a user’s criteria
03 Simplified the layout and tightened visual consistency to make results easier to scan
​
Prototype Sprint
Designing Early Screens
As the sole designer on the team, I led a rapid prototyping sprint and designed five connected screens in Figma to create a complete, testable flow. These designs built directly on our models, storyboards, and heuristic findings, allowing us to move quickly into usability testing. While some elements extended beyond our original scope, such as recipe reviews and author context, they served as intentional placeholders to better simulate real decision-making and test a more intuitive end-to-end experience.
Usability Testing
Testing our Prototypes Against Assumptions
After building our initial prototypes, we ran five usability tests with current college-students to see how they navigated the experience without guidance. Participants completed common tasks like filtering recipes, interpreting match results, and saving options for later, while thinking out loud. This interview process reealed 3 key challenges with our initial Figma prototype.
Prototype Iteration
Applying Changes Based on Student Feedback
Based on usability testing, I focused on a few key changes where students showed the most confusion or hesitation.
​
-
Added a match summary to explain why a recipe did or didn’t fit a student’s criteria.
-
Made filtering easier to find by adding a dedicated icon to the navigation bar.
-
Reordered filter options to highlight cook time and serving size, which students cared about most.
-
Introduced personalized home sections like seasonal recipes and recommendations based on recent searches.
Since students found saving and revisiting recipes intuitive, I made minimal changes there and preserved what was already working.
Final Solutions
RecipeMe Feature Highlights
Final Solutions
Recipe Planning For Busy Student Realities
This design, rooted in HCI research methods, effectively helps students with busy schedules transition from scattered meal ideas to resourceful and easy-to-find recipes tailored to their time, ingredients, and preferences, allowing them to make the most of their schedules.
Learnings and Next Steps
This project challenged me to practice thorough human-centered design research spanning from contextual inquiries to heuristic evaluations. As the sole designer on my team, it taught me to prioritize usability above all else within a tight timeline as well as iterate quickly and seek feedback early on.
​
Next steps: Complete additional A/B testing, find preferred design methods for recipe filtering, introduce ingredient substitutes, and enhance the user interface for branding and aesthetics.
