kelvin.dart

3D racing game · three.js

Lagos GP

A 3D racing game on an imagined Lagos street circuit that teaches Formula 1's 2026 rules (active aero, battery Boost, Overtake Mode), with rain, night racing, a garage, and multiplayer on the way.

An F1 2026 explainer that grew into a racing game

The 2026 Formula 1 rules change a lot at once: power split close to 50/50 with electric, a 4 MJ battery you recharge under braking, active aero with Corner and Straight modes in place of DRS, Boost, and an Overtake Mode. Articles explain all of it; few let you feel it. I started with an explainer you learn by driving, not by reading.

It grew into a proper game. A menu hub, a garage, five lighting and weather looks and three race modes now sit on top of the same rules, which still run live in every race, with the guide and a teardown of the car one tab away. It's an imagined event, not affiliated with Formula 1, the FIA or any team.

Menu, modes and garage

The game opens on a menu hub with Race, Garage, Settings and The rules tabs, over the circuit in the light you last picked. The race tiles are Quick race, Daily GP (the same grid for everyone each day), Time trial against your own ghost, and Multiplayer, marked coming soon. The brand is "Eko Night": night-blue panels with danfo-bus yellow.

In the garage you paint your car with six presets or your own colours, and set your number and three-letter driver code. The car repaints live in 3D behind the menu, and your code goes on the timing tower.

The Lagos GP menu hub at golden hour: Quick race, Daily GP, Time trial and a Multiplayer tile marked soon, with light, length and rival settings.
The menu hub at golden hour, with Multiplayer marked coming soon.
The garage with six livery presets, colour pickers, number and driver code, and the car repainted orange behind the panel.
The garage: pick a preset and the car repaints live.

A lap of Lagos

The circuit is 10.3 km on real Lagos roads from OpenStreetMap. The lap runs along Eko Boulevard to Bar Beach on Ahmadu Bello Way, onto Ozumba Mbadiwe, north over Falomo Bridge and back on a raised deck with a hairpin, then down Akin Adesola Street. The city around it is built from OpenStreetMap buildings along the corridor, with the planned Eko Atlantic towers added in, imagined.

Twelve cars line up for six invented Lagos teams: Eko, Lagoon, Makoko, Harmattan, Ikoyi and Surulere, each with invented sponsors on the cars. Rivals run on Easy, Medium or Hard, over a one-lap sprint or a five-lap feature race.

Lights out at golden hour: the player's yellow car on the grid behind the starting lights, with the field ahead.
Lights out at golden hour, the default light.

Golden hour, rain and night

Golden hour is the default, with Afternoon, Rain, Night and Night rain one tap away. In the rain the road turns wet and reflective with puddles, cars throw spray and splash through standing water, and grip drops by 15%. Rain lands on the camera lens too: the drops slide down when you're slow and streak off at speed, best seen from the onboard camera.

Small details carry the feel: brake discs glow orange after big stops, most visible at night, exhaust heat haze shimmers behind the cars, the start leaves skid marks off the line, and the engine sound follows the load.

The chase camera in the rain on a straight, with spray off the cars ahead and reflections on the wet road.
Rain from the chase camera: spray, puddles and a reflective road.
The onboard camera at 288 km/h in the rain, with raindrops on the lens and a reflective wet track ahead.
Onboard in the rain: drops on the lens at 288 km/h.
A side-on view of the car in night rain braking for the Falomo hairpin, its front brake glowing.
Night rain into the Falomo hairpin, the brakes glowing from the stop.

The rules, live in the race

Underneath, it's still an explainer. Energy deploys and harvests as you drive, Boost adds up to 150 kW when you hold it, Overtake Mode arms when you're within a second at the detection line, and the active aero switches between Corner and Straight on its own. A tips strip names each moment as it happens, so the rule and the feeling arrive together.

There are four cameras: chase, onboard, a TV director that cuts between trackside cameras following the action, and an Airflow cam. The airflow smoke comes from a precomputed lattice-Boltzmann fluid simulation, so when the aero mode switches you can see the wings change the flow.

Tuned by play-testing

Most of the work was feel, found by playing it over and over.

  • The camera bobbed with the car's pitch. Framing it on heading only made it steady.
  • Wall hits jerked the car to a stop. Now you scrape along the wall instead of bouncing off it.
  • A white haze sat ahead of the car: smoke too close to the lens, plus the edge of the shadow box. Both are gone.
  • Trackside signs cut across tight corners, so I rebuilt them to bend with the wall.

How it was built

  • A static site in vanilla JavaScript modules and three.js, with no build step, deployed on Vercel.
  • A deterministic, seeded race simulation in track coordinates: a grip-limited car model, slipstream and dirty air, walls you scrape along, and AI that follows a racing line, defends, overtakes and makes the odd mistake.
  • A headless test suite that runs whole races to check timing, energy, contacts and wall hits.
  • One CC BY car model with all real branding stripped, cut into three levels of detail for the player, phones and rivals. Liveries, including your own from the garage, are drawn at runtime into the model's decal slots.
  • Desktop gets the full effects, with optional ambient occlusion under High graphics; phones get lighter models and effects, touch controls, and the guide stacked under the race.
Two phone screens: the menu hub with the race tiles, and a race in portrait with steering, Boost, brake and throttle controls.
On a phone: the menu hub, and touch controls in portrait.

Credits

An imagined Lagos Grand Prix, not affiliated with Formula 1, the FIA or any team; all teams and sponsors are invented. Car model: "2026 Red Bull RB22" by Tyler_Dave on Sketchfab, CC BY 4.0, branding removed. Sounds from Freesound, credited on the site. Map data © OpenStreetMap contributors, ODbL.

Play the race