Overview
Explore hand pose detection and interactive painting in this 16-minute video tutorial that demonstrates how to implement the HandPose model using ml5.js. Learn the technical foundations of the model, track hand keypoints, and detect multiple hands including left/right identification. Build an interactive painting application that responds to hand gestures, utilizing createGraphics() layers and position tracking to create dynamic drawings. Master techniques for converting from BodyPose to HandPose, implementing gesture-based controls, and storing hand positions for continuous line drawing. Access multiple code examples including keypoint tracking, painting applications with varying stroke weights and colors, thumbs up/down detection, and particle effects. Perfect for developers interested in combining machine learning with creative coding through practical, hands-on demonstrations.
Syllabus
Introduction
Technical background of the model
Convert BodyPose to HandPose
Detecting more than one hand
Detecting handedness left or right
Creating a painting sketch with index and thumb
Add a layer using createGraphics
Storing previous hand position to draw a line
Exercise ideas for you!
Goodbye!
Taught by
The Coding Train