「アニメーションGIF」の復権（PhotoshopでのアニメーションGIF制作）、そしてシネマグラフ

この記事は鷹野雅弘によって執筆されました。

公開日：2014年2月 9日、更新日：2015年9月15日

アニメーションといえばFlashですが、iPhoneがサポートしないことですっかり下火となってしまいました。

その後、Flashは、CreateJSをサポートすることで、FlashからHTML5ベースのコンテンツとして書き出すことができるようになり、統合的な制作環境としては残っていきそうです。

一方、プラグインを必要としない「アニメーションGIF」（GIFアニメ、animated GIF）の人気が、ここ数年復活しています。

このように比べると、なんか劣っているように見える半面、「どんな環境でも、ほぼほぼ動く」というのは強いこと、また、単なる劣化版でなく、非常にアーティスティックな、というか、不思議な感覚が残る「シネマグラフ」という手法が、注目が高まった理由のひとつです。

シネマグラフ

「シネマグラフ」とは、一見すると写真のように見えながら、一部のみが動くという手法。百聞は一見にしかず。こちらをご覧ください。

そのほか、TumblrされまくったGuillaume Kurkdjianというイラストレーターの方の作品や

Oamul Luさん（卤猫 | keep running）など、イラストをベースにしたものも、とてもステキです。

改めて、昔ながらのアニメーションGIFも、改めて見ると、なんか味があります。

そして、そして、昨日から話題になっているのがコレ！

縦線の奥行きでの位置（Y）を決めて、その前後に物をはみ出させたり引っ込めたりすることによって、人間の目があたかも本当に奥行きがあるかのように錯覚してしまうんですねぇ。

なんかすごくないですか!?

GIFアニメーションは、いわば「パラパラマンガ」です。

たとえば、次のようなアニメション。

次の7フレームを順番に表示しているだけですが、人間の目には“動いて”見えます。

映画のことをアメリカ英語では、Movieのほか、Motion Picturesと呼ぶことがありますが、動画（ビデオ）も、まったく同じしくみです。

1秒あたりに表示するコマ（フレーム数）を「fps」（frames per second）といいますが、テレビは29.97fps、映画は24fps、GIFアニメーションの場合には、1-15fps程度です。

なお、動画（ビデオ）は、動きがない場合でも同じフレームを繰り返し使う必要がありますが、GIFアニメーションでは、フレームごとに表示する秒数を決定できるため、その必要がありません。

「こんなGIFアニメーションを作りたい！」というお手本がある場合には、そのGIFファイルをPhotoshopで開くと、［タイムライン］パネル（と［レイヤー］パネル）でどのように構成されているのかを解析することができます。

GifCam、Mothereffing animated gif、GifCamなど、フリーウェア、オンラインアプリなどもあるのですが、DTP Transitとしては、Fireworksと比較しつつ、Photoshopでの制作について解説します。

Photoshop CS4までは［アニメーション］パネルを使ってフレームアニメーションのみ対応していましたが、Photoshop CS5 Extendedでビデオ編集に対応しています。

Photoshop CS6以降は［アニメーション］パネルが［タイムライン］パネルと名前を変え、フレームアニメーションと動画編集を切り替えて行うようになっています。