Inspiration

Workout tracking usually stops at numbers: sets, reps, and weight. That data matters, but it does not tell someone whether they moved well, stayed consistent, or trained in a balanced way.

We built Formline to bring a personal-trainer-like experience into the browser: an app that helps users train, track their progress, and get live form feedback from their camera.

What it does

Formline is an AI-assisted fitness tracker and form feedback prototype.

Users can create an account, choose an exercise, start a live training session, and use their camera while they work out. During a session, Formline uses pose detection to track movement, count reps for supported exercises, and display feedback from the backend.

When a set is completed, Formline saves it to Firestore. The dashboard then turns that workout history into weekly volume, muscle balance, recent sessions, and personal record trends.

How we built it

We built the frontend with React, Vite, and React Router. Firebase Authentication handles user sign-in, and Firestore Lite stores each user’s workout history.

The live form experience uses MediaPipe Tasks Vision in the browser to load a pose landmarker model, process camera frames, draw pose landmarks, calculate joint angles, and count reps from exercise-specific thresholds.

The backend is built with FastAPI and WebSockets. It receives rep and frame events from the frontend and sends feedback messages back to the session UI.

Challenges we ran into

One major challenge was getting persistent history working reliably. We ran into browser-blocked Firestore WebChannel requests, so we switched to Firestore Lite because our app only needs one-shot reads and writes.

We also hit Firestore permission errors while syncing sets. The frontend was correct, but the deployed Firestore rules were blocking reads and writes. Updating the rules to allow signed-in users to access their own workout logs fixed that path.

The computer vision flow also required careful handling around camera permissions, pose model loading, WebSocket timing, and noisy landmark data.

Accomplishments that we're proud of

We are proud that Formline connects several systems into one usable demo: authentication, live camera tracking, rep counting, set logging, Firestore sync, and a progress dashboard.

We are also proud that the dashboard reflects real user data instead of static mock data. Sets logged during training become progress charts and recent session history.

Another accomplishment is making the app resilient. If camera tracking or syncing fails, the app shows clear error states instead of breaking the workout flow.

What we learned

We learned that real-time browser ML is powerful but fragile. It is not enough to detect landmarks; the app also has to handle model loading, camera access, frame timing, cleanup, and imperfect rep thresholds.

We also learned how important Firebase security rules are. A correct frontend can still fail if the deployed rules do not match the app’s data model.

Finally, we learned that choosing the right SDK matters. Firestore Lite was a better fit than the full Firestore SDK because Formline currently uses simple reads and writes, not realtime listeners or offline persistence.

What's next for Formline

Next, we want to improve form feedback with better exercise-specific models and validated movement data.

We also want to support more exercises, improve rep counting accuracy, and add richer workout planning features like goals, streaks, recommendations, and adaptive programs.

Longer term, we want to deploy Formline with production-ready Firebase rules, backend hosting, monitoring, and a smoother mobile training experience.

Built With

Share this project:

Updates