Photoshopで独自のカスタムGIFをアニメートする方法

Photoshopでゼロからアニメーションを作成するのは大変かもしれませんが、実際には非常に単純です。 Photoshopを起動し、あなたのファイルのいくつかをつかみます。アニメーションGIFをたくさん使って友達のズボンをいらいらさせる時が来ました!

動画とYoutubeのリッピングをアニメーションGIFに変換する簡単な方法について説明しましたが、今日は動画ファイルを使用せずに簡単なアニメーションを作成する方法を紹介します。読んでください - これはとても楽しいです.

Photoshopのアニメーションツールを使ってアニメーションを作成する

単純なアニメーションの場合は、移動可能な別のレイヤーに画像の一部を作成します。目の動きをアニメーション化するだけですが、実際の手描きのアニメーションセルや動く写真など、このようにしてあらゆる種類のアニメーションを作成できます。.

何をアニメートするかにかかわらず、少なくとも2つのレイヤーから始めます。この例では、HTGロゴを使用していて、動きをアニメートするために使用できる2つ目のレイヤーに目を動かしています。.

はじめに、アニメーションパネルを引き上げます。 Window> Animationに移動してそれを見つけます.

パネルはウィンドウの下部に表示され、使い方はとても簡単です。アニメーションのそれぞれの新しい「フレーム」は、ファイルのスナップショットのようなものです。クリックファイルの現在の状態から新しいスナップショットを作成したいときはいつでもアニメーションパネルで。しかしまだ!

このパネルでは、個々のフレームに「遅延」を設定することもできます。つまり、次のフレームに進む前に画面に表示される時間（全体または数分の1秒）を意味します。毎秒25フレーム（0.04）がアニメーションの標準速度ですが、アニメーションGIFの場合は多少速いかもしれません。この例では、0.05の遅延で妥協しましたが、これも使用できます。 1秒あたりのフレーム数を変えたい場合は、1を適切な遅延時間を得るためのフレーム数で割ってください。（たとえば、1秒を25フレームで割った値は、0.04の遅延時間になります。）

アイデアは、目のレイヤーをに移動することです。 少しずつ 途中でスナップショットを撮ります。私たちは使っているよ 移動ツール （ショートカットキー「V」） 私たちの層をナッジする を使用して 矢印キー. この例では、2ピクセルごとにナッジした後にスナップショットを撮りました.

をクリックしてパネルでは、アニメーションで作成された新しいフレームを見ることができます。それらはフレームの時間遅れをそれらの前に取るので、あなたは最初の場所で正しい遅れを選ぶことを望むかもしれません、それであなたが画像をキャプチャし終えたらあなたはフレームの負荷を変える必要はありません。.

（作者注：あなたが私のようなものであれば、とにかく、何百万回もの遅延を微調整することになるでしょう。物事はあなたがそれらを望む正確な方法をいつもうまくいくわけではありません！）

レイヤーパネルを使ってオブジェクト（この例では目）を動かしながら、好きなようにスナップショットをたくさん撮りながら、フレームをレイアウトします。 25秒程度は1秒になりますので、それに合わせてスナップショットを撮ってください。.

また、Shiftキーを使用して多数のフレームまたはすべてのフレームを選択し、遅延を変更することによって、複数のフレームの遅延を一度に編集することもできます。 0.05のカスタム遅延を使用するには、一番下の方で遅延を「その他…」に設定できることに注意してください。.

[ファイル]> [Webとデバイス用に保存]に移動して、同じ名前のツールを開きます。.

このツールを使用すると、ブラウザにやさしいアニメーションGIFを作成したり、ツール内でテストしたりすることができます（上の矢印カーソルの位置）。ファイルタイプを必ずGIFに設定し、[知覚]、[選択]、または[適応]のいずれかの設定を使用してください。これらはあなたのイメージを異なる方法で変えることができます、しかしあなたの多くにとってはほぼ同じ結果を与えるでしょう。ファイルサイズを小さくするには、 画像サイズ （下に向かって）そしてあなたの数色（右上）. 私たちの例にはありませんでしたが、透明度を含めないことによってファイルサイズを減らすこともできます。おっと!）.

そして、私たちのアニメーションGIFは、畏敬の念、衝撃、そして畏敬の念を起こさせるためにWeb上に配置する準備ができています.

そしてそれはアニメーションのためにそれをまとめます。私たちの方法についての考えや質問は？もっと良い方法、あるいはもっと簡単な方法がありますか。もっと高度なものを見たいですか？コメントでそれらについて教えてください、または[email protected]で私達にあなたの考えを送ってください、そして私たちは今後のグラフィックスの記事にそれらを含めるかもしれません.