Games / 2026 / Live in the browser
TiltRacer
A Three.js racing game you steer by tilting an Android phone. The phone app streams gravity-sensor roll and pedal presses at 30 Hz through a WebSocket relay on Vercel, and the keyboard works the whole time.
01
The problem
A phone as a controller has three separate problems: turning a noisy sensor into a steering value that feels right in any grip, getting a 30 Hz input stream from a phone to a browser tab with little lag, and surviving Wi-Fi drops and tab reloads without making the player pair again.
02
How I approached it
The circuit is a centripetal Catmull-Rom spline sampled 1,200 times, and road, kerbs and barriers are ribbons built from those samples. Arcade physics splits velocity into forward and sideways parts and lets the sideways part survive while drifting, which is what makes the car slide and fills the boost meter. Three AI rivals aim at a lookahead point and brake for the sharpest bend in the next 90 m. On the phone, Kotlin reads the fused gravity sensor, rotates it into screen space for the current display rotation, and takes roll as asin(-x / |g|), so it works held upright like a wheel or tilted back towards flat. The Node relay pairs a tab and a phone by 4-character code, clamps every frame, and lets the tab reclaim its code with a secret key, even on a serverless instance that never saw the room.
03
The outcome
Pinning the relay to Singapore cut the round trip from 236 ms to about 70 ms. The relay has 7 automated tests covering pairing, sanitising, reconnects and room expiry, and the phone app has 11 unit tests for QR parsing and tilt maths. Simulated three-lap races finish in about 44 s per lap with no car leaving the road.
Camera: this runs entirely in your browser. No video is uploaded or stored.
