PlateWiki
Interactive sports nutrition encyclopedia and gamified athlete health tracker. Deployed on Vercel. Built with Next.js, featuring an interactive muscle-targeted nutrition database, virtual fighter avatar, webcam-based pose tracking, and AI meal planners.
Overview
Developed PlateWiki, an interactive sports nutrition encyclopedia and gamified health platform designed for athletes. Built with Next.js, TypeScript, and Tailwind CSS. Key features and technical systems implemented: • Biometric Mirror System: Configured a retro pixel-art canvas-based virtual fighter avatar. The avatar tracks three client-persisted metrics (Nourishment, Fitness, and Energy) that decay or recover based on real-world training inputs (e.g. logging workouts, completing meal plans). • Webcam AI Tracker: Integrated client-side computer vision/pose estimation ('Speed Bag Blitz' exercises) tracking physical movements to gamify workout sessions and score points. • Targeted Nutrition Database: Created an interactive muscle map associating specific whole-food nutrient profiles with athletic development goals and preparation techniques. • Dynamic Meal Planner: Built a goal-aware generator questionnaire that outputs structured meal plans based on user goals, skills, and kitchen equipment. • Progression Economy: Implemented user leveling from Sprout up to Earthy Sage, daily streak calendars, and a Virtual Kitchen Shop to spend earned Seed Coins on cosmetic gear.