ITエンジニア/デザイナ向けにオープンソースを毎日紹介

jsgifはGIFアニメーションを解析し、一時停止したりリバース再生したりできるJavaScriptライブラリです。

GIFアニメーションは動画が当たり前になった現在、廃れるかと思ったのですが未だに好んで使われています。特にちょっとしたお笑い系動画をGIFアニメーションにしていると面白いです。そんなGIFアニメーションを再生、リバース再生など自由に操作できるようにするJavaScriptがjsgifです。


まず最初の表示です。全てGIFアニメーションになっています。


ブックマークレットを実行すると、赤い枠が表示されます。クリックするとフレームの解析が行われます。HTML5対応ブラウザ向けですが、Google Chromeではコントローラーがうまく表示されませんでした(SafariはOKでした)。


画像の下に操作するコントローラーが表示されます。


フレームに関する情報を表示しています。


色々なGIFアニメーションが用意されているので楽しめます。


右回転、左回転によって右脳、左脳が分かれる女性の回転する画像もばっちりです。


デモ動画です。猫がビニールにアタックする有名なGIFアニメーションを操作しています。

jsgifはGIFアニメーションをCanvas上でレンダリングする際に解析し、フレーム単位での再生を行えるようにしています。思ってみれば単に繰り返すだけで技術的にはとても古くさいものでした。それだけにjsgifによってHTML5の力がアニメーションGIFに加わったとさえ言えそうです。

jsgifはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。


MOONGIFTはこう見る

jsgifではGIFアニメーションをWindows3.1レベルの技術と酷評していますが、確かに技術レベルは高くなかったでしょう。しかしそれだからこそ誰でも使えて意外と面白いものが作られてきたのかも知れません。技術的に高度なものは表現力こそ高くなるものの、制作コストが跳ね上がってしまうために参入する人が限られてしまいます。

新しいものを作る時に、より高度であればインパクトがあって人がこぞって来るように感じますが、実際にはそうではありません。いかに高度な技術を使っていたとしても、それを自然と受け入れられるようにするかが重要です。作っているものがいつの間にかユーザを置いてけぼりにしてしまっていた…なんて覚えはないでしょうか。

jsgif

shachaf/jsgif - GitHub

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2