PRODUCT DESIGN
F1 Race Telemetry Visualizer
An isometric track view and a first-person cockpit view, running against real race data from the 2026 Canadian Grand Prix.
ROLE
Solo Designer & Builder
TOOLS
WebGL, Unity, Cursor AI
DATA
OpenF1 API
STATUS
Live Build
Watch: Flip between the full track and a driver's cockpit mid-race, and follow any car you want.
This is the live build, not a video. Press Start to begin.
Origin
The BBC Soccer World Cup broadcast had a “3D experience,” a free-camera view of the match built from real player-tracking data, letting you look at the game from any angle. My first reaction was, this is worse than just watching the broadcast: glitchy camera, players jumping position, and the ball skipping.
But that reaction assumed it was trying to replace the broadcast. It isn’t. It’s built for someone half-watching on a second screen, with their phone out, dipping in and out. Reframed that way, the rough edges stopped being a flaw. They read as a fast, low-stakes build for a specific kind of attention.
Built For
F1 fans watching the main broadcast who want a glanceable, interactive second-screen view of the whole race.
827 M
GLOBAL F1 FANS, NEARLY DOUBLED IN A FEW YEARS
43%
OF THAT AUDIENCE IS UNDER 35
That reframe is what turned this from a curiosity into something worth building. Once I started, it moved fast, closer to a week than the months I’d assumed.
TECHNICAL PRECEDENT
The BBC’s own 3D viewer runs on the same stack I ended up choosing: Unity compiled to WebGL. It was the same technical call made by a broadcaster working with official FIFA data and a specialist vendor.
Where Existing Tools Fall Short
F1 already validated parts of the interaction through its own broadcasts; it just never shipped them as a standalone tool a fan could open.
F1’s own broadcast segments prove the concept, comparing positions directly is genuinely useful, but both are hand-assembled by editors for specific qualifying moments, not a tool a fan can open.
Overlays real telemetry, even a speedometer, on top of real onboard streams, but every stream needs a paid F1 TV subscription just to load.
Comes closest, with a live trackmap of every car. But it’s a static view, with no camera, no switching to a cockpit view mid-session, and it needs an active F1 subscription and a native app download.
Official and free, but text and tables only.
That leaves a clear gap: a live, free, whole-field simulation with no camera rigs, editing, or per-session production.
Process
Sport: soccer to F1
A glitching camera reads as broken; a car half a step off its line barely registers. That’s why F1 replaced soccer: same live-simulation feel, without the tell that undid the BBC build. Cars need position and orientation only, no limb animation, no possession logic, a scope decision more than a theme decision.
Fixed views over a free camera
An uncontrolled 360-degree camera is how the BBC build ended up looking at nothing useful. I built two fixed, purposeful views instead, isometric and cockpit, and cut a crowd or a photoreal track entirely. Clean and legible beat spectacle.
First pass. Real 3D car models, labels overlapping and unreadable once cars bunched up.
Second pass. Flattened to logo badges with position numbers. Still too overcrowded once the full grid was on screen, so this design got dropped too.
Insight: if it's a second screen, it has to have zero friction
A second-screen tool only works if picking it up costs nothing. The NBA tested a version of this logic in reverse: live VR broadcasts in 2016, gated behind a $99 headset and a $199 League Pass subscription. It quietly died, viewership was reportedly too small to even disclose. Not because the idea was wrong, but because every barrier between the audience and the experience is a chance to lose them. That’s the reasoning behind running this as a free browser tab with no login, it has to be as easy to open as a second tab, or it’s not actually a second-screen tool at all.
Insight: no camera rig, just data
F1’s own Ghost Car and Heli Lap need real footage to composite onto. This build skips cameras and editors entirely, raw position data rendered straight into 3D, live, which is what makes it usable well beyond a highlight clip.
Scope
IN SCOPE
+
Isometric track view
+
Cockpit view
+
Leaderboard
+
Camera-flip toggle
+
Fullscreen
Deliberately Excluded
-
Free 360° camera
-
Photoreal track & pit stops
-
Crowd simulation
-
Playback controls
-
Race-story charts
Familiar F1-broadcast conventions (leaderboard, gap-to-leader, team colors) don't need explaining, so no tooltips or onboarding.
Key Decisions
Position-only, until you ask
Isometric view originally labeled every car. With 20 on screen, it was unreadable. Now every dot just shows a live position number; clicking one pops it up with full detail, number, logo, three-letter code, one driver at a time.
Two cars ahead, stacked
Cockpit view originally labeled every car ahead of the driver. Cut to the two closest, with labels stacked so they stay readable when those cars converge.
Overlap as a feature
GPS-derived positions mean close cars can visually overlap. Tightening tolerance just pushes cars onto an unrealistic centerline. Instead, the trailing car renders at 50% opacity, so the overlap reads as intentional.
Live-only, no scrubbing
No pause, rewind, or timeline, on purpose. A second-screen tool is something you glance at, not something you sit down and analyze, and that matches how the target audience already behaves. For this version, secondary engagement took priority over deeper race analysis.
77%
of sports fans run a second screen during live games, climbing past 80% for Gen Z. Built for the glance.
Interactive, Not mocked
This isn’t a prototype video. It’s the actual WebGL build running against real OpenF1 session data, embedded directly in this page. I built and iterated it end-to-end with Cursor’s assistance.
GPS Noise: A Known Limitation, by Design
Cars occasionally drift slightly off-track before self-correcting. Tightening the tolerance increased overlap; widening the track distorted its scale. I kept the imperfection rather than hide the underlying limitation of GPS-derived positioning; the same tradeoff visible in F1’s own GPS-based Ghost Car feature.
Reflections
The biggest shift wasn’t technical; it was framing. I initially judged the concept as a replacement for the broadcast, where its rough edges were impossible to ignore. Once I reframed it as a second-screen product, the constraints became clearer: fixed views, instant access, live-only interaction, and information designed to be understood at a glance.
60%
FEMALE AUDIENCE FOR THE NHL’S ANIMATED ALT-BROADCAST, VS. HOCKEY’S USUAL SKEW
$6.22M
AVG. F1 SPONSORSHIP DEAL, 8X THE AVERAGE NFL DEAL
A tool like this won’t shift those macro numbers on its own, but it’s built on the same core principle: meet second-screen viewers where they already are, rather than forcing them into a passive broadcast model.
What's Next?
NOW
A live race selector instead of one fixed session, a backend that ingests any race’s JSON automatically, and direct live-JSON injection so it can run against a race as it’s actually happening.
NEXT
Account creation, playback controls for scrubbing back through a race instead of live-only, tighter track-adherence, and ambient environment audio.
FURTHER OUT
Embedded directly into a broadcaster’s own site, the way F1 TV or ESPN already embed video and stats widgets. It needs a proper API and licensing terms, and, since it needs no camera rig or editor to produce, F1 itself could use it or license it to other broadcasters.
Business Model Opportunities
If the experience proves useful at scale, the same low-friction distribution model creates several paths to monetization.
Subscription tier
A premium camera angle or extra driver slots, gated behind an existing broadcaster subscription.
Sponsor placement
Branded overlays or trackside logos rendered directly into the live 3D scene.
Second-screen ads
A quiet banner when not in fullscreen, or a spot before the race starts and after it ends.
“F1 2022 Generic” by TheoDevF1 is licensed under CC BY-NC-ND 4.0. Race data via OpenF1 API, licensed under CC BY-NC-SA 4.0. Typeface: “Formula1 Display Bold” by Marcelldavis, free for personal and commercial use.