A real-time, team-driven car design and race simulation platform built on a Discord-like architecture using Next.js, LiveKit, and a canvas-based design system.
This project focuses on design trade-offs, team coordination, and strategy, not real-world physics. Car performance is derived from controlled parameters, while race outcomes emerge dynamically through system logic.
- Teams collaboratively design a car using a canvas + sliders
- Only the team moderator can submit the final design
- Design choices determine performance ceilings (speed & handling)
- Race logic handles strategy, tyres, pit stops, and incidents
- Risk is never user-controlled — it is always system-derived
- Static top-view car representation
- 3D models
- Visual feedback reacts to slider changes
- Design is represented internally as structured JSON
- Grip ↔ Speed balance
- Suspension stiffness
- Ride height
- Stability ↔ Agility balance
- Tyre wear tendency
- Fuel efficiency bias
- Straight-line acceleration bias
- Corner exit traction bias
- Brake aggressiveness
- Reliability ↔ Performance bias
⚠️ Collision risk, instability, and failures are not configurable by users and are derived automatically by the system.
- Only users with Moderator role can submit car designs
- One design per team per race
- Design is locked after submission (parc fermé rule)
- Starting tyre must be selected before race start
-
Each car design produces:
straightSpeed(straight-line ceiling)cornerSpeed(cornering ceiling)
-
During the race:
- Track segments determine which speed applies
- Tyres, fuel, pit stops, and weather dynamically modify performance
- Incidents are probabilistic and derived from design instability + race context
Cars are represented as colored dots on a top-down track view.
AI is used strictly for analysis and interpretation, never for core simulation math.
- Interprets submitted car design traits (optional vision step)
- Estimates relative risk profiles (low / medium / high)
- Generates race commentary and post-race summaries
AI does not decide race results or calculate movement.
- Frontend: Next.js (App Router), Tailwind CSS
- Canvas: Konva.js (React Konva)
- Realtime: LiveKit (voice & presence)
- Backend: Next.js API routes
- Database: Prisma + PostgreSQL
- Auth: Clerk
app/
├── api/ # Backend routes (servers, channels, livekit)
├── (auth)/ # Authentication routes
├── (main)/ # Main app (servers, channels, conversations)
├── (invite)/ # Invite system
└── (setup)/ # Initial onboarding
components/ # UI & canvas components
hooks/ # Custom hooks (modals, state)
lib/ # Utilities & helpers
prisma/ # Database schema
- Deterministic simulation over realism
- Risk is an emergent property, not a setting
- Team decisions matter more than raw design
- Canvas is UI, not the source of truth
- Advanced canvas visual feedback
- Multiple race formats
- AI-generated race debriefs
- Spectator mode
- Strategy presets per team
This project is a design and strategy simulator, not a real-world physics engine. All values are normalized and abstracted for fairness and playability.
Built by Dhruv as a solo project.