How it works

When you click Enable camera, the browser shows its standard prompt. Nothing happens until you allow it. We use navigator.mediaDevices.getUserMedia to get a live video stream from your webcam — the same API every other browser-based camera app uses.

We use Google's open-source MediaPipe models — hand landmarks, face landmarks, or pose landmarks depending on the game. The model itself is a few megabytes, downloaded once and cached, then run via WebAssembly with GPU acceleration when available.

The model runs entirely on your device. No frames are uploaded, transcoded, or stored on our servers. If you disconnect from the internet after the model loads, the game still plays — score submission is the only part that needs the network.

On each video frame (roughly 30–60 times per second), the model produces coordinates: where your fingertips are, where your nose is, how open your mouth is, what angle your arms make. The game reads those numbers and decides whether you scored a point, missed a beat, or hit an obstacle.

For example, Finger Bop counts how many fingertips are above your palm centroid. 67 Speed looks at whether each wrist crossed above or below your shoulder line. Chomp Time measures the gap between your inner upper and lower lips relative to your mouth width.

Below the “invisible” vision layer, the game UI is a standard HTML canvas: notes falling, hearts, score, countdown timers, and a watermark. Your webcam feed shows through behind it. When the canvas detects a hit, it plays a sound, flashes a color, and bumps the score.

After a run ends, the score (and only the score — never the video) is sent to our backend (Supabase). Your display name and avatar come from your sign-in provider (Discord or Google) so others can see who scored what on the leaderboard. For National 67 War, the country you chose is included so your reps add to a national total.