GIFアニメ　〜 アニメーション画像を作ってみよう！ 〜

GIFアニメとは、↓のように動いているように見える画像のことです。
当サイトの素材では、特にNPCでGIFアニメの素材を置いています。




Lesson6では、↑のGIFアニメ画像を例として説明していきます。

まず、動きに合わせて画像を用意します。　※Lesson1〜5を参考にしてください。
例では、↓の3枚の画像を使っています。
それぞれ腕のあたりが違っています。

1.
2.
3.


例のGIFアニメでは、↓のような動きの繰り返しとなっています。
※↑の2番目の画像を2回使っています。

⇒⇒⇒⇒最初に戻る　



それでは、実際に動かせてみましょう！

GIFアニメを作るソフトを紹介します。
管理人が使っているのはGiamです。フリーソフトで使いやすいです。

ダウンロードサイトはこちら




Giamを使って説明していきます。
インストール後、起動すると↓のようなウィンドウが出てくると思います。




画像ファイルを開きます。
メニューアイコンのから画像ファイルを読み込んでも構いませんが、
ドラッグ＆ドロップで複数の画像を一気に読み込めます。
左側のグレーの四角い枠内か、その下の白い四角の中にドラッグしてください。



↑のように画像が表示されれば読み込みできています。

画像背景が水色になっていますが、これは透過している色が表示されているだけで、
実際に作成したGIFアニメには表示されません。
しかし、真ん中下あたりの「透過色の使用」のチェックボックスのチェックを外すと
背景まで表示されてしまいます。



次に、（この場合では）2コマ目の画像をコピーして、4コマ目として貼り付けます。


↓「コピー」したら「コマの付け足し貼付け」を選択





すると、4コマ目に2コマ目と同じ画像が表示されます。




次に、コマの動く時間などを設定します。



1〜4コマをすべて選択し、右の「ウェイト」を50、「消去手段」を背景色でつぶすにしてください。

※違う動きをするときは、それぞれウェイトを変更してください。




では、実際に動作サンプルを見てみます。
メニューアイコンのをクリックしてください。
↓のようなウィンドウがでてきます。


↑のようにきちんと動作していればOK！



「ファイル」→「名前を付けて保存」、　もしくはをクリックして保存します。

保存するときに、↓のようなウィンドウがでてきますが、特に変更せずに保存して大丈夫です。


これで、GIFアニメの説明は終わりです。
おつかれさまでした〜！