概要

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

フレーム

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

キーフレーム

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

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

Frame-&-Keyframe

スパン

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

静的フレームスパン

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

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

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

Framespan

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  1. タイムライン内でラベルを付けるフレームを選択します。

  2. フレームが選択された状態で、プロパティインスペクターの「ラベル」セクション内にラベル名を入力します。Enter キーまたは Return キーを押します。
    adding-labels
  3. ベストプラクティスとしては、フレームラベル用の独立したレイヤーを作成することをお勧めします。 

    labels-keyframes

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

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

  1. タイムラインセクションの右上隅にある三本線のアイコンをクリックします。 

    ポップアップメニューが表示されます。 

  2. ポップアップメニューから「スパンベースのフレーム選択」を選択します。

    span-based-selection

キーフレームへの配分

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

  1. ステージ上にある任意のレイヤーの複数のオブジェクトを選択します。
  2. ステージ上の任意の場所を右クリックし、「キーフレームに配分」を選択します。

    distribute-to-keyframes

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

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

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

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

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

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

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

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

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

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

remove-frames

キーフレームの削除

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

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

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

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

Control キー(Windows)または Command キー(Mac OS)を押しながらスパンの開始または終了フレームを左か右にドラッグします。

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

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

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

preview

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

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー