PhotoshopでGIFアニメを自作してみた。意外と簡単。

アニメーションさせる画像(レイヤー)が用意出来たら動きを付けていきます。

まずはメニューの『ウィンドウ』から『アニメーション』クリックします。

スクリーンショット 2016 04 28 18 46 48

するとこのようなアニメーションパネルが出てきます。

スクリーンショット 2016 04 28 18 47 16現段階でフレームは1つ

次に1枚目に表示させたレイヤー以外を非表示にします。

スクリーンショット 2016 04 28 18 47 58上3つのレイヤーを非表示

次に表示時間を設定して、フレームを追加していきます。

スクリーンショット 2016 04 28 18 48 21

スクリーンショット 2016 04 28 18 58 51赤丸で囲ったボタンを押せばフレームが追加される

フレームが追加されたら、2枚目に表示したいレイヤーを表示状態にします。

スクリーンショット 2016 04 28 18 51 092番目のレイヤーを表示

後はコレを繰り返す

スクリーンショット 2016 04 28 18 51 43

スクリーンショット 2016 04 28 18 52 01

これで完成です。スピードなんかはお好きに調整してみてください。

最後に

最後に罠が仕掛けてあります。

実はこのまま保存してもGIFアニメとしては保存してくれません。GIFアニメとして保存するには『Web およびデバイスように保存…』で保存する必要があります。

これが分からず、数分間悩ました(汗)

スクリーンショット 2016 04 28 18 52 43

形式をGIFに設定して『保存』。

スクリーンショット 2016 04 28 18 56 50

コレでしっかりとGIFアニメとして保存できているはずです。

意外と簡単にGIFアニメが作れたでしょ?ちょっとハマってしまいそうです。もっと本気のアニメーションとか作りたくなってきます。(笑)

このGWは家にこもってGIFアニメでも作ろうかな・・・。

(by ユウ)

新着記事

もっと読む