Photoshop CS6 betaの動画編集2 | 3倍早くなるためのDTP講座

3倍早くなるためのDTP講座

DTPの作業を早くするためのテクニックを綴っていこうと思っています。

●フレームアニメーション

3倍早くなるためのDTP講座
↑IllustratorとPhotoshop CS6betaで作ったGIFアニメ。楕円ツールのみ使用^^

Photoshop CS6(beta版)でパネル名は「アニメーション」から「タイムライン」になってしまいましたが、フレームアニメーションも健在です。

フレームアニメーションは単純に、1フレームごとに画像が差し替わるパラパラまんがのようなアニメーション方式です。

レイヤーをフレーム化すれば簡単に作成できるので、Illustratorのレイヤーをアニメートすることも可能です。ブレンドしたものをレイヤー分配すれば超手軽にアニメが作れます。

ちょっとだけ作例を。

3倍早くなるためのDTP講座
↑元を描きます。ブレンドを使うのでオブジェクト数(アンカー数)と上下関係は同じにしておくこと。わかりやすくずらしていますが、実際には同座標に置きます。



3倍早くなるためのDTP講座
↑ブレンドで中割りを自動生成。



3倍早くなるためのDTP講座
↑ブレンドとグループを解除してレイヤーに分配



3倍早くなるためのDTP講座
↑レイヤー込みでphotoshop形式で書き出し、photoshopで開きます。


そしてフレームアニメーションを作成し、レイヤーをフレームに変換するだけです。

3倍早くなるためのDTP講座
↑web用に書き出しでGIF形式にすればアニメーションGIFのできあがり。もちろん、ムービー形式での書き出しも可能です


さらに、調整レイヤーを使えば一括しての色調補正も可能になります。

3倍早くなるためのDTP講座
↑ここはPhotoshopの強みですね

ちなみに、ディレイとは絵を止める時間のこと。パラパラまんがは一定のスピードでフレームを差し替えます。例えば1秒間に10フレームなら0.1秒ごとに差し替わる計算です。

そこに、3フレーム目にディレイを1秒入れると、3フレームで1.1秒止まってから次のフレームに移ります。




3D効果を使えば地球が回るのも作れます。

3倍早くなるためのDTP講座
↑継ぎ目はみなかったことにして^^

Illustrator上で回転の数値を90°変えた4コマ作ってブレンドしただけ。ブレンドなら中間のフレームは数値入力で生成できるので、滑らかに動かす場合は数値を増やすだけです。

$3倍早くなるためのDTP講座

↑3D効果のY軸をいじるだけ


まあ、ほんとの3Dを使う方がきれいだし管理も簡単なのですが、DTP経験があれば作れますよってことで。こんなものでなく実際はいろいろ応用してください。^^

ちなみに地球のマッピングデータ、懐かしいと思った方いますか?
これ、古いMacのAdobe Dimensionsのチュートリアルデータから引っ張ってきました。
だって、Dimensionsの正規ユーザーですから。^^