NutriWay

Nutrition made simple

Have you ever thought about what you eat and wondered "what can I do to eat better and lead a more well-balanced diet?" Who hasn't wanted to cook more but just sometimes...can't? NutriWay delivers healthy recipe ingredients customized to your needs to your door. No need to look elsewhere for motivation or inspiration on what to cook. Just create your profile, list any dietary and health restrictions, and NutriWay generates an entire menu of options for you. Track your nutritional progress and share it with a wellness coach for monitoring at your leisure. Convinced yet? Let's get cooking.

The Brief

The National Wellness Institute is a leading organization founded in 1977 with the mission of promoting 2 main things:

Health and wellness to all
Resources and services to wellness professionals

THE PROBLEM

Drop in memberships
Being behind on the mobile tech front
Unfamiliarity and overwhelmed by endless tech possibilities.

THE CHALLENGE

Help people adopt and maintain a healthier routine.
Create digital tools for Wellness coaches
Update their image

Objectives

HYPOTHESIS
We believe that by rebranding NWI’s image and creating an app that helps users take better care of their nutrition, we can push NWI in the tech front, give them a competitive edge against other online competitors, and help them increase customer retention.

BUSINESS METRICS

Time spent on the app
# of enrollments
# of downloads

UX Trajectory and Research

COMPETITIVE ANALYSIS
Comparing competitors in the wellness sector and their main features, what points can we focus on for opportunities? Here are a few that opened up great possibilities and points of differentiation for this project:

Healthy recipes
Nutrition Coach connector
Barcode scanner / Food Database
Customize Experience

COLLECTING RESEARCH & ANALYZING PAIN POINTS

Key take aways based on 140 survey responses and 8 interviews

After gathering all my quantitative and qualitative data, I organized all the research into an affinity diagram, where I was able to categorize the findings into sections and hone in on the 3 main pain points:

Lack of time to cook
Control (of what is being eaten/bought/consumed)
Discipline (to go to the grocery store, cook, clean, etc).

DEFINING THE PERSONA AND USER JOURNEY

A Persona is a representation of a type of customer.

I narrowed down my target user to develop a user persona, Caroline Colby, a 28-year old busy young professional who lives in New York and is constantly on the go with an occupied schedule. She is a Marketing Manager who works early mornings and late evenings, so her routine is very constricted. Her main goals are to eat healthier, save money and have more time to cook, but because of her crazy busy lifestyle, she ends up not having enough time to spare, gets home tired and lacks creativity when thinking about what to cook.

Caroline's User Journey tracks her typical steps every evening after she leaves from work. Throughout that time she has multiple low points, such as being exhausted, the anxiety of having to go through her same routine again the following day, the frustration of getting home and not having dinner prepped.

MOSCOW METHODOLOGY - A fantastic tool for Ideation and feature Prioritization

After analyzing Caroline's User Journey and ideating her opportunities, I used the Moscow methodology to prioritize the key features to be included in the app. I separated all features into Must, Should, Could, and Won’t haves. The features in orange (Must Have), were the ones chosen to be included into this first stage of the app and what led to the Minimum Viable Product (MVP), defining the user’s happy path.

The MVP is:
To purchase healthy recipe ingredients for home cooking and healthy eating.

Design: Let's talk about UI

USER FLOW

Having defined the MVP, I moved to planning NutriWay's User Flow, which is crucial before drafting out concept sketches as it works like a map to track the entire journey a user takes to complete a task or interact with a feature.

In this case, this user flow tracks the steps that a return user should take each time they interact with the app.

CONCEPT SKETCHES

And so begins the journey from hand drawn lo-fi's....

...to Mid-fi wireframes drafted on Sketch.

So now, let's talk about color

VISUAL COMPETITVE ANALYSIS

First, let's take a look at what colors and shapes are already being used out there...

This visual competitive analysis compares elements for NutriWay's 3 biggest competitors: Rise, My Fitness Pal, and Fitbit.

It is important to have a closer look at these elements in order to better understand the look and feel of these companies that are already hot on the market.

MOOD BOARD & STYLE TILE

Having seen the colors and different design styles already in use out in the market, I wanted to take a completely different approach to NutriWay.

So for the Moodboard, I chose bright, happy and inviting colors and images that convey the following key words: balanced, wholistic, fun, and motivating.

These words translated again onto the Style Tile, which defined further elements such as the fonts, logo, primary, secondary buttons and NutriWay's overall tone.

Both the Moodboard and the Style Tile were tested for desirability with 9 users resulting in the following quantitative and qualitative data:

100% of testers reacted positively to the colors and images.

“Colors are appetizing, has a herbalism and natura-pathic feel.”

20% of testers had minor constructive feedback.

“You have such a nice shade of hot pink in your pictures that I’d like to see more of that color in there.”

100% of testers reacted with similar words and meanings.

"I felt good just by looking at the color choices. I felt motivated."

STYLE GUIDE

After all visual elements had been chosen and established, I created a Style Guide using the Atomic Design methodology to showcase all the active, inactive icons, buttons, and navigation bars. I also included the color palette and logos used. The purpose of the Style Guide is to provide a reference to the design and development teams of all the elements used in a project. It serves as a guide in keeping all design elements consistent across the board.

And finally, the whole UX and UI journeys have led to defining the hi-fi screens :-)

In order to get to the Hi-fi's, NutriWay's wireframes were tested every step of the way. Here's a recap of some of the usability test results from lo-fi to hi-fi:

Hi-Fi Prototype

Check out NutriWay's prototype in action as the demo takes a return user through the entire happy path from landing page to progress check and chat with a nutrition coach.

Interested in learning more about NutriWay? Read my Medium post by clicking below.