最近、いとこの面白い写真を何枚か撮ったので、Google+ によって自動的に作成される「Auto Awesome」を使用する代わりに、独自のアニメーション GIF を作成したいと考えました。Photoshop CS6 がインストールされているので、試してみてどうなるか見てみようと思いました。最初は、画像を別々のレイヤーにインポートしてから、アニメーション付きの GIF ファイルとして保存するだけで、かなり簡単だと思いました。違う!
この方法で GIF を作成しようとすると、[Web 用に保存] ダイアログの [アニメーション] セクションがグレー表示されていることに気付くでしょう。これを有効にしてループ オプションを選択できるようにするには、Photoshop CS6 でフレーム アニメーションと呼ばれるものを作成する必要があります。複雑に聞こえますが、実行するのは非常に簡単です。この投稿では、静止画像を使用して独自のアニメーション GIF を作成する手順を説明します。
また、ビデオをインポートしてアニメーション GIF に変換する方法についても説明します。ビデオをインポートするときのインポート プロセスのみが異なり、残りの手順は同じです。
ステップ 1 – すべての画像をインポートする
最初に行う必要があるのは、すべての画像を 1 つの Photoshop ファイルの個別のレイヤーにインポートすることです。たとえば、6 つの画像がある場合は、それらすべてを Photoshop で開き、新しいファイルを作成して、各画像をコピーして新しいファイルの個別のレイヤーに貼り付けます。レイヤー 1 が最初の画像であり、最後のレイヤーがアニメーションの最後の画像である必要があります。

プロセスのこの部分は、おそらくすべてのステップの中で最も時間がかかります。おそらく、Photoshop でこれを行うより簡単で高速な方法があると思いますが、私はプロ ユーザーではないので、各画像を手動でコピーして、新しい Photoshop ファイルに貼り付けました。もっと早い方法をご存知の方はコメントで教えてください。
ステップ 2 – フレーム アニメーションの作成
2 番目のステップは、Photoshop 自体で実際のアニメーションを作成することです。これを行うには、まずタイムライン ウィンドウを開く必要があります。[ウィンドウ]に移動し、[タイムライン]を選択します。
![Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法 Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法]()
画面の下部にタイムラインウィンドウが表示されます。最初は完全に空である必要があります。フレーム アニメーションを作成するには、[タイムライン] ボックスの任意の場所を右クリックし、[フレーム アニメーションの作成]を選択します。
![Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法 Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法]()
これを行うと、タイムラインに画像が 1 つだけ表示され、左上隅に小さな 1 が表示されます。レイヤーパネルで選択した画像か、最後に追加されたレイヤー (アニメーションの最後の画像) のいずれかになります。この時点では、これは 1 フレームのアニメーションであり、これは私たちが望んでいるものではありません。
![Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法 Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法]()
代わりに、すべてのレイヤーをアニメーションに含める必要があります。これを行うには、タイムライン ウィンドウの右端にある小さな下矢印ボタンをクリックする必要があります。小さな下向き矢印と、その横に数本の水平線があります。それをクリックすると、 Make Frames From Layersというオプションが表示されます。
![Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法 Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法]()
ファイルにある各レイヤーのフレームが表示されます。各フレームには、画像の下に小さなドロップダウンもあり、各フレームを表示する時間を選択できます。
![Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法 Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法]()
上記のように、最初のフレームは 5 秒で、残りは 0 に設定されています。それに応じて調整する必要がありますが、カスタムの時間を選択することもできます。
![Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法 Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法]()
各フレームの時間を選択したら、新しいアニメーションを GIF ファイルに保存する最終ステップの準備が整います。
ステップ 3 – GIF ファイルを保存する
次に、アニメーション GIF を保存します。これを行うには、[ファイル]に移動し、[Web 用に保存]をクリックします。保存ダイアログの一番下に、グレー表示されていないアニメーション セクションが表示されます。
![Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法 Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法]()
ここでのオプションは非常に理解しやすいものです。ループ方法を選択してから、保存する前にアニメーションをプレビューすることしかできません。それはそれについてです!このガイドが、Photoshop CS6 で問題なくアニメーション GIF を作成するのに役立つことを願っています!
結論
言及する価値のあることがいくつかあります。まず、アニメーション GIF が大きすぎる場合は、複数のレイヤーを含む最終的な Photoshop ファイルを作成する前に、個々の画像のサイズを縮小する必要があります。アニメーションを作成するために写真の一部だけが必要な場合は画像をトリミングするか、画像全体のサイズを小さくすることができます。
次に、ビデオがある場合は、 [ファイル]に移動し、[インポート]をクリックして [ビデオ フレームをレイヤーに]をクリックすることで、ビデオ フレームをレイヤーに自動的にインポートできます。
![Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法 Photoshop CS6 を使用して画像からアニメーション GIF を作成する方法]()
それだけです。繰り返しますが、サイズを管理するために、画像の品質を下げて小さな GIF ファイルを作成する必要がある場合があります。楽しみ!