Healthy Spoon aims to aid users to efficiently and easily meal prep each week in order to maintain a consistent diet despite the different factors that prevent healthy, conscious eating.
Problem: According to the World Health Organization (WHO), cardiovascular diseases are the leading cause of death in the world in both males and females. There is scientific evidence showing obesity plays a large role in the development of these diseases.
People aren’t always aware of how large of an impact nutrition plays on their overall health. Diet plays a large role in maintaining a healthy lifestyle which leads to a longer life expectancy. Additionally, a nutritionally-balanced diet can lead to many benefits like higher energy, positive mood changes, better sleep, etc.
Target: Adults in their 20s-30s who have varying lifestyles.
Adults in this age range typically are starting, or in the process of, creating a stable foundation for their future. This greatly impacts the quality and effort that goes into their meals due to lack of time and energy.
Research Goals: To find how people dedicate their time to eating so that we can understand how to encourage a more nutritionally-balanced diet.
Research Objectives:
Methodologies:
A competitive analysis with 4 meal prep sites was conducted where their strengths and weaknesses were outlined and compared. I utilized this information to get a solid understanding of what other meal prep sites were offering and how they were maintaining their customer base.
Major Insights: Features and services that go into successful meal prep sites.
Summary: User interviews were conducted with 6 participants that matched my target demographic (adults in their 20-30s). I also wanted to analyze participants' meal prep experiences through these 3 categories:
Research from competitive analysis helped to come up with interview questions.
Interview Method: Zoom
Interview Duration: 30-50 minutes
Link to affinity map FigJam fileMajor Insights: I listened back on all my interview recordings and noted down key/major points to each question. By organizing these points into a FigJam file, I created an affinity map in order to gather my thoughts from my interviews.
Not only did these interviews affirm the pain points I was already aware of, but they also introduced me to some new pain points that I never thought about.
The major interview insights are below:
Using what I discovered from my user interviews, I identified 3 major pain points and applied my insights (above) to create my personas.
Pain Points:
Why Personas?: Creating a persona for each of my pain points helped me stay grounded moving forward in the design process. I constantly referred back to these cards and remembered who I'm designing for.
For my sitemap, I went about things a little differently than planned. Due to my prior knowledge about site layout and hierarchy from other meal planning sites (from my competitive analysis), I already knew how my site was going to be structured.
This meant that the card sort that I conducted didn't add much value toward my sitemap, rather it helped confirm the content that would go into each page.
Major Insights: I conducted another with the same companies from my first competitive analysis. Focusing on navigation and hierarchy, this analysis backed me in my decision to how I structured my sitemap. Furthermore, I wanted to comply with standards that users in the meal prep industry are already familiar with.
I would like to note that there were many iterations of this sitemap (if you click on the FigJam link). Not only were revisions made after mentor and group critique sessions, but further along the process I changed my sitemap to better fit the needs of my users after completing user testing (more to come later).
User Flow 1: Persona with dietary restrictions finding and saving a recipe for the first time.
One of the biggest things that go into a meal prep app is having access to a wide range of recipes so I wanted to create a flow where a user with a tree nut allergy goes to find a recipe suitable for their dietary needs.
User Flow 2: Persona with a busy schedule uses the store locator feature.
A feature that I thought would be really nice to have for our users was a store locator. Not only would this feature show the stores closest to the user's location, but it would also display if the store had stock of the ingredients the user needs to buy. This would save the user time and energy during their grocery runs, which from my interviews, was something that all my users enjoyed doing.
User Flow 3: Persona checking and editing their weekly meal planner.
The weekly meal planner is another feature that is integral in a meal prep app. Through this user flow, I wanted to show the different ways the user could go about this process.
Major Insights: Creating user flows allowed me to think of different ways the user could approach my project. It also helped create a directional, chronological flow for how the user would navigate.
My users flows were iterated upon throughout my design process. As I created my wireframes and got feedback from my mentor and peers, it became clear to me that there were some steps I was missing or didn't need.
Major Insights: Task flows were created from my user flows as the "desired" path the user would take when navigating through my meal prep app. These are the flows that acted as blueprints for how I should start designing my wireframes.
At this point of the project, I felt confident in the direction I needed to go in, in order to create the best possible design I could for my users. I had my research to base my design decisions on and my sitemap/task flows as a guide for which pages I needed to prioritize.
Sketching out my initial wireframes gave me a lot more freedom with the different design and layout options for each page. The consequences of changing/moving elements around on the page was so low at this stage that I had a lot of fun with it and tried to think of different ways I could best design each page.
The major pages I focused on:
Above are the key screens for my mid-fidelity wireframes. After some feedback from my mentor and peers, I digitized the sketches that would work best for my app.
Major Insights: I focused on the sketches that placed more value on the images. Many people commented that when they look through meal sites, they're primarily drawn to the images rather than text.
With my app being based upon healthy, conscious eating, I wanted to ensure my logo, colors, typography, and elements fit the overall brand image being natural, healthy, and inclusive.
If you're interested: You can look through my thought process on how I came up with the different components of this library :)
This process took multiple iterations, and all of them were in the best way. I had so much fun creating these high-fidelity pages using all the research and variations I gathered.
In order to keep track of where I iterated, I annotated any elements/features that I changed according to feedback that I received.
Happy noises: I was really excited to test this with actual users to see if my designs reflected what they were made to do. Despite the many iterations, they were all worth what I came up with in the end. Feedback from my mentor and peers have taught me how valuable it is to gain input from others as even the smallest thing can slip past you.
Summary: User testing was conducted with 5 participants who went through the 3 task flows I created in the "define" stage. Some of these participants were the same people I interviewed for my initial research and they were looking forward to how the final product turned out.
Figma's prototype feature allowed me to create a usable, testable prototype of the high-fidelity screens I created.
Interview Method: Zoom (shared screen)
Interview Duration: 20-40 minutes
To ensure the feedback from my participants was as accurate as possible, I stayed quiet for most of the testing and let the participant navigate as they would. I got the best feedback when my participants were voicing their thoughts aloud while completing each flow.
I gathered all this feedback into a FigJam file (much like my affinity map after user interviews). All my feedback was organized by flow into 3 sections: what worked, what could change, and a prioritization graph.
Major Insights: Much of the feedback I received were minor changes that I easily implemented into my pages. Despite this, they had dramatic, positive impacts that gave my designs a cleaner and professional look.
Phew.. That was a whole lot :)
Major Insights: Throughout this project, I've learned so much and have gained so much more confidence in the design process. Research is such a fundamental part of the process that I never realized and it was the main driving force for the entirety of Healthy Spoon!! Although I initially felt quite dull about the research process, I understand how important it is in giving meaning to our designs.
More time with Healthy Spoon?: I definitely wish I could've added more features to what I already created. One of my participants in user testing mentioned that the onboarding process could feel more inclusive to people who don't have dietary restrictions (so include meal preferences like "Italian cuisine" or "Asian cuisine"). Despite this, I'm proud of what I've made and I can't wait to apply what I've learned to my future projects.
If you want an overview of all the pages in my final version, click below :)
