jsgifはCanvasタグに描画した内容をアニメーションGIFに変換するソフトウェアです。

簡易的なアニメとしてよく使われているのがアニメーションGIFです。まだまだ意外と人気で、動画をあえてアニメーションGIFに変換して楽しむようなサイトも数多く存在します。そんなアニメーションGIFを発展させてくれそうなのがjsgifです。

[![](http://images.moongift.jp/2013/04/Screenshot 2013-04-01 11.11.10_thumb.1364955080.png)](http://images.moongift.jp/2013/04/Screenshot 2013-04-01 11.11.10.1364955080.png)
デモです。ここに色を書き込んでいきます。そしてGenerateボタンを押します。

[![](http://images.moongift.jp/2013/04/Screenshot 2013-04-01 11.11.15_thumb.1364955083.png)](http://images.moongift.jp/2013/04/Screenshot 2013-04-01 11.11.15.1364955083.png)
色がどんどん変わっていくアニメーションGIFが出来上がりました。これはCanvasタグを使って生成されています。

[![](http://images.moongift.jp/2013/04/Screenshot 2013-04-01 11.13.29_thumb.1364955087.png)](http://images.moongift.jp/2013/04/Screenshot 2013-04-01 11.13.29.1364955087.png)
時計です。これもアニメーションGIFです。これもCanvasからできています。

[![](http://images.moongift.jp/2013/04/Screenshot 2013-04-01 11.13.54_thumb.1364955089.png)](http://images.moongift.jp/2013/04/Screenshot 2013-04-01 11.13.54.1364955089.png)
一部が点滅するデモです。

jsgifではCanvasタグを使って描画をし、その結果をアニメーションGIFとして保存させます。つまりアニメーションするCanvasを描く必要があります。画像や写真を用意しておくというよりも、ベクターベータを描画して、それをアニメーションとするといった使い方が最適と言えそうです。

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

MOONGIFTはこう見る

jsgifの使いどころとしては、Webブラウザ上で設定や速度を変更してCanvasタグ上でプレビューしたアニメーションをGIFとして保存できると言ったものになるのではないでしょうか。さらにCanvasを使ったWebブラウザゲームならば、そのプレイ内容を保存しておくことで後でアニメーションGIFとして再現できるというのも考えられそうです(アクションよりも将棋のようなゲーム向きかも知れません)。

トゥイーン系のライブラリと組み合わせれば、まさにWebブラウザ上でアニメーションを作れるようになるかも知れません。その結果をアニメーションGIFとして保存できれば、後で誰でも見返して楽しめるようになるでしょう。

antimatter15/jsgif · GitHub