Freshi — iOS
Case Study
Designing a meal and recipe-sharing app that simplifies the process of deciding what to eat by providing recommendations from trusted sources in users' communities and on the web that can be filtered to meet any dietary needs.
Team
Product Manager & Engineer: Casey Roby
Product Designer: Dylan Cameron
Duration
5 months
Key Skills
Product design, ideation, sketching, information architecture, user interface design, interaction design, prototyping, illustration
Try the interactive prototype
Choosing your next meal can be a paralyzing endeavor.
Problem
With so many factors - diet, budget, preference - and too many unvetted recipes, choosing your next meal can be a paralyzing endeavor. Freshi lets you share and browse recipes in your trusted community, so you'll never feel stuck again. After all, meals are meant to be shared.
Vision
Freshi is a collaborative project created by Casey Roby and myself during the Covid-19 pandemic. Inspired by the food-sharing group chats that we had with friends, we spent the winter and spring of 2021 working toward a vision of a platform for users to browse, share, and create recipes within the context of a larger recipe-based social network.
Brief
Freshi is an iOS app designed in Sketch App and built with SwiftUI. A considerable amount of time was spent on accessibility standards, and backend + database construction, as well as UI elements like light and dark mode functionality, and screen size optimization. A system was constructed to allow users to create their own recipes and understand the nutritional benefits of their ingredients using a comprehensive food and nutrition database. In order to ensure accuracy and scientific legitimacy, the food database syncs data directly with the FoodDataCentral USDA database
I want to know what to eat so that I can feel and look good.
Research
Competitive Analysis
A competitive analysis was conducted with competitors PlateJoy, MyPlate, SideChef, Cookpad, Yummly, Paprika, and RecipeKeeper. The results of the competitive analysis can be found here.
Interviews
Interviews were conducted to validate the assumption that deciding what to eat is a hard problem that people are willing to pay to resolve. In order to pivot the product to be more helpful to more people, the goal was to understand more about the problems and stresses that people have around food, meals, and meal preparation. The customer interview question bank can be found here.
Results
The results of the interview process were synthesized into trends and compiled into an overarching user problem statement.
It's hard to eat healthy because:
- It takes too much brain power to decide what to eat. It's difficult to balance meals, exclude foods that hurt you, include foods that are good for you, know the foods that hurt you, and know the proper serving size of a meal
- It takes too much time to cook every meal. Cook time is too long, and it's hard to shop
- It costs too much to eat fast, healthy meals
- It's difficult to shop for food for one person, and can lead to food waste
- It's hard to feel motivated to cook for one person
- Maintaining a healthy relationship with food is difficult without moving into a relationship of calculation, control, and restriction
My process to cook and eat looks like this:
- Learn about food & health benefits
- Find a good recipe site
- Look at ingredients for things I like
- Look at ingredients for things to avoid
- Look at calories for nutrition and facts
- Look at reviews
- Choose a recipe
- Make a grocery list
- Search for a grocery store that has all ingredients
- Maybe make multiple stops for groceries to find what is needed
- Cook
- Eat
- Share food
User Problem
Solution
Make choosing your next meal the easiest decision of your day.
Feature Brainstorm
- Nutritional breakdown of your meals
- Meal plans with nutritional breakdowns
- Crowd-sourced info on where to shop
- Ability to create and save safe or bad food lists based on filtering out: nutrients, foods, diets, calorie content, food categories
- Recommended meals based on time, money, diet, avoided foods, nutrients, food categories
- Ability to track food over time to view nutritional breakdown
- Ability to save, comment on, and share articles
- Ability to save, post, and create recipes
- Ability to see what other users are cooking
User Testing
Goals
Once we had our initial design, we wanted to gauge how easy it was for users to choose a meal from the home feed page by doing some user testing. We wanted to make sure we were on the right track before committing to an implementation.
Process
Freshi Home Feed Iteration 1 survey can be found here.
Results
Establishing trust in the quality of recipes is extremely important to the success of the platform. Prioritization of recipes from trusted publications, users, and sources is of critical importance in the beginning.
Trusted source information must be highlighted in the design so that users know which recipes to try. Include a picture, ingredients, and recipe source in recipe card.
Feed should be changed to make meal illustrations more abstracted so that they meet the iconographies of all users' dietary restrictions (i.e.: no fish or meat illustrations included)
Additional ideas of note: the ability for users to filter based on cuisine type. The ability for users to filter for bulk meals.
Wireframes & MVP
Wireframes
The progression of wireframe sketches as customer research was conducted and the MVP was refined
Prototype
A prototype of the Freshi MVP was built for Light Mode, and Dark Mode.
Monetization
plan
Several ideas were considered for monetization. 'Freemium', pay-wall, and subscription.
Designed with light and dark mode functionality
Interface Design
Style guide
Implementation
Process & Artifacts
For product team planning documentation & notes, including task backlog, roadmap, engineering system notes, color organizer, and engineering team documentation, click here.
Architecture
Casey Roby was responsible for the architecture.
Stack
Platform: AWS Elastic Beanstalk
DB: AWS PostgreSQL
Backend: Django / Python (used Django Admin as a CMS)
Frontend: React / Node.js (meant to be used for website later)
iOS App: SwiftUI
Asset storage: AWS S3 bucket
Integrations
Sendgrid to handle password reset emails.
Kind of like an integration: built a sync where you could upload updated USDA nutrition factsheet CSVs into the S3 bucket and run a sync through Django Admin to update our nutrition facts and food data. I know APIs like this exist, but they were either too expensive, or they wouldn’t let me access the data in the way that the project required.
Outcomes
Accomplishments
Below is a screen recording of what we implemented by the time we stopped the project. We had finished the logged-out experience, including all of the infrastructure to support user accounts, logging in/out, signing up, and password resets.
View the dark mode demo here.
Decision to end project
Our lives suddenly got very busy, so we decided to pause the project. During this time, I earned my product management certification with the goal of learning more about business strategy and what makes a product worth building. Once I completed it, we determined that Freshi is a great idea that could be helpful to many people, but it seemed difficult to make it profitable without funding and/or selling user data—neither of which appealed to us.
