nomstay-low-fid-to-high-fid-wireframes

What inspired this project?

Upon reflection in my own kitchen, I wondered who else had this problem: Finding / Deciding what to eat and then cooking that meal at home using what you already have.  I also wanted to inventory what I have so I don't buy that 3rd container of garlic powder.  I asked over a 1000 people a simple question:

Have you've ever bought an ingredient at the store only to find you've had it all along?

Chart-1

By conducting research via Google surveys and interviews, we can gain valuable insights into what people want from a recipe app. Armed with this information, we can create an app that provides users with recipes that suit their tastes, dietary requirements, and ingredient availability. Ultimately, the goal is to help people enjoy cooking by making it more accessible and inspiring.

Empathy Map

Portfolio-Website.006
empathy-map-mobile

An Empathy map above shows what the home chef thinks. Are the recipes any good? Do they have options for my diet? and what is the cost? They feel undecided of what to eat, feel helpless, and sick of wasting money on delivery apps. Lastly, they say that they need to easily inventory what food they have in their kitchen, have recipes based off of said inventory, and they want to save time/money.

Portfolio-Website.007

According to the Google Form survey with over 1200 participants, Over 43% of users felt like they waste too much food. Greater than 2/3rds of users buy an ingredient at the store only to find out they had it at home all along.6 out of 10 people prefer to cook alone instead with other people. 61% prefer to follow recipes as opposed to follow ingredients.

Portfolio-Website.008

After compiling the large amount of data, we discover 3 main insights.  1. Users prefer to follow a recipe but are challenged to find a recipe in a timely manner.  2. Most users needlessly bought an ingredient when they had it at home all along.  Half of those people feel that they needlessly waste food.  3. They enjoy grocery shopping for ingredients but are challenged to find recipes that are simple and healthy.

nomstay-insights-mobile
Portfolio-Website.009

Personas

Compiled from the research, we have 2 persona examples below. One is Elbert Fields. He is a 48 year-old Sales Manager that works most of the time. His goals are to eat healthy, make home meals that are quick/easy, and wants a recipe app to help along the way.  Elbert is frustrated with a overall lack of time to plan meals. He also often forgets what he has in his fridge or pantry.

personas-nomstay-updated.001

The other persona is Mia Ashley. She is 37 and a stay at home Mom. Mia is a passionate cook and takes pride in preparing delicious/healthy meals for her family. Her Goals are to streamline her meal planning process, find a better way to manage recipes, and plan those meals in advance.  Mia's pain point is having limited time to try out new apps and the ones shes tried were too complicated.

personas-nomstay-updated.002
Portfolio-Website.014

Based off a site map, I developed a user flow with one goal. To update the inventory without butter and find a recipe to make now.  The app automatically adjusts its active filters based on available API information to show the user a list of meals with out butter. In this case, the app suggests a stir-fry recipe which is without the use of butter. 

Portfolio-Website.015

Once research is complete, we enter the design of the user interface. I start with quick sketches to bring ideas from mind to paper. Then I used figma to develop low-fidelity gray-scale wireframes. After I got everything was in prime placement for usability, I shifted to a final look and incorporated color, photos, and active icons.

Portfolio-Website.017
Portfolio-Website.018

Here is a style guide that gives a look and feel to the application along with inspiration for other products under the NOMstay umbrella for the future. 

Portfolio-Website.020

I went with a combination of Adobe's October Tamill and Google's Quicksand. My reasoning is that I wanted a font that was easy to read so I went with a non-offensive, curved, san-sarif font. This allows the font to be scaleable and versitile. The colors are based of a slightly darker orange. Warm colors are known to have subtle increase in hunger upon viewing in users. 

nomstay-typography-mobile
Portfolio-Website.021

Iconography

The Iconography is designed for simplicity and recognition. The icons to pair well with the curvy nature of the fonts without being overly complicated by default.

nomstay-iconography-mobile
Portfolio-Website.022

Logos

The logo is a piece of bread with a bite taken out of it. This is the "nom"  This shows the app is about food. The "n" represents NOMstay and its placement is like a door to a home symbolizing "stay". 

Eat the food, Nom, using what you have, Stay. 


nomstay-logos-mobile
Portfolio-Website.023

Usability Insights

Usability Testing was conducted with 5 different users online via Figma. Average users age range was from 29 to 46 years of age. All 5 users loved the look and feel of the prototype. Dan said, “I like the overall aesthetic.”    Also, there was high praise from another user named Zack, he said, “Its a solid app, i would use it, especially now that I am doing 90% of my cooking at home” There was some valuable feedback from Dan, “I’d pick a capitalization style and stick with it. The sign in page used lowercase while the rest of the app was mostly title cased. There was some inconsistency with the horizontal line under the title on some of the later pages.” 

Portfolio-Website.025

Below is a prototype of how the app would function in interactivity. I advise those who are using mobile to try this prototype on a desktop as Figma's embedded browser crops the phone in a weird way. Please enjoy and feel free to contact me if you have any productive feedback.

Next Steps

My goals for the future of this app is as follows.

  1. Partner with Software Engineers and Data Analysts to build a robust API for a recipe and ingredient database.
  2. Research and Development of AI technologies for a Camera Feature in the “Make It Now” functionality.
  3. Implement a wide variety of Usability Testing in Beta Phase.  4. Marketing Development for outreach on demographic user-base

Selected Works

NOMstayFood App: Make What is in Your Fridge

TransitPublic Bus App inspired by Frederick, MD

Oink AppSave Money. Get Out of Debt.

Linked In BannersFreelance Graphic Design