Animate でフレームとキーフレームを使用する方法

Adobe Animate ドキュメントでは、映画フィルムと同じように、時間の長さをフレームに分割します。フレームはアニメーションの芯になるもので、時間や動きを記録するために使用されます。ムービー内のフレームの総数と、フレームの再生速度によって、ムービー全体の長さが決まります。以下では、フレームに関するいくつかの概念を簡単に説明します。

フレーム

タイムラインでは、これらのフレームを操作してドキュメントのコンテンツを整理および制御します。タイムラインにフレームを挿入する際には、フレーム内のオブジェクトが完成したコンテンツで表示される順序どおりに挿入してください。

キーフレーム

キーフレームは、タイムラインで新しいシンボルインスタンスが表示されるフレームです。ドキュメントの様々な面を制御する ActionScript® コードを含んだフレームも、キーフレームとして扱われます。後で追加するシンボルのプレースホルダーとして、またはフレームを明示的に空白にしておくために、空白キーフレームをタイムラインに追加することもできます。

キーフレームを使用すると、位置を設定したり、アンカーポイントやアクション、コメントなどを追加したりできます。 

スパン

スパンベースのフレーム選択を使用すると、2 つのキーフレーム間のフレーム範囲を 1 回のクリックで選択できます。

静的フレームスパン

静的フレームスパンでは、スパンの期間中はずっと同じコンテンツが表示されます。このタイプのスパンは、グラフィックを一定時間表示する必要がある場合に使用します。 

トゥイーンされたフレームスパン

トゥイーンされたフレームスパンでは、スパン期間中の各フレームでコンテンツが変化します。このタイプのスパンは、アニメーションを作成するときに使用します。 

タイムラインへのフレームの追加または挿入

• 新しいフレームを挿入するには、挿入／タイムライン／フレーム（F5 キー）を選択します。

• キーフレームを作成するには、挿入／タイムライン／キーフレーム（F6 キー）を選択するか、キーフレームを配置するフレームを右クリック（Windows）または Control キーを押しながらクリック（Mac OS）して、コンテキストメニューから「キーフレームの挿入」を選択します。

• 空白キーフレームを作成するには、挿入／タイムライン／空白キーフレームを選択するか、キーフレームを配置するフレームを右クリック（Windows）または Control キーを押しながらクリック（Mac OS）して、コンテキストメニューから「空白キーフレームを挿入」を選択します。

フレーム上の効果

フィルターとカラー効果はムービークリップのみに適用されます。高度なレイヤーを使用すると、フィルターやカラー効果を選択したフレームに適用できるようになりました。これにより、シェイプ、描画オブジェクト、グラフィックシンボルプなどを含むすべてのコンテンツに適用できます。レイヤーエフェクトは、複数のテキストフレームでクラシック、シェイプ、および IK トゥイーンを使用してトゥイーンすることもできます。

詳しくは、レイヤー効果の適用を参照してください。

タイムライン内のフレームの選択およびラベル付け

Animate では、2 通りの方法を使用してフレームを選択できます。また、コンテンツを整理するために、フレームにラベルを付けることもできます。 

Animate には、タイムラインでフレームを選択する方法が 2 通りあります。フレームベースの選択（デフォルト）では、タイムラインでフレームを 1 つずつ選択します。スパンベースの選択では、シーケンス内のフレームをクリックすると、そのフレームシーケンス全体（キーフレームからキーフレームまで）が選択されます。 

タイムラインでのフレームの選択

単一または複数のフレームの選択

• フレームを 1 つ選択するには、そのフレームをクリックします。 

• 連続する複数のフレームをまとめて選択するには、選択対象のフレーム全体をドラッグして囲むか、Shift キーを押しながら追加のフレームをクリックします。

• 連続していない複数のフレームを選択するには、Ctrl キー（Windows）または Command キー（Mac OS）を押しながら別のフレームをクリックします。

• タイムライン内のフレームをすべて選択するには、編集／タイムライン／すべてのフレームを選択を選択します。

スパンベースのフレーム選択

スパンベースの選択を使用するには、その前に、タイムラインの右上隅にある三本線のアイコンをクリックし、スパンベースのフレーム選択メニューアイテムを選択して、スパンベースの選択を有効にしておく必要があります。

• モーショントゥイーンまたはインバースキネマティックのスパン全体のフレームを選択するには、フレームをクリックします。 
• 複数のスパンを選択するには、Shift キーを押しながらそれぞれのスパンをクリックします。

タイムライン内のフレームに対するラベル付け

タイムライン内のフレームにラベルを付けると、コンテンツを整理しやすくなります。また、フレームにラベルを付けることで、ActionScript 内のフレームをラベルで参照できるようになります。この場合、タイムラインを再編成してラベルを別のフレーム番号に移動しても、ActionScript はそのフレームラベルを引き続き参照するので、ActionScript を更新する必要はありません。

フレームラベルはキーフレームにしか適用できません。ベストプラクティスとしては、フレームラベルを追加するためだけの独立したレイヤーをタイムライン上に作成することをお勧めします。ラベル用の独立したレイヤーを使用すると、コンテンツとキーフレームをわかりやすく整理できます。 

フレームラベルを追加するには：

スパンベースのフレーム選択の有効化

スパンベースのフレーム選択を使用すると、2 つのキーフレーム間のフレーム範囲を 1 回のクリックで選択できます。

キーフレームへの配分

「キーフレームに配分」オプションを使用すると、ステージ上の複数のオブジェクト（シンボルやビットマップ）を各キーフレームに配分できます。

フレームまたはフレームシーケンスのコピー、ペースト、削除または移動

キーフレームとそれに続く一連の標準フレームのことを「キーフレームシーケンス」と呼びます。タイムラインにはキーフレームシーケンスをいくつでも配置できます。

フレームまたはフレームシーケンスをコピーまたはペーストするには、次のいずれかの操作をおこないます。

フレームまたはフレームシーケンスのコピーまたはペースト

• フレームまたはシーケンスを選択し、編集／タイムライン／フレームのコピーを選択します。置換するフレームまたはフレームシーケンスを選択して、編集／タイムライン／フレームのペーストを選択します。

• キーフレームを、コピーする位置まで Alt キーを（Windows）または Option キー（Mac OS）を押しながらドラッグします。

フレームまたはフレームシーケンスの削除

フレーム、フレームシーケンスまたはキーフレームの削除

フレームまたはシーケンスを選択し、編集／タイムライン／フレームの削除を選択するか、フレームまたはシーケンスを右クリック（Windows）または Control キーを押しながらクリックし、コンテキストメニューから「フレームを削除」を選択します。

削除したフレームの周囲のフレームは変更されません。

キーフレームの削除

キーフレームを選択し、編集／タイムライン／キーフレームを削除を選択するか、キーフレームを右クリック（Windows）または Control キーを押しながらクリック（Mac OS）して、コンテキストメニューから「キーフレームを削除」を選択します。

キーフレームまたはフレームシーケンスの移動

キーフレームまたはフレームシーケンスを選択し、目的の位置までドラッグします。

静止フレームシーケンスの長さの変更

フレームアニメーションシーケンスの長さを変更するには、フレームアニメーションの作成を参照してください。

タイムラインでのフレームコンテンツのプレビュー

タイムラインパネルの右上隅にあるタイムラインパネルのオプションメニューから「プレビュー」を選択します。

タイムラインの各キーフレーム内で、キーフレーム内のアイテムのサムネールプレビューを表示できます。