シネマグラフというのはGIF画像で作られた「一部分だけが動く写真」の名称となっています。
まずは説明するよりも実際に見て頂きましょう。
このように画像の一部分だけが動くという
不思議な写真を創り出すことができるのですが
このシネマグラフ、意外と簡単に作ることが可能で
WindowsでもMacでも今すぐに作成することが可能です。
ちなみに以下はウチの猫で作ってみたシネマグラフです。
今回はシネマグラフの作り方を写真を交えて紹介しますので、興味のある方は以下のステップで作ってみましょう！
シネマグラフの作り方まとめ
１，Photoshop CS5 Extendedを用意します。
体験版で作れるので体験版をダウンロードすればOK！
２，動画を用意します。
今回は「流れ続ける水を猫がずっと見ている」という写真を作るため、
実家の猫を使ってキッチンで動画を撮影してみました。
３，撮影した動画を先ほどダウンロードしたPhotoshopで開きます。
４，ウィンドウからアニメーションにチェックを入れる。
これで下にアニメーションタイムラインが表示されます。
５，タイムライン右上の設定をクリックし、ドキュメント設定。
そこから右下のフレーム数を15fpsにする。
６，必要な部分だけをトリミングしていきます。
今回は猫が水を見ている部分からトリミングします。
まずは青いつまみをつかんで、スタート位置に持っていきましょう。
７，次にそこから12フレーム分の画像を作成するため、
左下のコマ送りボタンを12回クリックして
その場所に終わりのつまみを持ってきます。
８，トリミングする部分が決定したらまたタイムライン右上の設定から
「ワークエリアに合わせてデュレーションをトリミング」を選択。
これによりさきほど選択した部分が残ります。
９，それでは次に猫が水を見ているシーンを表示した状態で
メニューから 選択範囲 → すべてを選択するを選択して
編集から結合部分をコピー → ペーストをクリックすると
右側にレイヤーが１つ増えます。
１０，次に上のレイヤー２を選択した状態でキーボードのQを押しましょう。
Photoshop左下のアイコンが変わりましたね。
この状態になるとマスクが出来るようになります。
１１，それではブラシツールで静止させる部分を塗っていきましょう。
100pxぐらいにした方が早く終わりますよ。
１２，塗り終わったら先ほどの左下アイコン部分をクリックしてみて下さい。
点線で静止部分が囲まれていますか？
１３，次にレイヤー１の目の部分をクリックして非表示にし、
レイヤー２をクリックして「alt（オプション）」を押しながら
レイヤー下のバー左から３番目「レイヤーマスクを追加」をクリック
１４，画像のようになったら成功です。
レイヤー１の目を表示して再生ボタンを押して確認しましょう。
「なんかおかしいな」と思ったらマスク処理まで戻りましょう。
１５，次にまたタイムライン右上の設定から
「フレームをレイヤーに結合」をクリック。
１６，レイヤーの１番下にあるレイヤー１と２をゴミ箱に入れます。
フレーム０から上だけを残します。
１７，次にタイムライン右下にある横長のアイコンを押します。
１８，タイムライン右上の設定から
「レイヤーからフレームを作成」をクリック。
１９，１番目のフレームだけが0.73秒になっているので
0秒(ディレイなし)にして更に左下の「１度」を「無限」にして
再生して動きを確認しましょう。
２０，これで完成です。
ファイルから「Webおよびデバイス用に保存」をクリック。
２１、右側の設定はこのようにして下さい。
ファイルサイズが大きいので画像サイズは幅を600pxぐらいに。
２２，保存すればできあがり！
どこかにアップして動きを確かめましょう。
ちなみにTumblr（タンブラー）はシネマグラフが動かないのですが
幅500px以下にしてサイズを500KB以下にしてあげれば
タンブラーでもシネマグラフを動かすことが可能です。
サイズを落とす時は128色にすればOK。
これでシネマグラフの作成手順を終わります。
フォトショ初心者なので適当すぎる解説でしたが、そんな僕でも出来たので誰でも簡単に作成できるかと思います♪