Make each corner count
Tap the handbrake to initiate a drift, steer into the corner, then straighten to regain grip. Holding the handbrake slows the car to a stop.
A compact 3D circuit, one red car and three rivals. Time your drifts, cross the bridge and fight for first place over three laps — directly in your browser, with a keyboard or a phone.
- Role
- Track design · Gameplay programming and opponent AI · Interface and audio
- Timeline
- October 2026
- laps
- 03
- racers
- 04
- circuit with an overpass
- 01
THE EXPERIENCE
Three laps. One finish line.
Build speed on the straights, time your drift through the corners and find a gap past three rivals.
Race on two levels
Tight corners, connecting straights and an elevated crossover set the rhythm. Chase camera, minimap and checkpoints keep you on course.
A finish worth racing for
Engine sound follows the throttle; tyres react to drifting. First place earns a trophy, a victory fanfare and low-poly fireworks.
How to play
On a computer
- ↑ / ↓
- Throttle · brake / reverse
- ← / →
- Steer
- Space
- Tap and steer: drift · Hold: handbrake
- R / Esc
- Reset to checkpoint · Pause
On a phone
- Turn your phone sideways before starting.
- Hold Throttle on the right and use Left / Right on the left to steer.
- Tap Drift while cornering; hold it to brake. Multiple controls can be held together.
Toggle sound on the start screen, pause menu or results. A browser with WebGL support is required.
Behind the build
Languages and technologies used
TypeScript
Next.js
React Three Fiber- Three.js
Web Audio API
Product story
Apex Circuit
01 — 04The problem
A portfolio project should let visitors experience what they have just read. Apex Circuit began with turning Kenney’s Racing Kit into a short race: quick to enter, competitive and full of corners that reward finding a rhythm. The challenge was to build a continuous circuit with an elevated crossover, keep the car visible through the chase camera and give steering and drifting the same meaning on keyboards and touchscreens.
My contribution
I designed the route and arranged pits, grandstands, trees, lighting and signage around the Racing Kit’s visual style. The road, kerbs and barriers use continuous geometry to connect cleanly through bends and slopes. I implemented the arcade controller, computer opponents, ordered checkpoints and lap counting; an obstruction-aware chase camera; the HUD, minimap and touch controls. Pause, reset, restart, engine and drift sounds, plus low-poly victory fireworks complete the race loop. The car and scenery models are from Kenney Racing Kit under CC0. My contribution is the game implementation and portfolio integration, rather than the original modelling of those assets.
The solution
A fixed-step simulation separates vehicle heading from travel direction to create lateral slip. Tap Space or Drift and steer to initiate a slide; hold the handbrake to slow down, and straighten to regain grip. Three opponents look ahead along the circuit, adjust speed for corners and pass the same ordered checkpoints. The road and barriers share an elevation profile. Checkpoints distinguish the two levels at crossings, while the chase camera shortens its distance when scenery would obscure the car. Phones use landscape orientation, independently tracked touch contacts and a HUD separated from driving controls. Audio starts after a play gesture. The 3D scene loads on a separate game route, keeping the case study focused on text and images.
Results & lessons
The current build includes one circuit, four cars and three laps, with keyboard and landscape touch controls, Vietnamese and English, chase/overview cameras, pause and restart. First place earns a trophy, a dedicated victory fanfare and low-poly fireworks; sound can be toggled. Automated checks cover race rules, drifting and handbraking, camera visibility, multi-touch input, win/loss flows and small-screen layouts. This is a personal single-player project against computer opponents, without online racing or leaderboards. Browser emulation does not replace performance and audio testing on individual physical phones.
04 images