Metriful

Track meals. Close rings. Own your day.

AI-powered nutrition & workout platform — camera-first meal logging, Apple-Watch-style activity rings, and a three-model AI pipeline that turns a photo of your plate into macro breakdowns, personalized goals, and vector-similar recipe recommendations.

Live App · App Store · Architecture · AI Pipeline · Design Philosophy · Engineering Highlights

---

Snap your plate → AI macros + glycemic load + personalized goals + recipe recommendations, in under 5 seconds.

---

On mobile

Landing Camera-first hero, Apple Fitness-style ring metaphor.	AI meal review Photo → instant macros: 3000 kcal, 205g protein, 164g carbs, 149g fat.	Item-level breakdown Per-item kcal/macros + estimated blood-sugar impact (GL 79).

On the web

Dashboard — Bento-grid landing inspired by Apple WWDC '24 + Linear, with a glass-morphism nav and the same daily-plan flow as iOS.

Workouts — YouTube-API-backed exercise library with intelligent search by focus / duration / equipment.

Recipes — Vector-similarity recommendations using OpenAI embeddings stored in pgvector; "what should I cook tonight" answered against your nutrition history.

---

Why it exists

Traditional calorie-tracking apps (MyFitnessPal, Lose It!) are database-search-first — every meal is 6+ taps of typing, scrolling, and unit conversion. Adherence collapses inside two weeks. Newer apps (Noom, MacroFactor) replace search with coaching but keep the same friction floor.

Metriful's bet: the friction floor itself is the bug. If logging a meal takes longer than eating it, the data never lands. So:

• Camera-first: snap → 5 seconds → done. Three taps from launch to logged.
• Single composite score: Whoop-style 0–100 daily score replaces six numbers nobody reads.
• Loss-aversion retention: Duolingo-style 5-tier streak badges + Apple-Watch ring "closing" cues drive daily return without nag notifications.

Secondary positioning: T2D / metabolic health users who need consistent low-friction logging that incumbent apps actively under-serve.

---

What makes it different

	Metriful	MyFitnessPal	Noom	MacroFactor	Lose It!	Yazio
AI Meal Photo Scan	Gemini Vision	manual DB	—	—	basic	basic
Personalized AI Goals	Gemini LLM	—	coach (human)	algorithmic	—	—
Vector Food Recommendations	pgvector + OpenAI	—	—	—	—	—
Apple-Watch-style Rings	Reanimated SVG	—	—	bar charts	—	—
Daily Composite Score (0–100)	Yes	—	—	—	—	—
Exercise Video Library	YouTube API	—	—	—	own DB	—
Glass-morphism UI System	Yes (full)	—	—	—	—	—
Apple Sign In	✓	✓	✓	✓	✓	✓
Pricing	Free → $9.99/mo	$19.99/mo	$70/mo	$11.99/mo	$39.99/yr	$6.99/mo

Three unique differentiators no incumbent matches:

1. Multi-model AI stack as product narrative. Gemini Vision and Gemini LLM and OpenAI embeddings working together — not one vendor, one pipeline.
2. T2D-aware nutrition signals. Estimated glycemic load surfaces alongside macros; competitors hide or omit this entirely.
3. Zero-typing flow. Logging a meal averages <5 seconds end-to-end. The closest competitor (Lose It! Snap It) averages 18+ seconds because it falls back to a database picker.

---

The three-model AI pipeline

                                      ┌──────────────────────────┐
   📷  user snaps a meal photo  ──▶   │  Gemini Vision (1.5)     │  ── identifies foods, portions
                                      └────────────┬─────────────┘
                                                   ▼
                                      ┌──────────────────────────┐
   📊  macro & GL calculation  ◀──    │  Backend nutrition svc   │  ── joins USDA + cached embeddings
                                      └────────────┬─────────────┘
                                                   ▼
                                      ┌──────────────────────────┐
   🎯  daily goal generation    ◀──   │  Gemini LLM (Pro)        │  ── reasons over 7d history + body comp
                                      └────────────┬─────────────┘
                                                   ▼
                                      ┌──────────────────────────┐
   🍽️  recipe recommendations  ◀──    │  pgvector cosine search  │  ── OpenAI text-embedding-3 vectors
                                      └──────────────────────────┘

Why three models, not one? Each is best-in-class for its job and the cost profile is dramatically different:

• Gemini Vision — cheapest top-tier multimodal for food recognition; $0.0001/image.
• Gemini LLM — long context (1M tokens) lets us pass the user's full week of history into goal generation in a single call.
• OpenAI text-embedding-3-small — the cosine-similarity gold standard for recipe vector search; embeddings cached forever in pgvector so cost is one-time per recipe.

---

Architecture

┌──────────────────────────────────────────────────────────────┐
│  Frontend                                                    │
│  React Native 0.81 · Expo 54 · TypeScript 5.9                │
│  iOS (App Store) + Web (single codebase)                     │
│  Reanimated 4 · react-native-svg · expo-blur · expo-image    │
└────────────────────────────┬─────────────────────────────────┘
                             │ REST + WebSocket
┌────────────────────────────▼─────────────────────────────────┐
│  Backend                                                     │
│  Spring Boot 3.3 · Java 21 · Gradle                          │
│  Spring Security + JWT · OAuth2 (Apple, Google)              │
│  Caffeine (hot cache) + Redis (shared cache)                 │
│  Flyway migrations · OpenAPI 3 spec                          │
└────────┬────────────────────┬───────────────────────┬────────┘
         ▼                    ▼                       ▼
┌────────────────┐  ┌──────────────────┐  ┌─────────────────────┐
│ PostgreSQL 16  │  │  Redis (cache)   │  │  Cloudflare R2      │
│ + pgvector     │  │                  │  │  (S3-compatible     │
│ (embeddings)   │  │                  │  │   image storage)    │
└────────────────┘  └──────────────────┘  └─────────────────────┘
                             │
┌────────────────────────────▼─────────────────────────────────┐
│  AI Layer                                                    │
│  Gemini Vision (meal photos) · Gemini LLM (goals)            │
│  OpenAI text-embedding-3-small (recipe vectors)              │
│  YouTube Data API (exercise videos)                          │
└──────────────────────────────────────────────────────────────┘
                             │
┌────────────────────────────▼─────────────────────────────────┐
│  Infra                                                       │
│  GCP Cloud Run (au-southeast2) · auto-scale 1 → N            │
│  GitHub Actions → Docker → GCR → Cloud Run                   │
│  Supabase managed Postgres · Cloudflare Pages (web)          │
└──────────────────────────────────────────────────────────────┘

Repo layout (monorepo):

Metriful/
├── backend/        Spring Boot 3.3 · Java 21 · Gradle (REST API + WebSocket)
├── frontend/       React Native 0.81 · Expo 54 (iOS + Web)
├── infrastructure/ docker-compose · supabase stack · cloudbuild.yaml
├── docs/           Architecture, design philosophy, release runbooks
├── scripts/        DB seed, ETL (USDA), deployment, smoke tests
└── .github/        CI workflows (build, test, deploy)

---

Design philosophy — every component is intentional

Every UI component is modeled after a proven pattern from a top-tier consumer app. Not aesthetic copying — each choice solves a specific UX problem.

Component	Inspired by	Why this pattern
Nutrition Rings	Apple Watch Activity Rings	Multi-metric progress at a glance without reading numbers — full 360° animated SVG arcs with rounded caps and Apple's signature "ring closed" overlap shadow when you exceed 100%.
Daily Score (0–100)	Whoop Recovery / Oura Readiness	Single composite metric reduces cognitive load — users check one number instead of parsing six. Weighted blend of calories + macros + hydration + streak.
Daily Tasks	Noom Daily Lessons / Duolingo Daily Quests	Micro-tasks create habit loops; completion dopamine drives retention.
Streak Badges	Duolingo Streak / Snapchat Streaks	Loss aversion is the strongest retention lever in consumer apps — five milestone tiers with flame animation.
Bento Dashboard	Apple WWDC '24 + Linear App	High information density without visual overwhelm; cards "breathe." Glass morphism via backdrop-filter: blur(20–40px).
Liquid-glass Tab Bar	iOS 26 Liquid Glass	Platform-native premium feel; expo-blur intensity 56 + specular highlight + floating camera FAB.
Quick Log Bar	Spotify Search Bar / Instagram Story Camera	Zero-tap access to the primary action; reduces logging friction to <3 seconds.
Brand colour #F97316	Strava / Nike Training Club	Orange = energy + warmth; differentiates from medical-blue (MyFitnessPal) and clinical-green (Noom).
Dark-mode #A78BFA	Discord / Figma	Violet feels premium in dark contexts; avoids generic blue-on-dark.
Trend Charts	Apple Health weekly view	7-day rolling window is actionable; longer ranges feel academic.

---

Engineering highlights

AI / ML

• Integrated three AI providers (Gemini Vision, Gemini LLM, OpenAI Embeddings) into a single pipeline — photo → recognition → nutrition computation → personalized recommendations — with each provider chosen for its cost / capability fit, not vendor lock-in.
• Implemented vector similarity search using pgvector + OpenAI text-embedding-3-small for food and recipe recommendations; embeddings cached on first generation so recurring queries are sub-millisecond.
• Built an AI goal generation system that adapts to the user's nutritional history, body composition, and stated objectives by passing a 7-day window into Gemini's 1M-token context in a single call.

Backend

• Architected a Spring Boot 3.3 / Java 21 REST API with Redis (shared) + Caffeine (local hot cache) two-tier caching, OAuth2 (Apple Sign In + Google), Flyway-managed Postgres migrations, and OpenAPI-spec-driven contracts.
• Designed a PostgreSQL schema with pgvector for embedding storage and cosine-similarity queries, enabling semantic recipe search without a separate vector DB.
• Built a USDA FoodData Central ETL pipeline seeding ~400k canonical foods + macro micros, joined to AI recognition output for accuracy verification.

Frontend

• Built a cross-platform React Native 0.81 + Expo 54 app with TypeScript strict mode — single codebase ships to iOS (App Store) and Web with no per-platform forks for the data layer.
• Implemented a custom glass-morphism tab bar with backdrop-filter: blur(), specular highlights, and Reanimated 4 spring animations (damping 12, stiffness 150).
• Built a responsive Bento-grid dashboard with animated SVG charts (custom Apple-Watch-style activity rings using Reanimated useAnimatedProps driving strokeDashoffset on the UI thread, with <feDropShadow> overlap effect for closed rings).

Infra & DevOps

• Deployed containerized backend to GCP Cloud Run (au-southeast2) with GitHub Actions CI/CD, multi-stage Docker builds, and 1 → N auto-scaling.
• Configured Cloudflare R2 (S3-compatible) for image storage with presigned URL uploads, materially reducing egress cost vs S3.
• Set up Supabase managed Postgres with connection pooling for production database management; local dev runs the same image via docker-compose.

Product & Design

• Designed and shipped a consumer health app to the App Store (Metriful, AU) with AI-powered meal recognition, gamified habit tracking, and a Whoop-inspired daily health score.
• Built a design system with glass morphism, animated SVG nutrition rings, and 5-tier streak badges modeled after Duolingo's retention mechanics.
• Conducted competitive analysis vs 6 incumbent fitness apps (MyFitnessPal, Noom, MacroFactor, Fitbod, Lose It!, Yazio) to identify and fill feature gaps — the differentiator table at the top of this README is the result.

---

Run it locally

Prerequisites

• Java 21+ · Node.js 18+ · PostgreSQL 16 with pgvector · Docker · Xcode (iOS) or Android Studio (Android)

Setup

git clone https://github.com/Eliaaazzz/Metriful.git
cd Metriful
npm install
cp .env.example .env  # then fill in API keys
npm run docker:up     # spins up Postgres + Redis

Run

# Backend (Spring Boot, port 8080)
npm run backend:run

# Frontend (Expo, choose target)
npm run frontend:ios     # iOS simulator
npm run frontend:android # Android emulator
npm run frontend:web     # browser at localhost:8081

Test

npm test                # full suite (backend + frontend)
npm run backend:test    # JUnit + integration
npm run frontend:test   # Jest + RTL

Build & deploy

npm run backend:build         # Docker image, push to GCR
npm run frontend:build        # web bundle into frontend/dist
npm run deploy:hosting        # Firebase Hosting / Cloudflare Pages

See cloudbuild.yaml and firebase.json for the production deploy contracts.

---

Roadmap

	Status
iOS App Store launch	✅ Live (id6760930295)
Web app	✅ Live at aurafitness.org
Camera-first AI meal logging	✅ Shipped
Apple-Watch-style activity rings	✅ Shipped
Vector recipe recommendations	✅ Shipped
YouTube workout library	✅ Shipped
Android (Google Play)	🚧 In review
RevenueCat subscription gating	🚧 In progress
HealthKit / Google Fit integration	📋 Planned
Apple Watch companion app	📋 Planned

---

Acknowledgements

Built with Spring Boot, React Native, Expo, PostgreSQL, pgvector, Reanimated, react-native-svg, Google Cloud Run, Cloudflare R2, Gemini, and the OpenAI API.

App Store and Google Play badges are official artwork from Apple and Google, used per their respective branding guidelines.

---

License

Proprietary · © 2026 Metriful. All rights reserved.