始める前に、前回の授業後の宿題、つまり 2 つのオブジェクトが一緒に動くアニメーションについて説明しましょう。いわゆる 2 つのオブジェクトは実際には 2 つのレイヤーであり、それぞれ正方形と円を描画し、1 つのフレームをコピーしてレイヤーの位置を相対的に移動します。技術的には難しいことではありません。 
ただし、サンプル アニメーションに注目してください。その中の円は最初は動きませんが、一定時間遅れてから始まります。これは、最初の数フレームでは、円のレイヤーではなく、正方形のレイヤーのみを移動する必要があることを意味します。正方形が数フレーム移動してから円を移動し始めると、アニメーション パレットは以下の画像のようになります。赤い矢印をクリックしてパレット オプションを開き、フレーム サムネイルのサイズを自分で設定します。緑の矢印のところに
クリックすると 1 フレームずつ再生されます。
前のフレームを再生します。
ボタンで開始フレームに戻ります。
この例は、より複雑なアニメーションは多くのオブジェクトで構成されることが多く、これらのオブジェクトがすべて一緒に移動 (移動など) するわけではないことを皆さんに伝えるために配置されました。たとえば、あるオブジェクトが別のオブジェクトに衝突するアニメーションを作成する場合、衝突したオブジェクトは、衝突するオブジェクトが接触するまで動かないままにする必要があります。
以前は、レイヤーの動きを使用したディスプレイスメント アニメーションを作成しました。また、レイヤーの透明度を異なる設定にしてアニメーションを作成することもできますが、その制作方法は、フレームごとにレイヤーパレットの部分的な透明度の値を変更するというもので、誰もが想像できると思います。次に、新しい 100×100 の画像を作成し、新しいレイヤーを作成して正方形を描きます。次に、5 つのフレームを一度にコピーすると、6 つのフレームすべてが同じ内容であることがわかります。下の左の図に示すように、すべてのフレームの滞留時間を 0.1 秒に変更します。
次に、フレーム 2 を選択し、レイヤー パレットで正方形のレイヤーの不透明度を 80% に変更し、次にフレーム 3 を 60% に変更し、フレーム 6 が 0% になるまで同様に変更します。効果は右下の図と同様です。このとき、プレイするとブロックの効果が徐々にフェードアウトしていくのがわかります。注意すべきことは、
レイヤーを非表示にするボタンは、不透明度を 0% に設定するのと同じです。
今回の制作での大きな違いは、従来の1フレームをコピーしてすぐに設定する方法と、設定後に別のフレームをコピーする方法を変更したことです。今回は全フレームを一度にコピーし、そのフレームを選択して設定します。これも製造方法です。
操作中に、別のフレームを選択するとレイヤーパレットの不透明度が 100% に戻ることは難しくありません。これは、1 つのフレームの不透明度を変更しても他のフレームには影響しないという事実を示しています。もう一度想像してみてください。この方法を使用して最初のブロックの動きを作成した場合、前のフレームでレイヤーを移動した後、次のフレームを選択すると何が起こるでしょうか?
明らかに、四角形が振り出しに戻るのが見られるでしょう。また、このときのレイヤー位置の設定が前のフレームの軌跡に沿わない場合、滑らかな動きの効果が得られません。したがって、すべてのフレームを事前に構築してから変更するこの方法は、ディスプレイスメント アニメーションや他のアニメーションには適していません。指定したフレーム数でアニメーション化する必要がある場合にのみ使用されます。
アニメーション効果を生成できる 2 つの設定、1 つはレイヤーの位置、もう 1 つはレイヤーの不透明度をマスターしたので、両方を使用して移動とフェードの両方を行うアニメーションを作成できるようになりました。これは、先ほどの単純なフェードに基づいて変更できます。つまり、フレームを選択して少し移動するなどの簡単な方法を使用します。
しかし、左端から右端に移動するエフェクトが必要です。つまり、ブロックの開始位置は左端でなければなりませんが、今ではすべてのフレームのブロックが中央にあります。どうすればよいでしょうか。 「全フレーム」が真ん中にあるので、「全フレーム」が左に行くようにしましょう。アニメーション パレット内のすべてのフレームを選択し、移動ツールを使用してレイヤーを左端に移動すると、すべてのフレームの正方形の位置が変更されたことがわかります。
別の方法もあります。アニメーションのプロセス全体は、原因と結果の関係として見ることができます。最初のフレームでレイヤーを削除すると、そのレイヤーは後続のすべてのフレームに存在しなくなります。したがって、Photoshop のアニメーション設定では、最初のフレームは比較的特殊です。次に、最初のフレームを選択し、下の左図の赤い矢印で示されているように、レイヤー パレットで「フレームをスプレッド 1」が有効になっていることを確認します。次にレイヤーを移動すると、下の右の図に示すように、すべてのフレームのブロックが均一に移動していることがわかります。 「Propagate Frame 1」が無効な場合は、フレーム 1 のブロック位置のみが変更されます。
どちらの方法にもそれぞれ長所と短所があります。「フレーム 1 の伝播」は実際には「フレーム 1 の伝播」を意味し、アニメーション全体の特定のオブジェクトの設定を簡単に変更できます。全フレームを選択する方法はフレーム数が多い場合には少し面倒ですが、例えば最初の3フレームだけを変更したい場合には「特定のフレームを選択する」方法から派生して選択することができます。最初の 3 フレームを一緒に設定してください。
なお、「Propagate Frame 1」は、元々フレームごとに異なるレイヤー位置が設定されていた場合でも有効です。この効果は、すべてのフレームの座標が最初のフレームに従ってオフセットされることと同等です。
複数のフレームを選択する問題についてもう一度説明します。最初の 4 フレームを選択する場合は、最初にフレーム 1 を選択し、次に Shift キーを押しながらフレーム 4 をクリックするか、その逆の方法で行うことができることはすでにわかっています。終わり。ただし、フレーム 1、フレーム 3、フレーム 4 などの不連続なフレームを選択する場合は、最初に前述の方法に従ってフレーム 1 ～ フレーム 4 を選択し、次に CTRL キーを押しながらフレーム 2 をクリックして、フレーム 2 をクリックします。選択されたフレーム 2。この操作を 1 回繰り返して、選択枠 2 を追加します。フレーム 2、フレーム 11、フレーム 17、およびフレーム 27 など、遠くにある個々のフレームを選択する場合は、最初にそれらのいずれかを個別に選択し、CTRL キーを押したまま他のフレームを追加して選択できます。
すべてのフレームのブロックを左に移動した後、ブロックの位置をフレームごとに設定するだけです。つまり、2 番目のフレームを少し移動し、3 番目のフレームを少し移動するように選択します。もちろん、すでに述べたように、スムーズな動作を確保することが難しいという問題があります。 Photoshop では、移動ツールを選択するときに、キーボードの矢印キーを使用してレイヤーを一度に 1 ピクセルずつ移動し、Shift キーを使用して長距離を移動できることを学びました。
次にフレーム 2 を選択し、SHIFT+右矢印キーで移動してみましょう。次に、フレーム 3 を選択します。このフレームのブロックは開始点に戻っているため、SHIFT + 右矢印キーを 2 回押す必要があります。フレーム 4 では 3 回というように続きます。設定は以下に示すものと同様です。 6フレーム目では四角が消えているので設定は不要です。
方向キーを使用して移動する方法は、軌道の一貫性を確保できますが、その限界も明らかです。つまり、水平、垂直、または 45 度の角度などの軌道を作成する場合にのみ適しています。よりランダムな移動軌跡 (円弧など) が必要だが、滑らかさを維持したい場合はどうすればよいでしょうか?もちろん、最初から「フレームをコピーしてレイヤーを移動する」方法を使えば今回のようなトラブルは起こらないと誰もが言うでしょうが、モーション軌道を修正するのが一般的であることを忘れないでください。そのため、どのように運用するかをよく考えてください。