BudgetBites

Budget meal planner app

For this project, I really wanted to create something that I would personally use. As a university student, I felt one of my biggest struggles was home cooked meals.

Problem

Students are broke, busy, and lazy, but still need easy ways to organize and plan their meals.

Solution

A meal planner app that helps to collect meals based on your budget, time constraints and effort.

Problem

Students are broke, busy, and lazy, but still need easy ways to organize and plan their meals.

Solution

A meal planner app that helps to collect meals based on your budget, time constraints and effort.

Role

Product designer

Timeline

Jan - Mar '22

Creating plans

Create a new plan whenever for whatever.

Adding recipes

Explore and add recipes to your plans.

Coookin'

Get straight to cookin' with the help of step-by-step instructions.

Ideation and defining

To help understand my audience, I interviewed 6 of my post-secondary friends to understand their struggles and gripes related to eating during school. Here are my 3 main findings:

01

"I'm way too broke to eat out, so I have to make stuff"

02

"I don't have enough time or energy to make single meals"

03

"I don't know what to make"

Ideation and defining

To help understand my audience, I interviewed 6 of my post-secondary friends to understand their struggles and gripes related to eating during school. Here are my 3 main findings:

01

"I'm way too broke to eat out, so I have to make stuff"

02

"I don't have enough time or energy to make single meals"

03

"I don't know what to make"

After narrowing down the problem to solve for, I competitively analyzed similar products in the market for their use cases and areas of improvement. Then I defined the main user journeys of my app, along with its stages, tasks, thinking, and opportunities. Not everything stuck through to the end, but it helped to define the app direction and features for design.

Analysis

The next step was to roughly outline my creative brief from my findings to help guide myself during designing and iteration.

Main hypothesis

"If we allow students to plan meals based on their own budget, they can save more money."

Main scenarios

You find recipes to meal plan according to your budget. You want to make a quick snack. You want to discover a new recipe.

Business opportunities

Allow users to formulate plans based on specific limitations. Create and access multiple plans for reuse.

Analysis

The next step was to roughly outline my creative brief from my findings to help guide myself during designing and iteration.

Main hypothesis

"If we allow students to plan meals based on their own budget, they can save more money."

Main scenarios

You find recipes to meal plan according to your budget. You want to make a quick snack. You want to discover a new recipe.

Business opportunities

Allow users to formulate plans based on specific limitations. Create and access multiple plans for reuse.

Final designs and prototypes

Final designs and prototypes. Split into flow demos and static screens for a closer look.

Final designs and prototypes

Final designs and prototypes. Split into flow demos and static screens for a closer look.

Homepage

Poster at the top of the explore page for showcasing popular recipes, seasonal eats, for first time user onboarding, and more!

Your plans

Access any of your plans for whatever the vibe is.

Plan details

Compare the current number of recipes and price to what you set. Adjust the number of servings for each recipe and add new ones as you please.

Creating plans

Create a new plan whenever for whatever.

Create plan flow

Give your plan a beautiful name and set your limitations.

Empty plan

Your plans looking pretty empty right now...

Adding recipes

Explore and add recipes to your plans.

Explore

Give yourbe plan a beautiful name and set your limitations.

Recipe card

View recipe details, add to your plan, or start cooking with everything you need.

Empty plan

Choose or make new plan to add a recipe to.

Coookin'

Get straight to cookin' with the help of step-by-step instructions.

Step-by-step

Easy to follow steps accompanied with visuals and videos. Enter "Touchless Mode" for voice controls if your hands aren't free.

Exploration and iteration

Before landing my final designs, I conducted light testing with the same 6 friends, asking them their opinions on concepts and usability. Below is some rough work and notable early designs/ideas that were changed after gaining more insight on user needs, wants, and usage.

Exploration and iteration

Before landing my final designs, I conducted light testing with the same 6 friends, asking them their opinions on concepts and usability. Below is some rough work and notable early designs/ideas that were changed after gaining more insight on user needs, wants, and usage.

Grocieries

Early app direction included features that helped you shop for the cheapest groceries near you. It branched too far from the problem. Perhaps in a future update?

Creative inputs

Creative ways to input information like a calendar and scroller, made it unnecessarily difficult for users to put down exactly what they wanted.

Meal scheduling

Specifying meals for each day of a plan had similar issues to the grocery features. It didn't align with the target audience's needs and became too complicated for casual users.

Vertical explore feed

The original explore page held a "one after the other" feed layout. Testing showed that users preferred the masonry grid style, wanting to see more on the screen at once for faster decision making.

Reflection and takeaways

What I learned from this project.

Figma 101

Being my first major design project, I experienced a lot of things for the first time, but I was able to learn A LOT. Looking back, I have grown a lot with Figma. The way my past self grouped and manipulated my work made creating this case study so much harder 😭

It's not one and done

For some reason I hadn't expected to do as much exploration and iteration as I had thought. Even if the idea sounds dumb, quickly designing out those thoughts is important.

Reflection and takeaways

What I learned from this project.

Figma 101

Being my first major design project, I experienced a lot of things for the first time, but I was able to learn A LOT. Looking back, I have grown a lot with Figma. The way my past self grouped and manipulated my work made creating this case study so much harder 😭

It's not one and done

For some reason I hadn't expected to do as much exploration and iteration as I had thought. Even if the idea sounds dumb, quickly designing out those thoughts is important.

Thanks for visiting my portfolio!

Best viewed on desktop.

© 2026 Chris Pan.

Thanks for visiting my portfolio!

Best viewed on desktop.

© 2026 Chris Pan.