{"slug": "throw-hands-a-webcam-fighting-game-where-your-body-is-the-controller", "title": "Throw Hands: a webcam fighting game where your body is the controller", "summary": "A solo developer built Throw Hands, a browser-based 3D fighting game that uses a webcam and MediaPipe Pose Landmarker to map a player's body movements onto an in-game fighter, with no download or controller required. The developer replaced an arm-extension jab detector with elbow-angle peak detection after the original approach missed punches thrown at the lens, and validated the game with automated tests that replay real fighter footage as a fake webcam, logging 2,160 shared ticks with zero state mismatches across two clients. The project, built in roughly 24 hours at HackTX 2026 with two Claude Code agents, also uses Meta's Muse models for AI-generated fighters and Gemini Flash-Lite for live fight commentary.", "body_md": "*This is a submission for the [MLH x DEV Writing Challenge](https://dev.to/mlh-hackathon)*\n\n**Throw Hands** is a 3D fighting game that runs in a browser tab. Your webcam tracks your body, and a fighter in a UFC-style octagon copies your arms, torso and head. Throw a real jab and it jabs; raise your forearms and it blocks; step toward the camera and it walks forward. You can fight a CPU, a friend on the same camera, or friends on other laptops and phones by room code. It's live at [https://throwhands.tech](https://throwhands.tech), with no download, account or controller.\n\nAI shows up in three places. A pose model in the browser (MediaPipe Pose Landmarker) is the controller. Fighter Forge turns a sentence like \"lava golem with a crown\" into a fighter with a name, backstory and card art, using Meta's Muse Spark and Muse Image. Gemini commentates the fight (details below).\n\nI built it solo at HackTX 2026 in about 24 hours, working with two Claude Code agents.\n\nMy first jab detector measured arm extension, the distance from shoulder to wrist. It missed punches thrown straight at the lens. One webcam measures depth poorly: on a labeled clip, a full jab only changed the measured arm length from 0.24 m to 0.34 m.\n\nThe camera measures angles well. The elbow snaps open from about 75° to 120° in a tenth of a second, whatever the depth. Detecting **peaks in elbow angle** took recall on the labeled jab clip from 4 of 5 to 6 of 6.\n\nThe second detector used velocity over a 100 ms window. At 30 fps it worked. At 15 fps, which a phone or a busy laptop delivers, its recall fell to 20%, because a window holding one frame can't give a velocity.\n\nStrikes are now **peaks**: a local maximum of elbow angle (jab), wrist height (uppercut) or sideways sweep (hook) that rose far enough within 350 ms. That costs one frame of latency and behaves the same at 10, 15 and 30 fps. An evaluation tool replays recorded body points at any frame rate, so every change is scored at both 30 and 15 fps.\n\nI couldn't stand in front of a camera all night, so the end-to-end tests use **downloaded video of real people as the webcam**. Chromium's `--use-file-for-fake-video-capture` plays an MJPEG clip as a camera. For WebKit, the test injects a `getUserMedia` that paints a clip into a canvas stream.\n\nThe best test opens two browsers driven by two pro fighters' shadowboxing footage. They create and join a room through the real UI and play a full best-of-3 while each client logs every state snapshot it receives. Comparing the two logs: 2,160 shared ticks, 0 mismatches in health, round or timer.\n\nThe tests found real bugs. Safari never started pose tracking, for three separate reasons:\n\n`