NanimatorはjQuery/JavaScript製のソフトウェア（ソースコードは公開されていますがライセンスは明記されていません）です。

Flashの出番がどんどん減っています。と同時に求められるのがこれまでFlashで行っていた操作をHTML5でできるようにする事です。今回は簡易アニメーションを実現するNanimatorを紹介します。

[](http://images.moongift.jp/2013/08/Screenshot 2013-08-05 13.23.36.1375706493.png)
アニメーションしながら文字が表示されていきます。

[](http://images.moongift.jp/2013/08/Screenshot 2013-08-05 13.23.32.1375706498.png)
テキストだけ、または画像と組み合わせて表示できます。

Nanimatorの使い方としてはアニメーションの方向やタイミングをdata要素を使って定義します。表示位置に関するデザインはスタイルシートで定義します。JavaScriptでコーディングする必要もないのでとても簡単に使えます。

MOONGIFTはこう見る

アニメーションを多用しすぎるのはよくありませんが、ポイントで使う事でインパクトを与える事ができます。画像に比べると作成コストも高くなるので要所要所で使うようにするのが賢明でしょう。

Nanimatorの良い所は既存のHTML/スタイルシート/JavaScriptだけでアニメーションが実装できるということです。既にある要素をちょっと揺らしたり、動かす事でクリック率を高めると言った効果も考えられるのではないでしょうか。

Demonstration of Nanimator Library - Brought to you by Happy Monster

Nanimator