使い方は簡単！以下の通りです。
1） ブラウザでWebサイトを開く
2） グーにした手をカメラにうつす（手を近づけすぎないほうが良いかも）
3） 指を一本ずつ開く ⇒ 開いた指先に炎がともる
4） 手をグーにして、「 r キー」を押すと、表示がリセットされます
https://yo-to.github.io/magic-mediapipe_hands_p5js/
Googleさんの MediaPipe Handsで Webカメラにうつった手を認識させ、指の動きに合わせた画像の描画等の処理を p5.js で行っています。
技術概要などの補足は以下の記事にて。
- Zennの関連記事： 某アニメの悪役が使う「とっておきの手品」っぽい呪文が使えた気になる（かもしれない）Webアプリを作った話【技術概要】
- ProtoPediaへの登録： 某アニメの悪役が使う「とっておきの手品」っぽい禁呪が使える（気がするかもしれない）Webアプリ V2
MediaPipe Hands は複数の手を同時に認識でき、また、p5.js は WebGL による 3D の描画もできるものです。 そのため、例えば以下のようなものも作成可能です（※ 以下は、YouTube動画へのリンク）。