フォトショップ無料素材制作講座84「FireWorksで作るアニメーションgifの作成手順」

アニメーションgifの作り方の手順を説明します。




ステップ１



まず写真、もしくはイラストを用意します。




ステップ２


アニメーションをさせるには、画像が数枚必要になります。
簡単なイラストであれば、各コマに合わせてイラストを書いてしまえばよいですが、
こういった人間の写真の場合はそうはいきません。
こういう場合はフォトショップで加工します。
今回は口を動かすのと、まばたきをさせたいと思ったので、
フォトショップでそれぞれの表情を作りました。
それぞれの画像を保存し、フォトショップを閉じます。




ステップ３


ここからはFireWorksでの作業となります。
先ほど保存した画像をFireWorksで開きます。
最初にアニメーションのフレーム（1コマ目）にしたい画像を選び、画面右端にあるフレームを選びます。
フレーム1には、今選んでいる画像が入っているので、次に2フレーム（2コマ目）に写真をいれたいと思います。
上記写真の赤丸で囲んだ部分をクリックします。
新しい空フレームが作成されました。
この空フレームを選んだ状態で、別の画像をドラックします。
するとこのフレームに画像が入りました。



ステップ４


上記と同じ手順で、各フレームに画像をあてはめていきます。
一通り作業が終わったら、一度動きを確認してみましょう。
上記写真赤丸で囲んだ部分をクリックすると、アニメーションが再生されます。
なにか動きが違うなとおもったら、フレームを削除したり、フレームの継続時間の設定などを変えたりして調整しましょう。





ステップ５


完成したら画像を保存しましょう。
ここでの保存形式はGIFはGIFでも、アニメーションGIFで保存しましょう。
そうしないと、せっかく作ってもアニメーションされません。
これで完成です。