-
-
Xp Counter Which Will Help You Level Up
-
Extra Option Like Changing The Avatar Images
-
Themes Of Personal Selecion And More New To Be Added
-
Main Home Page For Current Day Exercise And Diet
-
Badges For Streak Completion With 3d Extrude Effect
-
Heatmap Section With Box To Add More Motivation Using Streak And Badges
-
Add The Pain Area Simply By Clicking The Point And Set The Intensity Of Each Pain Area
Inspiration
Generic fitness apps provide cookie-cutter workout routines and generic meal plans, often failing to account for personal nuances—especially physical constraints, minor injuries, or hyper-specific regional diet preferences. We realized that getting a plan tailored around a bad knee or an authentic cultural diet usually requires paying for an expensive human physiologist and dietitian. Zephyr-Fit was born out of the desire to democratize that level of personalization. We wanted to build a holistic, gamified platform where AI acts as your personal health expert, crafting truly adaptive plans based on your body's specific pain points and your region's culinary culture.
What it does
Zephyr-Fit is a highly personalized, AI-powered 7-day fitness and nutrition planner. Through a comprehensive onboarding flow, users define their vitals, diet style, activity level, and equipment access. Most uniquely, users interact with a visual Anatomy Map to highlight specific body constraints and rank their pain severity (Mild, Moderate, Severe).
Using Gemini (Google GenAI), Zephyr-Fit then crafts a fully tailored 7-day workout schedule and a 4-meal daily diet plan.
The Workouts dynamically adapt to your pain levels by cross-referencing contraindications—reducing sets/reps for mild pain, or entirely swapping out exercises that strain severely injured joints. The Nutrition Plan strictly adheres to the authentic, traditional cuisine of the user's home country instead of defaulting to generic "fitness foods" (like chicken and broccoli). As users check off their daily workouts and meals, they gain XP, build up their current and longest streaks on a GitHub-style activity heatmap, and unlock celebratory achievement badges.
How we built it
Frontend: We built a React Single Page Application (SPA) using Vite. We styled it with Tailwind CSS and used Framer Motion for smooth, sci-fi/ambient page transitions. The UI features highly interactive components, like the clickable AnatomyScan for injury pinpointing and a custom Heatmap for tracking streaks. Backend: We deployed an Express.js server to securely handle API requests and interface with the @google/genai SDK. AI Integration: We utilized Gemini 3.6 Flash. To ensure safe and accurate plans, we injected our own local exercise.json database into the LLM context. We used advanced prompt engineering to enforce strict JSON schemas, ensuring the AI only selected valid exercises and strictly followed our multi-tiered pain-awareness and regional diet rules.
Challenges we ran into
Controlling AI Hallucinations: Ensuring the AI didn't invent random exercises outside of our predefined dataset. We solved this by explicitly feeding the allowed JSON database into the system prompt and explicitly banning out-of-bounds generation. Pain-Aware Logic: Designing the prompt so the AI could distinguish between Mild pain (which still requires mobility work at lower volume) versus Severe pain (which requires complete avoidance of the muscle group/joint). Regional Diet Strictness: LLMs often default to standard western fitness diets. We had to write aggressive prompt constraints demanding the AI exclusively use culturally authentic ingredients based on the user's selected country. Gamification State Management: Managing complex state (XP, streaks, history tracking, badge unlocking) purely on the frontend while keeping the UI snappy and synchronized.
Accomplishments that we're proud of
Context-Aware AI Generation: Successfully getting Gemini to act as both a physiologist and dietitian in a single shot, returning a perfectly structured JSON that maps directly to our React UI. The Pain Algorithm: The application genuinely respects the user's physical limits, ensuring safe workout plans rather than blindly assigning heavy squats to someone with a knee injury. Gamified Dashboard: Implementing a complete RPG-like XP system, a GitHub-style activity heatmap, and dynamic streak tracking that rewards consistency without feeling overwhelming. Sleek UI/UX: The combination of the ambient background, Framer Motion transitions, and modern glassmorphism UI makes the app feel premium and engaging.
What we learned
How to effectively structure prompts for Gemini to guarantee reliable, complex JSON outputs for frontend consumption. Strategies for anchoring LLM generations by feeding custom database schemas (like our exercise list) directly into the context window. Advanced React state management techniques, particularly calculating dynamic streaks and rendering SVGs for the activity heatmap.
What's next for Zephyr-Fit
Dynamic Mid-week Re-adaptation: Allowing users to provide feedback on day 3 (e.g., "my shoulder feels better now" or "this workout was too hard") and having the AI hot-swap exercises for the rest of the week without regenerating everything. Wearables Integration: Syncing with Apple Health and Google Fit to pull real-time step counts, heart rate, and caloric burn to adjust the diet plan dynamically. Social & Community Features: Introducing leaderboards and weekly challenges based on the XP and badge system to boost user retention.
Built With
- accessibility
- express.js
- gamification
- generative-ai
- health-fitness
- node.js
- nutrition
- personalization
- prompt-engineering
- react
- tailwind
- vite
- web
Log in or sign up for Devpost to join the conversation.