Most modern fitness apps focus on superficial numbers—counting calories, tracking steps, or pushing people to lift heavier. At the same time, online fitness advice is flooded with generic information that often ignores individual safety constraints.
I was inspired by a simple goal: to build something that actually helps people.
Every year, millions of gym-goers suffer preventable injuries (such as lumbar herniation or knee strains) simply because they lack access to real-time feedback or can't afford a personal trainer. As a university student, I don't have the budget for expensive coaching either, and I am also trying to build practical, real-world skills to start earning some money. I wanted to democratize injury prevention. My inspiration was to create a safe, intelligent health workspace that acts as a real-time joint guardian—offering professional form coaching and adaptive workouts that respect the user’s physical limitations.
How I Built It It was tough btw, i almost cried.
I built a full-stack, responsive web application engineered for speed, reliability, and safety:
The Core Engine (Computer Vision): I integrated MediaPipe Pose on an HTML5 canvas to track human skeletons in real-time through the device's camera. The Frontend: Built with React and Vite utilizing pure CSS for a premium, high-fidelity dark-mode interface. It features a guided onboarding wizard, a dual-pane consultation layout, and responsive layouts designed for mobile screens. The Backend: A robust Node.js/Express server handling API sanitization, custom database operations (db.json), and rate limiting. The Intelligence Layer: I connected the workspace to Google's Gemini API. To safeguard users, I implemented Bio-Risk Shields (Knee, Spine, and Shoulder) which dynamically inject safety instructions into the LLM prompt payload, warning users against dangerous exercises.
Biomechanics & The Math To analyze squat depth and joint posture, I calculated joint angles on the client side using vector geometry. Given three 2D joint coordinates—A(x 1 ,y 1 ) (Hip), B(x 2 ,y 2 ) (Knee), and C(x 3 ,y 3 ) (Ankle)—I construct the vectors:
BA
=⟨x
1
−x
2
,y
1
−y
2
⟩
BC
=⟨x
3
−x
2
,y
3
−y
2
⟩
The angle θ representing joint flexion (in degrees) is calculated using the dot product and vector magnitudes:
θ=arccos( ∥ BA ∥⋅∥ BC ∥ BA ⋅ BC
)× π 180 (Why does my maths looook terrible hereeee).
If the knee flexion angle θ<90∘, the system flags that the user has reached full squat depth. If the center of mass deviates significantly or lumbar curvature exceeds threshold limits, the system triggers a visual alert warning of spinal rounding.
What I Learned
Edge Biomechanics: I learned how to map coordinates from video frames to real-time joint-angle measurements in JavaScript, turning a webcam into a biomechanical diagnostic tool. LLM Guardrails & Prompt Safety: I learned how to enforce strict safety behaviors on Large Language Models. Designing strict rules that force the AI to redirect users to medical emergencies or decline giving medical diagnoses taught me how to build reliable, safety-first AI. Responsive Mobile Architectures: Building a dual-pane dashboard that looks like a premium medical terminal on desktop but collapses cleanly into a scrollable, thumb-friendly viewport on mobile devices.
Challenges I Faced & Overcame
The Mobile Camera Barrier: During local testing, I discovered that mobile browsers block camera access (getUserMedia) on regular HTTP connections. To fix this, I deployed the backend to Render and the frontend to Vercel to obtain free HTTPS certificates, instantly enabling mobile camera scanning.
Security Guardrails in Code: I ran into GitHub's Push Protection rules when my initially hardcoded test keys were blocked during a repository push. I corrected this immediately by routing keys through environment variables and scrubbing the git history via a commit amend.
Also before i forget, i also ran into a rate limiting on my free gemini API teir, I overcame.
Log in or sign up for Devpost to join the conversation.