Webは基本的に静的なものです。アニメーションを使うこともできますが、何度も繰り返したり、マウスクリックのタイミングでアニメーションが実行される程度です。よりインタラクティブ性が欲しいと思ったことはないでしょうか。 そこで紹介したいのがRythm.jsです。なんと音声に反応するアニメーションライブラリです。

Rythm.jsの使い方

こちらはWebサイト内にある音楽ファイルに反応して動きます。まるでスピーカーのように動きます。

もう一つはマイクロフォンに連動して動くものもあります。

音がないと分かりづらいので、ぜひサイトを見てください。音楽や音声入力に合わせてDOMが動くというのは面白い感覚です。単純なアニメーションと違い、よりインタラクティブな面白さが感じられるでしょう。

Rythm.jsはHTML5/JavaScript製のオープンソース・ソフトウェア（GPL v3）です。

Rythm.js by Okazari Okazari/Rythm.js: Make your page dancing.