Phone Joypad
Browser games want a keyboard. A phone has a gyroscope. This puts a local relay between them, so tilting the phone steers the car — and the game believes it came from real hardware.
How It Works
Three hops — phone to server to extension to game — and a pile of platform quirks in between.
Input games actually accept
Unity and Poki titles ignore ordinary synthetic key events. Keys are dispatched through the Chrome DevTools Protocol instead, so the game cannot tell them from a real keyboard.
Tilt steering with hysteresis
Steering engages at 3° off centre and releases at 1.5°, so a hand resting near the threshold does not chatter. Readings run through an exponential moving average to damp sensor noise.
Calibrated centre, not assumed
Zero is captured when the gyroscope is switched on, so 3° means 3° from however you actually hold the phone. Re-centre re-zeroes at the current position mid-game.
HTTPS, because iOS demands it
Safari exposes gyroscope data only in a secure context — over plain HTTP the listener attaches and no event ever arrives. The server issues its own certificate with the LAN IP in subjectAltName and reissues it when that IP changes.
Pair by scanning
The side panel renders a QR code for the connection address. Point the iPhone camera at it, allow motion access, and the phone is a controller — no app, no store, no account.
A frozen reference frame
iOS has no working orientation lock, and a hard turn used to flip Safari's layout mid-corner — swapping the steering axis from gamma to beta and inverting the controls. The frame is now frozen when the gyroscope starts.
Two ports, one relay
The extension talks plain WebSocket over localhost; the phone talks WSS over the LAN. The server bridges them, and writes the resolved ports back out so both ends always agree.
Debuggable from every side
Logs land on the phone screen, in the server console, and in the side panel at once, with live tilt angle and the keys currently held. An end-to-end smoke test covers the whole phone → server → extension relay.
Tech Stack
Node.js
Local relay server
Express
HTTP & HTTPS endpoints
WebSocket
Phone ↔ server ↔ extension
Chrome MV3
Service worker & side panel
chrome.debugger
DevTools Protocol key dispatch
DeviceOrientation API
Gyroscope steering
selfsigned
LAN certificate generation
qrcode
Pairing code