Templates for Mouse, Microphone, and Webcam Input
Demonstration of mouse interaction techniques:
Demonstration of microphone interaction techniques and a clean simple one.
Here is an ADVANCED template code for Hand, Face, and Body Capture with Handsfree.js:
(ALERT, this is an advanced template that could have some pain points for beginners.)
Improved & Simplified Hands, Body & Face Tracker Template. This is a much-simplified demo showing how you can access a variety of points by name (“nosePt”, “chinPt”, etcetera):
Improved FingerFingerNose Demonstration:
This is a much-simplified demo showing how you can access a few points by name, and then connect them with custom graphics.
Here’s an ultra-simple face mask demonstration. It is also microphone/voice sensitive:
This elaborated “Frog” demo shows how you can use math to position shapes in interesting ways. The size of the frog’s eyes are controlled by raising your eyebrows; the width of the face is controlled by smiling; and the eyes look at your index finger if it’s visible.
Simple Hand Bunny example (puppet):
Connie’s quadruped template: using hands for puppeteering (sketch):
Arm (compound rotations):
- Zeno’s Interpolation Demo (Position)
- Zeno’s Interpolation (Color)
- Arm • p5 Arm with Sinusoid
- Reach 1
- Follow 2