Photoshopを使ってGIFアニメーションを作成する方法

PDF形式でダウンロード

PDF形式でダウンロード

この記事には：

ゼロから作成する

動画から作成する

関連記事

参照

このガイドでは、Adobe Photoshopを使って、GIFアニメーションをゼロから作成する方法、また、動画を変換してGIFアニメを作成する方法をご紹介します。CS6以降のバージョンのPhotoshopを使用します。

ステップ

方法 1

方法 1 の 2:

ゼロから作成する

PDF形式でダウンロード

1. 
   1
   Photoshopを開く　薄い青の「Ps」という文字が濃い背景に描かれたアイコンです。
2. 
   2
   新規ファイルを作成する　新規ファイルを作成するには、次の操作を行います。

   • ファイル をクリックします。
   • 新規 をクリックします。
   • 画像のサイズを選択します。
   • OK をクリックします。
3. 
   3
   それぞれのフレームにつきレイヤーを1つ作成する　GIFアニメでは、各レイヤーが1つのフレームとなります。手書きでアニメーションを描いたり、一連の静止画からアニメーションを作成する場合、各フレームがそれぞれ1つのレイヤーになるようにしましょう。新しいレイヤーを作成する方法はいくつかあります。

   • レイヤーパネルの下部にある新規レイヤーアイコンをクリックします。
   • レイヤー、新規をクリックして、レイヤー をクリックします。
   • Shift+Ctrl+N（Windowsの場合）、またはShift+Command+N（Macの場合）を押します。
4. 
   4
   ウィンドウ、そして タイムライン をクリックする　タイムライン をクリックすると、動画エディタのタイムラインに類似した、タイムラインパネルが画面の下部に表示されます。
5. 
   5
   フレームアニメーションを作成 をクリックする　まず、

   

   ボタンを押して、オプションを表示する必要があるかもしれません。
6. 
   6
   タイムラインパネルの右上にある ☰ をクリックする　 ☰ をクリックすると、ドロップダウンメニューが表示されます。
7. 
   7
   レイヤーからフレームを作成 をクリックする　クリックすると、各レイヤーがGIFアニメのフレームに変換されます。
8. 
   8
   下の方にある「一度」の隣にある

   

   をクリックする　これは、アニメーションを繰り返す回数を指定するオプションです。
9. 
   9
   無限 を選択する　無限 を選択すると、GIFアニメが無限に繰り返されます。

   • アニメーションの中で、あるフレームを長めに表示させたい、または短めに表示させたい場合は、各フレームの下にある
     
     アイコンをクリックして、タイミングを調整することも可能です。
10. 
    10
    ファイル、そして 書き出し をクリックして、Web用に保存（従来） を選択する　ウェブ向けフォーマットの画像に対するエクスポートオプションが開きます。
11. 
    11
    保存 をクリックする　GIFを低品質のファイルとして保存して、速く読み込めるようにしたい場合は、まず、最適化、そして、2アップ、または 4アップ タブをクリックして、各画像プレビューの左下に示されるファイルサイズが小さいものを選択しましょう。

    • 右側のドロップダウンメニューで「GIF」が選択されていることを確認しましょう。
12. 
    12
    ファイル名と場所を指定して、保存 をクリックする　これで、GIFアニメが書き出されます。書き出された画像ファイルを開き、ウェブに投稿したり、お友達に送信したりできます。
    広告

方法 2

方法 2 の 2:

動画から作成する

PDF形式でダウンロード

1. 
   1
   Photoshopを開く　薄い青の「Ps」という文字が濃い背景に描かれたアイコンです。
2. 
   2
   動画ファイルを開く　動画ファイルを開くと、動画がPhotoshopに読み込まれ、画面下部のタイムラインパネルに配置されます。動画ファイルをPhotoshopに直接ドラッグアンドドロップするか、以下の操作を行い動画を読み込みます。

   • ファイル、そして開く をクリックします。
   • 動画ファイルを選択します。
   • 開く をクリックします。
3. 
   3
   動画の長さを調整する　タイムライン上の動画ファイルの最初または最後をクリックし、反対側へドラッグして、動画の再生開始位置と再生停止位置が調整します。

   • 変更内容をプレビューを確認したい場合は、ライムラインパネルの左側にある再生ボタンを押すと、いつでもプレビューが確認できます。
4. 
   4
   速度を調整する　動画の再生速度を速くしたり、遅くしたりしたい場合は、タイムライン上のフレームを右クリックして、速度のパラメータを変更しましょう。パーセンテージを入力できます（たとえば、50%では動画が半分の速度で再生され、200%では2倍の速度で再生されます）。または、次の操作を行います。

   • 
     をクリックして、スライダーを左、または右に動かして速度を手動で調整しましょう。
5. 
   5
   画像サイズを変更する　HD画質の動画を読み込んだ場合、画像サイズがかなり大きくなる可能性があります。作成したGIFアニメをウェブサイトにアップロードして、読み込みに時間がかからないようにしたい場合は、画像サイズを小さくすることをお勧めします。画像サイズを小さくするには以下の操作を行います。

   • 画像 をクリックします。
   • 画像サイズ をクリックします。
   • 新しい画像サイズを入力します（HD動画の推奨サイズは350×197です）。
   • OK をクリックします。
   • 変換 をクリックします。
6. 
   6
   ファイル、そして 書き出し をクリックして、Web用に保存（従来） を選択する　ウェブ向けフォーマットの画像に対するエクスポートオプションが開きます。
7. 
   7
   画質を選ぶ　GIFを低品質のファイルとして保存して、速く読み込めるようにしたい場合は、まず、最適化、そして、2アップ、または 4アップ タブをクリックして、各画像プレビューの左下に示されるファイルサイズが小さいものを選択しましょう。

   • 右側のドロップダウンメニューで、JPEGやPNGではなく、アニメーションに対応しているGIFが選択されていることを確認しましょう。
8. 
   8
   ループオプション の隣にある

   

   をクリックして、オプションを選択する　ウィンドウの右下にあるオプションです。GIFアニメを1回だけ再生するか、無限にループさせるか選択します。
9. 
   9
   保存 をクリックする　保存 をクリックすると、保存ウィンドウが開きます。
10. 
    10
    ファイル名と場所を指定して、保存 をクリックする　これで、GIFアニメが書き出されます。書き出された画像ファイルを開き、ウェブに投稿したり、お友達に送信したりできます。
    広告

ポイント

• ループのオプションでは、「1度」または「無限」の他に「その他」を選択して、アニメを繰り返したい回数を数字で指定することも可能です。

広告

注意事項

• 途中でミスをしてしまい、頑張って行ってきた作業が水の泡となってしまわないように、作業内容を頻繁に保存するようにしましょう。

広告