Animate でのタイムラインの使用

Adobe Animate のタイムラインでは、ドキュメントのコンテンツをレイヤーとフレームで整理および制御します。映画と同じように、Animate ドキュメントでは時間の長さをフレームに分割しています。レイヤーは、何層にも積み重ねられた複数のフィルムストリップに類似しており、それぞれのレイヤーに含まれている異なるイメージがステージに表示されます。タイムラインの主なコンポーネントは、レイヤー、フレームおよび再生ヘッドです。

タイムラインを見れば、フレーム単位のアニメーション、トゥイーンアニメーション、モーションパスなどのアニメーションがドキュメント内のどこで発生するかがわかります。タイムラインのレイヤーセクションのコントロールを使用すると、レイヤーの表示と非表示およびロックとロック解除を切り替えることができます。また、レイヤーのコンテンツをアウトラインで表示することもできます。タイムラインフレームは、同じレイヤーまたは別のレイヤー上の新しい場所にドラッグすることができます。

最新のタイムライン

フレーム間隔の明快な表現、フレームおよびタイムマーカーの読みやすさ、機能強化されたオニオンスキン、キーフレーム作成用ボタン、空白のフレームなど、タイムラインパネルのルック＆フィールが強化されています。

タイムラインコントロール

タイムラインヘッダーは、最前面に機能が追加されて、より豊富な機能を提供するようになりました。

レイヤー表示

カメラ

カメラを有効または無効にするには、カメラボタンをクリックします。

レイヤーペアレンティングビュー

レイヤーの親子階層構造が表示されます。

レイヤー深度

レイヤー深度パネルが作成され、リストに含まれているアクティブレイヤーの深度を変更することができます。 

オニオンスキン機能

オニオンスキン機能が改良され、よりシンプルになりました。オニオンスキンボタンをクリックして、オニオンスキン機能を有効にすることができます。オニオンスキン機能がさらに強化されて、オニオンスキン範囲内の任意のオニオンスキンフレームを右クリックして、フレームを選択的に除外する（または含める）ことができるようになりました。 

次のいずれかの操作を行います。

• オニオンスキンボタン をクリックして、オニオンスキン機能を有効または無効にします。有効になると、オニオンスキンの開始マーカーと終了マーカー（タイムラインヘッダーに表示）の間にあるすべてのフレームは、ドキュメントウィンドウでは 1 つのフレームとして重ねて表示されます。
• オニオンスキンボタン  をクリックしてマウスボタンを押したままにすると、オプション（選択範囲、すべてのフレーム、アンカーマーカー、詳細設定など）が表示され、選択可能になります。
• タイムライン内のオニオンスキンアイコン （ループアイコンの右にあるアイコン）を選択します。

このパネルのオニオンスキンパラメーターには、アウトラインモード、オニオンスキンの前／後フレームのカラー設定、アンカーマーカーなどの既存機能が含まれます。

• キーフレームのみモード：オニオンスキン範囲内のキーフレームのみレンダリングされます。つまり、トゥイーンのフレーム間はスキップされます。
• 開始不透明度：アクティブなフレームの片側に位置する最初のオニオンスキンフレームの不透明度。
• 減少幅：オニオンスキンフレームごとの減少分の割合（パーセント）。
• 制約：制約が有効な場合は、前のフレームと次のフレームの範囲が同じになります。ただし、ユーザーがタイムラインから範囲を編集する場合を除きます。

詳しくは、オニオンスキン機能の使用を参照してください。

複数フレームを編集

このボタンを使用すると、選択範囲内にある複数フレームのコンテンツを表示して編集できます。

「複数フレームを編集」ボタンをクリックしてマウスボタンを押したままにすると、「選択範囲を編集」と「すべてのフレームを編集」が表示され、選択可能になります。クリックすると、複数フレーム編集モードが無効または有効になります。

トゥイーンを作成

トゥイーンを作成アイコンをクリックしてマウスボタンを押したままにすると、オプションが表示され、選択可能になります。タイムラインでフレームスパンを選択し、トゥイーンを作成をクリックすると、前回選択したとおりにトゥイーンが作成されます。

タイムラインの表示の変更

デフォルトでは、メインドキュメントウィンドウの下にタイムラインが表示されます。表示位置を変更するには、タイムラインをドキュメントウィンドウから切り離し、別個のウィンドウに表示します。任意のパネルにドッキングすることもできます。タイムラインは非表示にすることもできます。

表示されるレイヤーとフレームの数を変更するには、タイムラインのサイズを変更します。タイムラインに含まれるレイヤー数が多くてすべてを一度に表示できない場合、残りのレイヤーを表示するには、タイムラインの右側のスクロールバーを使用します。

• ドキュメントウィンドウにドッキングされているタイムラインを移動するには、タイムラインの左上隅にあるタイトルバーのタブをドラッグします。

• アプリケーションウィンドウにタイムラインをドッキングするには、ドキュメントウィンドウの上部または下部にタイトルバーのタブをドラッグします。

• タイムラインを別のパネルにドッキングするには、タイムラインのタイトルバータブを目的の場所にドラッグします。タイムラインが別のパネルにドッキングしてしまうのを防ぐには、Control キーを押しながらドラッグします。青いバーが表示されたパネルがタイムラインのドッキング先となります。

• タイムラインパネルにあるレイヤー名のフィールドの長さを変更するには、レイヤー名とタイムラインのフレーム部との間にあるバーを左右にドラッグします。

タイムラインビューのカスタマイズ

タイムラインでのレイヤーの高さの変更

レイヤーのカラー設定と固定

レイヤー名のすぐ後に表示されるドットをクリックして、レイヤーを固定したり色を設定したりして簡単に識別できるようにすることができます。有効にすると、レイヤーのアウトラインカラーで下線がレイヤー全体に表示され、レイヤーをすぐ認識できるようになります。 

レイヤーの不透明度の設定

次のいずれかの操作をおこないます。

• タイムラインの目のアイコンの列で Shift キーを押しながらクリックして、可視性を不透明に設定します。
  
• タイムラインで、レイヤー名の左にあるアイコンをダブルクリックします。
• レイヤー名を右クリック（Windows）または Control キーを押しながらクリック（Mac OS）し、コンテキストメニューから「プロパティ」を選択します。 レイヤープロパティダイアログボックスで、可視性／不透明度を選択します。
• レイヤー名を右クリック（Windows）または Control キーを押しながらクリック（Mac OS）し、「その他の透明を表示
  」を選択します。

タイムラインパネルのサイズの変更

• タイムラインがメインアプリケーションウィンドウにドッキングされている場合は、タイムラインとステージ領域を区切るバーをドラッグします。

• タイムラインがメインアプリケーションウィンドウにドッキングされていない場合は、右下隅をドラッグするか（Windows）、右下隅のサイズボックスをドラッグします（Mac OS）。

タイムラインの上部の青い再生ヘッドは、ステージで表示中の現在のフレームを表し、ドキュメントの再生に合わせて移動します。タイムラインヘッダーには、アニメーションのフレーム番号が表示されます。特定のフレームの状態をステージに表示するには、タイムライン内のそのフレームまで、再生ヘッドを移動します。

大量のフレームを処理する場合、特定のフレームを表示するには、再生ヘッドをタイムラインに沿って移動します。

• フレームに移動するには、タイムラインヘッダーで目的のフレームの位置をクリックするか、その位置まで再生ヘッドをドラッグします。

• 現在のフレームをタイムラインの中央に配置するには、タイムラインの下部にある中央のフレームボタンをクリックします。

• ループセクションにドラッグするだけでループ範囲を作成できるようになりました。これにより、選択範囲にあるフレーム（ムービーまたはビデオ）を書き出すことができます。
• タイムラインで「ループ」オプションをオンにすると、他のアニメーションに沿ったフレームの範囲内でストリームオーディオをループすることもできます。

時間とフレームの表示

タイムラインには、フレーム番号と秒数が並んで表示されます。そのため、フレームから時間への換算が容易で、アニメーションの制作中にフレーム/秒（fps）値の設定を常に意識することができます。 

次のスクリーンショットは、20 フレーム/秒（fps）のタイムラインを示しています。

アニメーションの速度の管理

フレームスパンの伸縮や時間間隔に基づくアニメーションによって、アニメーションの速度を管理できます。また、時間コントロールを使用してアニメーションを伸縮できます。 

フレームスパンの伸縮

アニメーションの速度を変更しなくても、アニメーションのフレーム数/秒（fps）を変更できます。時間はそのままにして fps を変更するには、「フレームスパンを伸縮」オプションを使用します。 

時間間隔に基づくアニメーション

フレームスパンを 1 秒、2 秒、3 秒または任意の間隔に変更できます。この機能は、クラシックトゥイーンスパン、シェイプトゥイーンスパン、モーショントゥイーンスパン、キーフレームスパンまたは空白のキーフレームスパンに有効です。

修正メニューの「フレーム単位のアニメーションに変換」オプションを使用できます。キーボードショートカットダイアログボックスで、これらのタスクを実行するためのキーボードショートカットを割り当てることもできます。

タイムラインのコントロールを使用したアニメーションの伸縮

「フレームスパンを拡張」フィールドに目的のフレーム数を入力することで、選択したフレームのフレームデュレーションを延長できるようになりました。選択したフレームのデュレーションは、「フレームスパンを拡張」に入力したフレーム数だけ増加します。

タイムラインで選択したスパンの時間を伸縮することができます。タイムラインでフレームスパンを選択し、選択したスパンの右端を前後にドラッグします。タイムライン内のフレームが自動的に調整されます。

タイムラインでスパンをドラッグして、アニメーションを複数回（x2、x3 など）複製できます。また、フレームを伸ばした後で通常の位置まで縮めることもできます。 

タイムラインでフレームを選択し、クリックして、選択したフレームの強調表示された右端をドラッグします。

ドラッグしている間は、次のスクリーンショットに示すように、x2、x3 など、アニメーションを複数回表示できます。

次のスクリーンショットでは、x2 の倍数で延長されたスパンが表示されています。x2 は、選択したスパンの倍のサイズです。x3 は、スパンの元のサイズの 3 倍です。

フレームデュレーションは、「フレームスパンを拡張」フィールドに目的の数を入力して延長できるようになりました。選択したフレームのデュレーションは、「時間スパンを拡張」に入力したフレーム数だけ増加します。

タイムラインでのナビゲーション

キーフレームのナビゲーション

1 フレーム戻すまたは 1 フレーム進めるボタンをクリックして、前または次のフレームに移動できるようになりました。また、1 フレーム戻すまたは 1 フレーム進めるボタンをクリックしてマウスボタンを押したままにすると、それぞれ、最初または最後のフレームに移動できます。

再生ボタンをクリックすると、アニメーションのプレビューを表示できます。

制御メニューを使用して、アクティブなレイヤー上のキーフレーム間を移動できます。Alt + . キーまたは Alt + , キーを使用して、それぞれタイムライン上の次のキーフレームまたは前のキーフレームに移動することもできます。

レイヤー上の左右のナビゲーションコントロールを使用して、アクティブなレイヤー上のキーフレーム間を移動できます。また、メニューやキーボードショートカットも使用できます。 

フレームとキーフレームの挿入

タイムラインパネルでキーフレームまたは空白キーフレームを挿入すると、視覚的なフィードバックが表示されるようになりました。かすかな輝きの場合は、操作が実行されたことを示します。

「アクティブレイヤーのみ」モード

タイムラインビューアイコンが変更され、「アクティブレイヤーのみ」という新しいモードが追加されました。タイムラインにアクティブレイヤーだけを表示するには、「タイムラインビュー」オプションをクリックしてマウスボタンを押したままにして、「アクティブレイヤーのみ」を選択します。

ステージからのタイムライン全体のパン

• 手のひらツールを使用してタイムラインを水平方向にスライドさせることもできるようになりました。
• 新しいタイムスクラブツールを使用して、ステージからタイムラインをスクラブできます。このツールは、ツールパネルでは手のひらツールと同じグループに属しています。スペースバー + T のキーボードショートカットを使用して、このツールを一時的に有効にすることもできます。左または右にドラッグすると、パンした方向のタイムラインが表示されます。 

カスタマイズ可能なタイムラインツールバー

カスタマイズ可能なタイムラインを使用すると、タイムラインツールバーに表示されるアクションボタンを選択できます。タイムラインのハンバーガーメニューで、「タイムラインツールをカスタマイズ」をクリックします。

タイムラインツールバーから追加または削除された可能性のあるツールバーボタンを含むパネルが表示されます。パネルの外側の任意の場所をクリックして、パネルを閉じます。パネルが開いている場合、タイムラインツールバーに表示されているボタンがパネルで選択されます。ボタンの選択を切り替えるには、適切なボタンをクリックします。変更は、直ちにタイムラインツールバーに表示されます。 

タイムラインのカスタマイズ方法を学習するためのビデオを視聴してください。

次のステップ

タイムラインの使い方およびパーソナライズ方法について説明しました。次に、アセットパネル
を使用したアニメーションの作成方法について学習できます。