← The season index

No. 03Apr 2026FM-330 Curriculum

Mirror Lab — Interactive Mirror Workshop

A browser-based interactive mirror — p5.js visuals driven by MediaPipe body tracking with Tone.js sound — built as a hands-on workshop, later doubling as a graph-theory course presentation.

Instrumentsp5.js · MediaPipe (body tracking) · Tone.js

The Spark

Teach creative coding through self-reflection: participants see themselves as the material. No installs, no accounts, no setup wall — a browser tab and a webcam are the whole toolchain, so the first minute of the workshop is already hands-on.

The Craft

p5.js draws, MediaPipe's ML body tracking steers, and Tone.js answers in sound — a live mirror where your skeleton plays the visuals and the audio at once. Presenter and facilitator modes let participants teach the session forward, and a graph-theory presentation mode was later added so the same instrument could serve coursework.

Outcome

Shipped as a public, reusable tool — a two-hour session anyone can run from a laptop with a webcam. The mirror went on to double as a graph-theory course presentation, proof that a workshop artifact can keep working after the workshop ends.