A production-grade Formula 1 race intelligence dashboard inspired by real-world pit wall systems, designed to simulate how teams monitor races using live data, telemetry, and strategic insights.
F1 Pit Wall is a data-driven, high-performance dashboard that visualizes race events, driver standings, constructor rankings, and telemetry in a structured, scalable interface.
This project goes beyond a typical frontend build — it demonstrates systems thinking, data modeling, and real-time dashboard design.
- Dynamic race header (track, laps, distance, session details)
- Real-time countdown timer (“Lights Out”)
- Highlighted upcoming race with contextual metadata
- Horizontally scrollable multi-round calendar (23 races)
- Active race highlighting and navigation system
- Structured race scheduling model
- Points-based ranking engine
- Driver metadata (team, nationality, performance)
- Dynamic leaderboard rendering
- Team ranking aggregation
- Visual comparison using progress indicators
- Modular team data structure
- Driver selection interface
- Simulated telemetry feed
- Extensible architecture for real-time data integration
- Custom SVG-based circuit rendering
- Driver position markers
- Foundation for real-time animation and tracking
- Component-oriented UI structure
- Separation of concerns (data vs presentation)
- Reusable UI modules (cards, panels, tables)
- Scalable system design for all F1 circuits
The project is designed with extensibility in mind, enabling seamless integration of live APIs and real-time updates.
- Frontend: HTML5, CSS3, JavaScript
- Design System: Custom-built (F1 broadcast-inspired UI)
- Data Layer: Structured static data (API-ready architecture)
- Live data integration (Ergast API / FastF1)
- Real-time updates via WebSockets
- SVG path-based car animation on track maps
- Migration to React (component scaling + state management)
- Dark/Light mode toggle
- Full responsive optimization
- Advanced telemetry charts (speed, tire data, sector times)
- Designed a scalable dashboard system from scratch
- Implemented data-driven UI rendering
- Built a modular architecture for future extensibility
- Focused on performance, clarity, and real-world usability
git clone https://github.com/AbhinavPabbaraju/f1-pit-wall.git
cd f1-pit-wall
open index.html