AI-powered racket sports analysis for Badminton and Tennis. DeepCourt uses Google Gemini vision models to analyze training footage and provide near-realtime rally tracking plus biomechanical posture feedback.
- Shot detection — Near-realtime vision analysis with ~750ms capture frequency. Detects Smash, Drop, Clear, Serve.
- Court geometry — Player positions and shot coordinates mapped on a court view (Geometry HUD).
- Multi-perspective insights — Switch between Coach, Player, Opponent, Referee, and Team Strategy views for tactical advice.
- Target player — Focus on Home (foreground) or Away (background) player.
- Biomechanical assessment — Analyze 20 sampled frames for stance, knee bend, hip rotation, shoulder alignment, and more.
- Structured metrics — Balance & Stability, Power Generation, Footwork, Racket Technique, Recovery Position, Overall Efficiency.
- Pro comparison — How your technique compares to elite players.
- Drill suggestions — Actionable training recommendations.
- Unified input — File upload, webcam, or YouTube URL.
- Shared across modes — Upload once, switch between Rally and Posture without re-uploading.
| Layer | Technology |
|---|---|
| Frontend | React 19, TypeScript, Vite |
| AI | Google Gemini (vision + JSON mode) |
| Visualization | Recharts (radar charts for posture) |
| Icons | Lucide React |
DeepCourt/
├── App.tsx # Main app, mode switching, shared video state
├── components/
│ ├── AnalysisPanel.tsx # Rally perspective panels
│ ├── Court.tsx # Court geometry / shot visualization
│ ├── PostureAnalysisView.tsx # Posture results view
│ └── VideoWorkspace.tsx # Video input (upload, camera, YouTube)
├── services/
│ ├── geminiService.ts # Rally analysis (shot detection, positions)
│ └── postureService.ts # Posture & biometrics analysis
├── types.ts # Shared types
└── vite.config.ts # Vite config, env loading
- Node.js (v18+ recommended)
-
Install dependencies
npm install
-
Configure API key
Create.env.localin the project root and add your Google AI Studio API key:GEMINI_API_KEY=your_api_key_here -
Run the dev server
npm run dev
Open
http://localhost:3000(or the URL shown in the terminal).
npm run build
npm run preview # Preview the production build locally- Rally and posture analysis use the Gemini API; usage is subject to Google AI quotas.
- Rate limit (429) is surfaced in the UI when quota is exhausted.
- Video frames are captured at 400px width and JPEG quality 0.3 for rally mode to keep latency low.
- Badminton — Full rally and posture support.
- Tennis — Full rally and posture support.