ブラウザのみで動体検知を行なっています。
縦や横に顔を動かすと移動量を計算して、その方に3Dのキューブを回転させています。
顔をいろんな方向にぐるぐるまわしてキューブを回転させてみよう。
デモページを開き、カメラの許可をしてください。
動体検知には、オプティカルフローという技術を使っています。
オプティカルフローは、現在のフレームと一つ前のフレームを比較して動きを推定する仕組みです。
画面を小さなブロックに分けて前後のフレームで、隣接している箇所を調べてどちらに動いたかを決めています。
デモページで顔を動かしたときに表示される緑色の線が予測した移動量になります。
オプティカルフローにはいくつかの手法がありますが、今回はLucas-kanade法で実装しています。