CalTract — Calorie Banking App Landing Page

A simple, fast landing page for an upcoming fitness app where calories behave like money: income = food, withdrawals = exercise, and your goal is a “saved” weekly deficit. Includes an early-access email capture.

Live Demo Screens
Role: Full-Stack Developer
Stack: HTML · CSS · JavaScript · PostgreSQL · Flask
Scope: Landing Page · Early Access Form · Concept UX
2025

Project Overview

Goal

Present a clear landing page for a calorie tracking app that turns fitness progress into a savings-style experience, encouraging consistency and long-term engagement.

Approach

Designed a bold and minimal landing page that explains the “Bank Your Deficit” idea through simple visuals and taglines, includes a signup form for early access, and uses interactive elements to make the metaphor feel tangible and memorable.

Key Features

Calorie Banking
Daily “balance”, deposits (meals), withdrawals (workouts), and a weekly savings goal.
Goals & Streaks
Weekly target (deficit), progress rings, and streak tracking to build consistency.
Weekly Reports
Simple charts showing intake vs. burn and “net saved” calories.
Gentle Nudges
Smart prompts when balance goes negative or you’re near the goal.
Early Access
Lightweight email capture so interested users get onboard first.

Architecture at a Glance

Frontend
HTML · CSS · JS
Backend
Flask (Gunicorn)
DB
PostgreSQL
Storage
Supabase
Hosting
Static + CDN
Future
OAuth · Devices Sync

→ Landing → Early-access form → Store email → Notify at launch

Notables

  • Form is wired to a simple endpoint Flask to stay low-cost.
  • Supabase table keeps emails for future invites and private beta.
  • Clean, reusable section layout matching the rest of the portfolio.

Screens

Outcomes & Learnings

Functional Prototype
Built a working email signup endpoint that stores entries in the database, includes duplicate checks, and returns clear success or error states.
Clean UI
Designed a minimal, visually balanced landing page that clearly explains the concept and guides users to sign up with ease.
Backend Integration
Gained hands-on experience linking frontend forms to backend logic, handling validation and database interaction through a lightweight Flask setup.