Handel: play music in the air with your webcam (my own product)

Handel is my own product: a browser instrument you play with your hands in front of a webcam. Raise a hand to change pitch, pinch to pluck a note, make a fist to hit a drum. One screen, nothing to install, nothing uploaded. It is not client work.

Theremin: glide a lead sound and pluck melodies, with on-screen guides for each note in the scale.

Chord Pad: touch your thumb to each fingertip, and every finger is a chord in your key.

Air Drums: tap a fingertip into a pad for kick, snare, hat, clap or tom.

Conductor: a looping band follows you. Wave faster to speed up, raise your hands for more layers.

You can record a 15-second clip with sound and download it as MP4 or WebM.

MediaPipe HandLandmarker tracks two hands at about 30 frames a second, on the GPU with a CPU fallback.

A small gesture layer turns hand positions into events like pinch, touch and fist, with smoothing so notes do not flicker.

Tone.js makes every sound in real time, with no samples.

A WebGL shader draws the visuals, with a 2D canvas layer for ribbons, particles and note guides.

A demo mode feeds simulated hands into the same pipeline, so the page plays before you allow the camera.

Hackyard Yard #3, theme "One Screen", in the build week of 21 to 25 September 2026. The code was written by Devin, the AI software engineer, for me. That is how I build: I direct and review, Devin writes the code.

Plain ES modules, HTML and CSS, MediaPipe Tasks Vision, Tone.js, WebGL, GitHub Pages. No framework, no build step.

Play it live: chris-wozniczek.github.io/handel