Behavioral Science-Informed Caloric Tracking & Wellness Platform
How we built a progressive web application that rethinks personal nutrition tracking — replacing rigid meal-plan prescriptions with time-adjusted pacing algorithms, dynamic exercise-adjusted budgets, positive reinforcement architecture, and multi-temporal analytics.
Inside the App
Daily Dashboard
Calories, activity, adjusted target and time-adjusted pacing at a glance.
Hydration & Weight Progress
Paced hydration goals and weekly weigh-in tracking toward a goal weight.
Why 60–70% of Calorie Tracking Apps Are Abandoned Within 7 Days
Existing calorie tracking applications suffer from well-documented usability and retention failures. Rigid meal databases force users into time-consuming food search workflows. Static daily targets ignore the temporal distribution of intake. And binary success/failure framing — red for over budget, green for under — creates shame-based feedback loops that undermine long-term adherence.
The client needed an application that would address each of these failure modes through a fundamentally different approach — one rooted in behavioral science, not calorie obsession. The goal: a tool people would actually keep using.
Behavioral Sustainability Over Caloric Precision
◆ The Problem
A user who has consumed 800 kcal by 2:00 PM is in a fundamentally different position than one who has consumed 800 kcal by 9:00 PM — yet every major calorie tracking app treats these states identically. Combined with rigid databases, zero exercise credit, and shame-based feedback, most apps are abandoned within days.
◆ The Solution
We built a progressive web application with a time-adjusted pacing algorithm (minute-level granularity), dynamic TDEE calculation using the Mifflin-St Jeor equation, exercise-adjusted daily budgets, positive reinforcement architecture, integrated hydration monitoring, and four levels of temporal analytics — all designed around behavioral science principles that keep users engaged long-term.
TDEE Calculation Engine & Mifflin-St Jeor Implementation
The platform computes personalized Total Daily Energy Expenditure baselines using the Mifflin-St Jeor equation — the gold standard for BMR estimation — then augments this with real-time exercise adjustments.
BMR Computation
Mifflin-St Jeor equation with sex-specific formulas: (10 × weight_kg) + (6.25 × height_cm) − (5 × age) ± offset.
Sedentary Baseline
TDEE derived by applying a 1.2× sedentary multiplier to BMR. All additional physical activity is tracked and added separately.
Dynamic Budget Adjustment
When exercise is logged, estimated calories burned are added to the daily target in real-time — rewarding activity instead of penalizing intake.
Progressive Recalculation
As users log weight changes over time, the TDEE baseline automatically updates to reflect current body composition.
// Mifflin-St Jeor (Male)
BMR = (10 × weight) + (6.25 × height) − (5 × age) + 5
// Mifflin-St Jeor (Female)
BMR = (10 × weight) + (6.25 × height) − (5 × age) − 161
TDEE = BMR × 1.2 + Exercise Calories Burned
Time-Adjusted Pacing Algorithm
The platform's most technically distinctive feature: a real-time pacing system that contextualizes a user's caloric intake relative to the time of day — with minute-level granularity via linear interpolation between hourly markers.
Hourly Cumulative Intake Curve
Calibrated to typical eating patterns with linear interpolation providing minute-level precision between markers:
Five Pacing Status Classifications
The ratio of actual intake to time-adjusted expected intake yields five contextual statuses:
Hydration pacing follows an analogous system — tracking fluid intake against a weight-based goal of 33 ml per kg of body weight per day, with its own temporal distribution curve and real-time status indicators.
Six Integrated Platform Modules
Each module addresses a specific dimension of health tracking — from caloric intake to exercise, hydration, weight, analytics, and behavioral reinforcement — all interconnected through a unified data model.
Caloric Intake Tracking
- Flexible, user-driven logging (no rigid meal databases)
- Timestamped entries with meal category tags
- Quick-add modal with preset calorie increments
- Saved meal templates for single-tap re-entry
- Category-based filtering for contextual relevance
- Unified chronological timeline with exercise entries
Exercise & Activity Tracking
- Time-based activities using MET values × body weight × duration
- Distance-based activities with per-mile/km multipliers
- Intensity-adjusted calorie burn estimation
- Dynamic daily budget recalculation on log
- Color-coded timeline integration with intake entries
- Activity type library with preset categories
Hydration Monitoring
- Weight-based daily goal (33 ml/kg body weight)
- Time-adjusted hydration pacing curve
- Beverage type categorization
- Volume tracking with common presets
- Integrated logging alongside calorie entry
- Real-time status indicators and progress bars
Weight Tracking & Progress
- Goal progress calculation from start to target
- Weekly weigh-in reminders
- Chronological weight history display
- Long-term trend emphasis over daily fluctuations
- Intentional separation from calorie tracking
- Privacy controls via opt-out preference flags
Multi-Temporal Analytics
- Daily view: entry breakdown with time-adjusted pacing
- Weekly view: 7-day summary excluding incomplete day
- Monthly view: calendar breakdown with best-day recognition
- Yearly view: monthly aggregation with consistency scores
- All views exclude current in-progress day from averages
- Achievement highlights and trend identification
Behavioral Reinforcement Engine
- Positive reinforcement — zero shame-based feedback
- Contextual praise based on daily/weekly/monthly trends
- Daily Wins system recognizing positive behaviors
- Celebration animations triggered by balanced days
- Habituation-resistant messaging rotation
- Achievement tracking: 3+ meals, target hit, hydration met
Designed to Keep Users Engaged — Not Ashamed
Every UX decision was informed by behavioral science research on habit formation, positive reinforcement, and friction reduction — deliberately avoiding the shame-based patterns that cause most health apps to be abandoned.
Positive Reinforcement
Contextual encouragement based on balance, consistency, and trends — never punishment for going over budget.
Daily Wins System
Rule-based achievement identification: logging 3+ meals, hitting target, meeting hydration goals, completing exercise.
Friction Reduction
Saved meals for one-tap entry, preset calorie buttons, integrated hydration logging, and contextual category filtering.
Celebration Animations
Physics-based Framer Motion animations triggered by balanced days — creating positive dopamine associations with good habits.
Habituation Resistance
Rotating praise messaging system prevents the brain from 'tuning out' repetitive encouragement over time.
Weight Privacy Controls
Weight tracking intentionally separated from calorie tracking with opt-out flags — preventing unhealthy fixation on daily fluctuations.
Progressive 5-Step Onboarding Wizard
New users complete a guided onboarding flow that collects biometric data and generates a personalized TDEE recommendation — getting them from signup to tracking in under 2 minutes.
Basics
Age & biological sex
Body
Height & current weight
Goal
Target weight setting
Target
TDEE recommendation
Confirm
Review & start tracking
Six Core Entity Types
The application's data model is built around six interconnected entities — each serving a specific tracking dimension while contributing to unified cross-metric analytics.
User Profile
Biometric data, TDEE baseline, preferences, and onboarding state
Calorie Entry
Timestamped intake records with meal category tags and amounts
Exercise
Activity logs with type, duration/distance, intensity, and calorie burn
Hydration Entry
Fluid intake records with volume and beverage type classification
Weight Entry
Periodic weigh-in records with chronological history tracking
Saved Meal
User-defined meal templates for friction-free one-tap re-entry
Technology Stack & Performance
Frontend
React 18 with Vite build tool
Styling
Tailwind CSS utility-first responsive
Animations
Framer Motion (GPU-accelerated, 60fps)
UI Components
Shadcn/UI (Radix UI primitives)
State Management
TanStack React Query with optimistic updates
Backend
Base44 BaaS with real-time subscriptions
Authentication
Built-in auth with user management
Serverless
Deno-based backend functions
Design
Mobile-first (320px to 2560px)
Optimistic Updates
Instant UI feedback via TanStack React Query — no waiting for server confirmation
Scoped Queries
Date-range scoped data fetching to minimize transfer and maximize speed
Memoized Aggregates
Expensive statistical computations cached and recalculated only when inputs change
GPU Animations
Physics-based Framer Motion maintaining 60fps on mid-range mobile devices
Conventional Tracking vs. This Platform
What Makes This Platform Different
Your Health App Idea Deserves Behavioral Science, Not Just Features
Most health and wellness apps fail not because of missing features, but because of poor behavioral design. They punish instead of encourage. They track without context. They create friction where there should be flow.
This case study demonstrates what's possible when technical sophistication meets behavioral science: a platform where algorithms adapt to human patterns, feedback builds positive habits, and every interaction is designed to keep users coming back.
Whether you're building a nutrition tracker, fitness app, mental health tool, or any habit-forming platform, Kompani can help you design and build software that people actually keep using.