top of page
Hero Image 1.jpg

A Real-Time
Meal Planning Tool

Background

Fresh Plan is a meal planning tool designed to help users reduce waste while saving time and money.

 

I completed this project as my capstone for Springboard’s UX Bootcamp.

My Roles

  • User Research

  • User Interviews

  • User Testing

  • Ideation

  • Sketching

  • User Stories

  • Information Architecture

  • User Flows

  • Wireframing

  • UI Design

Problem:

Meal planning for the week can be stressful and time-consuming, especially if you want to eat fresh, healthy food.

 Young Woman Contemplating
Fruit Stand

Hypothesis:

A tool that helps users build meal plans as they shop could eliminate the need for extensive planning prior to the grocery store trip.

Process

Research

Food Waste Facts

- According to the USDA, 30-40% of food is wasted each year.

- Spoilage is a major contributing factor.

"Consumers contribute to food loss when they buy or cook more than they need and choose to throw out the extras."

Interview Insights

Pain Points

I conducted interviews with people who shop for groceries as part of their weekly routine, then I created an affinity map to identify themes. Here are a few common pain points in the shopping and meal planning process.

Wasting Time

From finding recipes to organizing grocery lists, meal planning takes a lot of time.

“I can’t imagine making a meal plan for a whole week.”

Wasting Money

By planning everything in advance, it’s hard to take advantage of sales in the store.

“I’m very motivated by sales.”

Wasting Food

When plans change during the week, food can spoil in the fridge.

“I often impulse buy seasonal ingredients then don’t know what to do with them.”

Redundancy

You either eat the same thing all the time, or you repeat the chore of coming up with a new meal plan every week.

“The downside is that I have to redo it every week.”

Common Values

As I created the affinity map, I also noticed some common values shared by most users. I made note of these as well to ensure my designs align with existing user values.

Fresh Ingredients

People prefer meals made of mostly fresh ingredients, especially seasonal produce.

“I try to eat produce seasonally, more based on availability.”

Flexibility

People want the ability to make last-minute plans without worrying about their food spoiling in the fridge.

“Sometimes I change my plan based on cravings that day, or based on what I have energy to make, or I make plans with friends.”

Exploration

People love to try new things, and are inspired by what they find in the grocery store.

“I like to take my time and explore new things.”

MVP Features

1- Real-Time Planning

- By creating a meal plan in the store, users can shop for sales and be inspired by seasonal ingredients.


- Many users want help getting organized, but they don’t want to sit down with a calendar and cookbook ahead of time.

User Personas

[Click to view full persona]

Adventurous Andrew

“I can’t imagine making a meal plan for a whole week.”

Wants:

  • Cooking inspiration

  • Schedule flexibility

  • Reduce food waste

[Click to view full persona]

“I can’t imagine making a meal plan for a whole week.”

[Click to view full persona]

Efficient Eve

"The downside is that I have to redo it every week."

Wants:

  • To eliminate a chore

  • To improve her system

  • To reclaim her time

Sketching

Solving
Problems
Early 

By sketching a lot early in the design process, I was able to:

 

1) Explore a variety of solutions before settling on the ones that work. 

2) Iterate quickly to hone the solutions until they were just right. 

Here's an example of the latter process in action...

Information Architecture

Fresh Plan has three integrated systems that define its user experience:
- A database of recipes
- A plan builder tool
- A grocery management system

 

Early in the design process, I created this simple sitemap (right) to ensure that each of the three systems were easy to navigate. 

 

The systems work together to create optimized the user experience, but I know not all users will want to use the app in exactly the same way. I wanted to ensure that each system provided value to the user on its own, so I fleshed out the sitemap into a full IA. (below)

User Flows

After users create a meal plan, their ingredients should be compiled into a shopping list. Here's an early user flow showing this process.

Version 1

Wireframes

UI - Style Guide

UI - Atomic Design

Testing

I used InVision to create a clickable prototype, which allowed me to put the app in the hands of potential users. I asked users to complete tasks simulating a real-world scenario, and I found that most users chose the correct routes on their first attempt. This showed me that the information architecture and visual communication of the UI were strong, but I noticed a few discrete places where users needed help. I decided to add some informative copy to empty states on a few key screens, and further testing showed that this helped users understand language used throughout the app.

Outcomes

The result of this design process is Fresh Plan, a robust meal planning tool that allows users to quickly plan meals as they shop in the grocery store.

The clean user interface, subtle nonverbal communication, and intentional information reduce cognitive overload, enabling users to make quick decisions as they plan in real time. 

The easily navigable information architecture establishes flexibility, giving users the power to accomplish a variety of goals.

The interconnected systems create a user flow that improves over time with minimal upkeep, saving time and supporting users in their goal of doing anything other than meal planning.

What's Next?

1) Build a usable prototype to test real-world user behaviors in the intended environment.

The clickable prototype is great for testing some aspects of the product, but it is limited in its ability to show actual user behavior. All users stated that the Pantry system sounded very helpful, but the core idea of this system is that its usefulness increases over time through consistent use of the app. It's difficult to assess the value of this feature without tracking user behavior over the course of multiple trips to the store. A functional MVP prototype would allow you to track how users actually use this function over time.

What I Learned

This was my Capstone project for the Springboard UX bootcamp, and the ultimate goal was for me to learn and practice the design process. It would be impossible to enumerate the things I learned throughout this process, but here are a few of my key takeaways.

 

  1. Validate your ideas regularly, especially if you’re working solo. 

 

If you can’t communicate your ideas, they aren’t fully formed. When you’re working on a project by yourself, it’s easy to have big ideas based on assumptions rather than data. Regular feedback from potential users and UX practitioners was invaluable in validating which ideas were working and which ones were not.

 

  2. Learning programs are linear, but design is cyclical.

The deliverables for this project were aligned with specific learning targets, each one building on the one before it. Working on this product helped to deepen my knowledge of each step of the process, but it was obviously disconnected from the way these practices are implemented in the real world. I found it beneficial to work forwards and backwards in cycles. By looking a few steps ahead, I got a better picture of what I was working toward, and going in-depth on later projects made me recognize the value and make improvements on prior work.

bottom of page