久しぶりにCinemagraphを作ってみました。
湖面の波紋だけではつまらないので、髪の毛も風になびく効果も入れてみました。
作り方のメモ
１．湖面の波紋
水面に映った画面が波打つ効果を作るwebサービスはいくつかありますが、以下のサイトを使いました。かなりきれいにGIFアニメ化できます。
『LUNAPIC』
［Animation】タブの［Reflecting Water］で水の波紋の効果を加えます。
２．フレームに分解
１．で作成したGIFアニメをフレームに分解します。これをきれいに分解できるwebサービスを提供している以下のサイトを使います。
『EZGIF.COM』
［Split］タブで、１．で作ったGIFアニメーションを読み込み、フレームに分解し、ダウンロードします。
３．Photoshopにフレームを読み込む
Photoshopに２．でダウンロードしたフレームを読み込みます。
［File］⇒［Scripts］⇒［Load Filter into Stack］
下のダイアログが開くので、①［Folder］を選択し、②[Browse]をクリックして、２．でダウンロードしたフレームのフォルダを指定して、③［OK］。
［Create Smart Object after Loading Layer］にチェックを入れるとちょっと面倒なことになるかも。
このチェックは外しておき、後でスマートオブジェクトに変換した方が良いと思います。チェックが入っていると、フレームの枚数にもよりますが、とても時間がかかり、フリーズする原因になります。フレームを変形させるときは、必ずスマートオブジェクトに変換します。今回は変形しないのでそのまま読込み。
４．風になびく髪の毛
PhotoshopのHair Blushで描いた髪の毛をワープを使って変形しています。
５．効果の合成
Photoshopで二つの効果を合成して、GIFアニメーションとして出力
６．時間の微調整
GIAMを使って、各フレームの表示時間を微調整しています。
Photoshopでプレビューしたときと実際にGIFアニメで出力したときとでは、表示が違うことが多々あるので、時間の調整にはGIAMを使います。フレーム１枚１枚、微妙に時間を変更。
７．周辺のトリミング
画像の縁の部分がチラチラしてきれいにできないので、トリミングして削除します。
上のwebサービスを使います。
作業は以上です。いろいろなサービスを使っていてめんどくさそうですが、10分程度の作業です。この品質のものを作るにはこの方法がおすすめです。
webサービスはたくさんあるのですが、出力するとサイズが小さくなったり、ロゴが入ったりとさまざまな問題があります。最大の問題はアップロードできるファイルのサイズの制限でしょうか。
きれいなGIFアニメを作るには、ある程度の大きさが必要です。
今回の作品は、画面サイズが422px x 562px、ファイルサイズが1.16MBです。ファイルサイズが少し大きい気がしますが、この画質なので、こんなものかも知れません。
