WH Tai Wei Hang
Back to work

FitFuel Diary

Nutrition tracking without the spreadsheet feeling.

A solo-built mobile/web wellness app with smart meal logging, auth, cloud sync, recipes, charts and records.

Role
Solo Product, UX, Full Stack
Platform
Mobile and web
Stack
React Native, Expo, Supabase, APIs
FitFuel dashboard showing calories, macros, hydration, and daily progress
Problem Tracking is too manual.

Food, macros, hydration and habits create friction.

Approach Logging becomes guidance.

Meals, photos, goals and ingredients become feedback.

Build Built front to back.

Auth, user records, sync, cache, meal parsing, recipes, charts, deployment.

Problem

Healthy habits should not feel like admin.

Users need quick logging, clear progress, and useful recommendations.

Solution

A warmer system for daily health tracking.

Natural-language logging, photo input, goals, recipes, charts, auth and user specific cloud records.

FitFuel today dashboard with calories, macros, water, workouts, and micronutrients
Today dashboard
FitFuel smart meal logging screen with generated nutrition values
Smart meal logging
FitFuel recipe assistant with ingredient suggestions and healthier swaps
Recipe assistant
FitFuel records page with weight and calorie history charts
Records charts

Meal Capture

Meal input feeds the product, not a chat window.

Meal text and photos become structured calories, macros, micronutrients and diary records.

  • Natural input over manual food search.
  • Photo upload for fast logging.
  • Fallback parsing for resilience.
FitFuel meal log result connected to the diary
Meal log result

Key Features

Smart Meal Logging

Text or photo input instead of item-by-item search.

Recipe Assistant

Pantry ideas and healthier swaps.

Personal Goal Calculator

BMI, calorie, and water targets from onboarding.

Records and Charts

Weight and calorie trends over time.

Cloud-Synced Accounts

User-specific records with Supabase auth.

Design Decisions

Separate logging from recommendations.

Meal Log changes the diary. Recipe suggestions stay suggestion-only.

  • Warm palette, less clinical.
  • Bottom tabs for core habits.
  • Cards for scannable health data.
  • Empty, loading, fallback and reset states.
FitFuel wellness card showing compact health information hierarchy
Wellness card hierarchy

Tech

Solo full-stack mobile/web build.

  • React Native and Expo
  • Supabase authentication
  • User-specific cloud sync
  • React Context state
  • AsyncStorage cache
  • Gemini meal parsing
  • Spoonacular recipes
  • react-native-svg charts
  • API fallback handling
  • Deployment configs

Reflection

Habit products need calm, trust, and resilience.

The biggest lesson was building for real use: failed APIs, missed days, saved data and returning users.