Nutri — Your Ultimate Nutrition Companion

A responsive nutrition app and website empowering teenagers to build lifelong healthy eating habits — designed end-to-end.

Role

UX/UI Design

Industry

Retail & tecnology

Duration

3 months

Overview

Empowering teenagers to make healthier choices and enhance their nutrition knowledge through a responsive website and companion mobile app. Chosen as a self-directed project during Google's UX Design Professional Certificate.

Problem

"Revolutionizing Teenage Nutrition Education, Empowering 30 Million Teens towards Healthier Habits."

70% of teenagers lack reliable nutrition education resources, causing confusion and misinformation. A nutri-responsive website and app aim to revolutionize teenage nutrition education, reaching 30 million teenagers and promoting healthier habits.

The Solution

"Empowering Teenagers with Accurate Nutrition Knowledge and Healthy Habits for Lifelong Well-being"

Nutri is to empower teenagers with accurate nutrition knowledge and healthy eating habits through our responsive website and app. By providing accessible and engaging resources, personalised guidance, and a supportive community.

Design Process

The approach at each stage depended on the goal and what was required to move forward responsibly.

Grounding the Problem in Data

Statistical and behavioural insight gathered from business data, research papers and industry reports.

Talking to Real Teenagers

Interviews, surveys and competitor research surfaced consistent, first-hand pain points.

Getting Inside the User's Head

From Discovery to Daily Habit (User Journey Map)

The user journey is utilized to understand the user's perspective of the product, revealing potential frustrations and challenges they may encounter during their interaction.

Where Existing Apps Fall Short (Competitive audit)

Direct and indirect competitors (incl. MyFitnessPal, MyNetDiary, Lifesum and Ate) were evaluated. Consistent gaps stood out:

Crazy 8s: Quantity Over QualityEight ideas, eight minutes — one minute each. The goal was volume and unconventional thinking before converging on a direction.

Organising Content for Findability

Direct and indirect competitors (incl. MyFitnessPal, MyNetDiary, Lifesum and Ate) were evaluated. Consistent gaps stood out:

Sketching the Structure First

A Palette and Type System Built for Trust

A Quick, Personalised First Impression

The first interaction is made quick and easy. A short onboarding quiz personalises content, meal plans and daily recommendations from the very first session.

Splash & sign-up options
Account creation
Personalisation quiz

Daily Nutrition, at a Glance

The home dashboard surfaces calories left, water intake, meal plan for the day and quick access to logging — the highest-frequency actions get the least friction.

Calorie ring + macro breakdown per meal
Editable food-detail screen with nutrition facts
One-tap meal logging from the day's plan

The Fastest Path from Store to Log

The best food-tracking moment happens in the grocery aisle. Scanning a barcode adds the item and its nutrition facts to the food diary automatically.

Zero-search logging while shopping
Auto-fills nutrition facts instantly
Works for eating out too

Meal Plans that Fit Real Preferences

Users explore diet styles — low-carb, keto, Mediterranean, vegetarian, vegan — and swap individual meals within a plan, so structure never feels rigid.

Five diet styles to match personal goals
Per-meal swap without restarting the plan
Calorie & macro count on every recipe card

Mobile-First, Because Teens Are

The companion website was designed mobile-first. The homepage carries a strong hero, key app features, testimonials and App/Play Store links — scaling cleanly from phone to desktop while keeping brand consistency with the app.

45 Minutes That Reshaped Two Flows

An unmoderated usability session gave testers task-based scenarios. Recorded friction points directly informed two rounds of design changes.

"Adding New Recipes" Button

"I'm eager to add my recipes, but I can't find the button."

FIX

Made the add-recipe entry point persistent and visually prominent.

Add Ingredients to Shopping List

"Remembering ingredients for various recipes is overwhelming."

FIX

Added a one-tap 'add to shopping list' from any ingredient list.

Personalised Filter

"I'm looking for quick vegetable recipes, but how can I filter?"

FIX

Introduced a personalised, multi-select filter across prep time & diet type.

Impact, Learnings

Impact

"The user-friendly interface and engaging content of Nutri motivated me to make healthier food choices and inspired me to share what I learned with my friends." — usability study participant."

What I learned

Understanding teenagers' specific motivations, obstacles and desired features — through direct research rather than assumption — shaped a far more personalised solution than a generic nutrition app.