GIFアニメーションを使った動作検証をする機会があったので、PhotoshopでGIFアニメーションを作成する方法を試してみました。
作成方法
Photoshop上部メニューの ウィンドウ > タイムライン を選択します。
タイムラインパネルが表示されるので、真ん中に表示されているボタンの下矢印をクリックして、「フレームアニメーションを作成」を選択します。
ボタンのテキストが「フレームアニメーションを作成」に変更されるので、ボタンをクリックします。
タイムラインパネルにフレームが表示されました。
GIFアニメーションで表示する内容を追加します。
タイムラインパネル下部の「選択したフレームを複製」をクリックして、フレームの複製を行います。
各フレームでレイヤーの表示/非表示を設定します。
各フレームの下部で表示する時間を設定します。
タイムラインパネル下部の「アニメーションを再生」で動作の確認を行えます。
問題ないようなら、ファイル > 書き出し > Web 用に保存 を選択します。
最適化ファイル形式を「GIF」にして、保存をクリックします。
これでGIFアニメーションが作成できました。
GIFアニメーションのデモページ
タイムラインパネル下部のループの設定から、ループの回数も変更できます。
先ほどは「無限」でしたが、「一度」に変更してみます。
アニメーションが1順だけになりました。
GIFアニメーションのデモページ2
【参考サイト】
コメントが承認されるまで時間がかかります。