ハイッ、Cinemagraphのチュートリアル、要点のみテキスト版

［最終更新日］2012年6月28日

何で？って感じで、先月アップした Cinemagraph の記事に人が来ているんですけど、何かあったのかしら。

» 部分的にアニメーションになっているCinemagraphってどうやって作るんだ？

。。。Cinemagraph というのはこういう画像です。

熱湯注意 :Cinemagraph

一列だけスワイプできるんだぜ

さて、先月アップした Cinemagraph の記事に Photoshop を使った Cinemagraph 制作手順のビデオチュートリアルを紹介していますが、ある程度わかってしまうと動画を観なおすって面倒ですよね。かといって、手順が長いと作業している途中、部分的にわからないところが出てきたりして、観ないわけにもいかないというジレンマが。。。

ということで、自分でチャレンジしたとき、ビデオチュートリアル内の要点だけテキストに書き起こしましたので、よろしければどうぞ。Evernote にでもクリップして下さいｗ

Photoshop CS4 Extended、CS5 Extented を使った Cinemagraph の作り方

Photoshop がある程度わかっているひと向けの内容です。

.movファイルを開く
タイムライン右上角のフライアウトメニュー[ドキュメント設定]でフレームレート(fps)の設定を行う。
ビデオでは[カスタム]を選んで[15]に設定
動画の必要な部分を切り出す。
タイムラインのルーラーを使って指定してもいいし、右上角のフライアウトメニューから[ワークエリアの開始時間を設定][ワークエリアの終了時間の設定]で指定してもOK。
ルーラーを使う場合は、ポイントを合わせるときに[Shift]キーを押しながら合わせるとスナップされる（ピタッと止まる）。
サンプル動画では12コマ目を終了時間に設定している。左下の一コマずつ進めるアイコンをクリックしてコマ送り。
フライアウトメニュー内の[ワークエリアに合わせてデュレーションをトリミング]をクリック
静止画を選択する。どのフレームを静止画に使うか選択する。
[Ctrl]+[A]で全選択→[編集]→[結合部分をコピー]→[編集]→[ペースト]
[Q]キーを押してクイックマスクモードにする。もしくは左ツールバーの一番下のクイックマスクアイコンをクリック。
[B]キーを押してブラシツール選択。もしくはブラシアイコンをクリック。
カラーパレットは描画色[黒]、背景色[白]の状態
静止画[レイヤー2]の静止させたいところを塗りつぶす。赤くなる。
[Q]キーを押してクイックマスクモード解除。
ここでレイヤー1の目玉アイコンを消すと静止させたい部分がちゃんと塗りつぶされているか確認できる。
[Alt]キーを押しながら、レイヤーパレット下にある[レイヤーマスク追加]ボタンを押す。(レイヤー2にマスクが追加される)
タイムラインのフライアウトメニュー内[フレームをレイヤーに統合]をクリック
元になったレイヤー1とレイヤー2を削除。
タイムライン右下角のアイコンを押してアニメーションをフレーム表示にする。
フライアウトメニュー内の[レイヤーからフレームを作成]をクリック。
一番最初のフレームのディレイを[0秒]にする。
ループを[一度]から[無限]に変更。作業終了。あとは書き出し。
[ファイル]→[Webおよびデバイス用に保存]
上から[GIF]、[特定]、[パターン]、透明部分にチェック[透明ディザなし]、[インターレス]にチェック、[モニターカラー]。リサイズして保存。