NutriPath

Log In
Home
Fast-Food Remixer
Malnuritioning Assessment
Food Support Tab
Meal Builder + other Features
Action Hub

Inspiration

NutriPath was inspired by a simple gap we kept seeing: most nutrition tools are informational, but families under food and budget stress need immediate, practical next steps. We wanted to build something that answers, “What should I do right now?” using real household constraints.

What it does

NutriPath is an action-first nutrition intervention platform that helps families and caregivers:

detect nutrition risk early through a structured assessment
build better meals from foods they already have
remix fast-food cravings into healthier realistic alternatives
check nutrition claims with confidence + safer next action
find nearby verified support resources on a global map
track and compare assessment history over time (saved when logged in)

How we built it

We built NutriPath as a static, frontend-first web app using HTML, CSS, and vanilla JavaScript, then deployed it on Vercel.
Core logic uses rule-based scoring and practical decision flows instead of black-box outputs.
We added:

multi-page architecture (Home, Assessment, Resource Map, Meal Builder, Action Hub, Auth)
query-param focused tool views for fast, no-scroll workflows
global i18n with explicit Apply-language behavior
account-aware persistence (guest session-only vs logged-in saved history)
service worker caching for fast loads + offline resilience
graceful API fallbacks when external services are unavailable

Challenges we ran into

balancing clean UX with lots of functionality without creating a cluttered dashboard
making tool outputs useful even when third-party APIs fail or keys are missing
avoiding repetitive features across pages and keeping each tool’s purpose distinct
implementing consistent language coverage across many screens and states
ensuring guest vs logged-in behavior is clear and trustworthy

Accomplishments that we're proud of

built a practical, demo-ready intervention workflow in under 2 minutes
shipped focused single-tool views via URL tabs for faster decision support
added assessment snapshot comparison to track change over time
improved reliability with fallback logic instead of dead-end errors
delivered a polished dark UI with strong hierarchy and mobile usability

What we learned

We learned that for public-health UX, clarity beats complexity: short, direct guidance creates confidence and action.
We also learned how to design for constraints (budget, pantry limits, access barriers), not ideal scenarios, and how to keep a static app resilient with good state and fallback design.