Crying multi colour balls with matter.js and PoseNet p5.js

10 2020

PoseNet is a machine learning model that can capture the position of the body (including eyes, and other features), this model is loaded into p5.js which makes animation and using the webcam easy. Matter.js is a fantastic tool to simulate physics and collisions.

All three were combined here to make me cry! Moving one hand changes the size of the balls (tears), the other changes the colour.

Its fun, silly and playful, but also shows the ease and power of combining different bits of script.

copy, duplicate, play with the code here: