マニュアル キャンセル

時間

  1. Adobe Animate ユーザーガイド
  2. Animate の概要
    1. Animate の新機能
    2. ビジュアル用語集
    3. Animate の必要システム構成
    4. Animate キーボードショートカット
    5. Animate での複数のファイルタイプの取り扱い
  3. アニメーション
    1. Animate のアニメーションの基本
    2. Animate でフレームとキーフレームを使用する方法
    3. Animate でのフレームアニメーション
    4. Animate でのクラシックトゥイーンアニメーションの操作方法
    5. ブラシツール
    6. モーションガイド
    7. モーショントゥイーンと ActionScript 3.0
    8. モーショントゥイーンアニメーションについて
    9. モーショントゥイーンアニメーション
    10. モーショントゥイーンアニメーションの作成
    11. プロパティキーフレームの使用
    12. トゥイーンを使用した位置のアニメーション化
    13. モーションエディターを使用したモーショントゥイーンの編集
    14. トゥイーンアニメーションのモーションパスの編集
    15. モーショントゥイーンの操作
    16. カスタムイージングの追加
    17. モーションプリセットの作成と適用
    18. アニメーションのトゥイーンスパンの設定
    19. XML ファイルとして保存したモーショントゥイーンの操作
    20. モーショントゥイーンとクラシックトゥイーン
    21. シェイプトゥイーン
    22. Animate のボーンツールアニメーションの使用
    23. Animate でのキャラクターリグの操作
    24. Adobe Animate でのマスクレイヤーの使用
    25. Animate でのシーンの操作
  4. インタラクティブ機能
    1. Animate でのボタンの作成
    2. 他のドキュメントタイプ形式への Animate プロジェクトの変換
    3. Animate での HTML5 Canvas ドキュメントの作成およびパブリッシュ
    4. Animate のコードスニペットを使用したインタラクティブ機能の追加
    5. カスタム HTML5 コンポーネントの作成
    6. HTML5 Canvas でのコンポーネントの使用
    7. カスタムコンポーネントの作成例
    8. カスタムコンポーネントのコードスニペット
    9. ベストプラクティス - Animate を使用した広告
    10. バーチャルリアリティの作成と公開
  5. ワークスペースとワークフロー
    1. ペイントブラシの作成と管理
    2. HTML5 Canvas ドキュメントでの Google フォントの使用
    3. Creative Cloud ライブラリと Adobe Animate の使用
    4. Animate のステージとツールパネルの使用
    5. Animate ワークフローとワークスペース
    6. HTML5 Canvas ドキュメントでの Web フォントの使用
    7. タイムラインと ActionScript
    8. 複数のタイムラインの操作
    9. 環境設定
    10. Animate オーサリングパネルの使用
    11. Animate でのタイムラインレイヤーの作成
    12. モバイルアプリおよびゲームエンジン用アニメーションの書き出し
    13. オブジェクトの移動とコピー
    14. テンプレート
    15. Animate での検索と置換
    16. 取り消し、やり直し、ヒストリーパネル
    17. キーボードショートカット
    18. Animate でのタイムラインの使用
    19. HTML 拡張機能の作成
    20. 画像とアニメーション GIF の最適化オプション
    21. 画像および GIF の書き出し設定
    22. Animate のアセットパネル
  6. マルチメディアとビデオ
    1. Animate のグラフィックオブイジェクトの変形と組み合わせ
    2. Animate でのシンボルインスタンスの作成と操作
    3. 画像トレース
    4. Adobe Animate でのサウンドの使用方法
    5. SVG ファイルの書き出し
    6. Animate で使用するビデオファイルの作成
    7. Animate にビデオを追加する方法
    8. Animate でのオブジェクトの描画および作成
    9. 線とシェイプの変更
    10. Animate CC での線、塗り、グラデーション
    11. Adobe Premiere Pro と After Effects の使用
    12. Animate CC のカラーパネル
    13. Animate で Flash CS6 ファイルを開く
    14. Animate でのクラシックテキストの操作
    15. Animate へのアートワークの挿入
    16. Animate に読み込まれたビットマップ
    17. 3D グラフィック
    18. Animate でのシンボルの操作
    19. Adobe Animate での線とシェイプの描画
    20. Animate でのライブラリの使用
    21. サウンドの書き出し
    22. Animate CC でのオブジェクトの選択
    23. Animate での Illustrator AI ファイルの操作
    24. ブレンドモードの適用
    25. オブジェクトの配置
    26. コマンドメニューを使用したタスクの自動化
    27. 多言語テキスト
    28. Animate でのカメラの使用
    29. グラフィックフィルター
    30. サウンドと ActionScript
    31. 描画の環境設定
    32. ペンツールを使用した描画
  7. プラットフォーム
    1. 他のドキュメントタイプ形式への Animate プロジェクトの変換
    2. カスタムプラットフォームサポート
    3. Animate での HTML5 Canvas ドキュメントの作成およびパブリッシュ
    4. WebGL ドキュメントの作成とパブリッシュ
    5. AIR for iOS 用アプリケーションのパッケージ化
    6. AIR for Android アプリケーションのパブリッシュ
    7. デスクトップ用 Adobe AIR のパブリッシュ
    8. ActionScript パブリッシュ設定
    9. ベストプラクティス - アプリケーションでの ActionScript の整理
    10. Animate での ActionScript の使用
    11. Animate ワークスペースのアクセシビリティ
    12. スクリプトの記述と管理
    13. カスタムプラットフォームサポートの有効化
    14. カスタムプラットフォームサポートの概要
    15. カスタムプラットフォームサポートプラグインの操作
    16. ActionScript 3.0 のデバッグ
    17. カスタムプラットフォームサポートの有効化
  8. 書き出しとパブリッシュ
    1. Animate CC からファイルを書き出す方法
    2. OAM パブリッシング
    3. SVG ファイルの書き出し
    4. Animate によるグラフィックとビデオの書き出し
    5. AS3 ドキュメントのパブリッシュ
    6. モバイルアプリおよびゲームエンジン用アニメーションの書き出し
    7. サウンドの書き出し
    8. ベストプラクティス - モバイルデバイス向けのコンテンツ作成のヒント
    9. ベストプラクティス - ビデオ規則
    10. ベストプラクティス - SWF アプリケーションのオーサリングガイドライン
    11. ベストプラクティス - FLA ファイルの構造化
    12. FLA ファイルを Animate 向けに最適化するベストプラクティス
    13. ActionScript パブリッシュ設定
    14. Animate のパブリッシュ設定の指定
    15. プロジェクターファイルの書き出し
    16. 画像とアニメーション GIF の書き出し
    17. HTML パブリッシュ用テンプレート
    18. Adobe Premiere Pro と After Effects の使用
    19. アニメーションのクイック共有とパブリッシュ
  9. トラブルシューティング
    1. 解決済みの問題
    2. 既知の問題

 

この記事では、Animate の様々な時間コンポーネントについて説明します。

タイムライン

モーショントゥイーンアニメーションのタイムライン

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

  • タイムラインの左側の欄には、レイヤーの名前が表示されます。
  • 各レイヤーに含まれているフレームは、レイヤー名の右側の行に表示されます。
  • タイムラインの上部にあるタイムラインヘッダーには、フレーム番号が表示されます。
  • 再生ヘッドは、ステージに表示される現在のフレームを示します。ドキュメントの再生中、再生ヘッドはタイムラインの左から右に移動します。

デフォルトでは、再生ヘッドは終わりに到達すると先頭に戻ってループします。タイムラインの下部に表示されるタイムラインステータスには、選択中のフレーム番号、現在のフレームレート、および現在のフレームの経過時間が示されます。

タイムラインについて詳しくは、Animate でのタイムラインの使用を参照してください。

フレーム

フレームはアニメーションの芯になるもので、時間や動きを記録するために使用されます。ムービー内のフレームの総数と、フレームの再生速度によって、ムービー全体の長さが決まります。

フレームについて詳しくは、フレームと、フレームアニメーションの作成を参照してください。

フレームスパン

モーショントゥイーンアニメーションのフレームスパン

キーフレームと、それに続く標準フレームのスパンは、キーフレームシーケンスと呼ばれます。タイムラインにはキーフレームシーケンスをいくつでも配置できます。シーケンス内のキーフレームに、ステージに表示されるグラフィカルコンテンツが含まれている場合は、そのキーフレームに続く標準フレームが灰色で表示されます。シーケンス内のキーフレームに、グラフィカルコンテンツが含まれていない場合は、そのキーフレームに続く標準フレームが白で表示されます。

キーフレーム

Animate CC のフレームとキーフレーム

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

キーフレームとは、Adobe Animate のタイムラインで新しいシンボルインスタンスが表示されるフレームです。キーフレームには、ドキュメントの要素を制御する ActionScript コードが含まれる場合もあります。

また、タイムラインに空白キーフレームをプレースホルダーとして追加し、そこに後からシンボルを追加することも、空白のままにすることもできます。タイムラインの黒い点は単一のキーフレームを表します。単一のキーフレームに続く明るいグレーのフレームには、変更のない同じコンテンツが含まれます。

これらのフレームには黒い縦線が表示され、スパンの最後のフレームには白抜きの四角形が表示されます。最初のキーフレームに黒い点が表示され、黒い矢印と青い背景が表示されるスパンは、クラシックトゥイーンを表します。

キーフレームとプロパティキーフレームを混同しないでください。プロパティキーフレームのタイムラインアイコンは塗りつぶされたダイヤモンド型で、標準キーフレームのアイコンは白抜きまたは塗りつぶされた丸です。

マルチフレーム編集

モーショントゥイーンアニメーションのマルチフレーム編集

複数フレームを編集することです。

FPS

1 秒間あたりのフレーム数

フレームレート(Adobe Animate アニメーションの再生速度)は、1 秒間あたりのフレーム数(FPS)によって測定されます。フレームレートが小さすぎると、アニメーションの動きがカクカクとぎこちなくなり、逆に大きすぎると、細部の描写がつぶれてしまいます。新規 Animate ドキュメントのデフォルトのフレームレートは 24 fps であり、一般に Web 上ではこのフレームレートを使用したときに最良の結果が得られます(標準的な映画のフレームレートも 24 fps です)。

アニメーションの複雑さと、再生するコンピューターの処理速度は、再生の滑らかさに影響を与えます。最適なフレームレートを決めるには、様々な処理能力を持つ各種コンピューターでアニメーションをテストします。Animate ドキュメント全体に指定できるフレームレートは 1 種類だけなので、アニメーションを作り始める前に希望のフレームレートを設定する必要があります。再生ヘッドがタイムラインを移動する速度は、基本的にはフレームレートによって決まります。

1 秒間あたりのフレーム数について詳しくは、アニメーションの基本を参照してください。

イージング

イージングは、トゥイーン内のプロパティキーフレーム間のプロパティ値を補間する際の計算方法を調整する機能です。イージングを使用しないと、トゥイーンオブジェクトはアニメーションの各フレームを一定の速度で移動します。イージングを使用すると、トゥイーンオブジェクトの速度を調整して、より自然な動きに見せたり、複雑なアニメーションを作成したりできます。イージングは、トゥイーンのプロパティ値に適用される数学的な曲線です。

トゥイーンの最終的な効果は、トゥイーン内でプロパティ値が変化する範囲と、イージング曲線を組み合わせた結果によって決まります。これにより、低速で開始して加速していく効果、高速で開始してスピードを落としていく効果、またはその両方を組み合わせた効果を実現できます。

例えば、ステージを横切るように移動する車のアニメーションを作成する場合は、車を停止位置からゆっくり動かし始め、徐々にスピードを上げていけば、より本物に近い動きになります。プロパティインスペクターで適用するイージングは、トゥイーンに含まれるすべてのプロパティに作用します。モーションエディターで適用するイージングは、1 つのプロパティ、プロパティのグループ、またはトゥイーンのすべてのプロパティに作用します。

イージングについて詳しくは、トゥイーンのシェイプと、モーショントゥイーンの編集を参照してください。

オニオンスキン

Animate CC のオニオンスキン

オニオンスキンを使用すると、現在のフレーム内のオブジェクトを前のフレームや次のフレームと比較しながら調整できます。オニオンスキンが無効になっているときは(デフォルト設定)、常にアニメーションシーケンス中の 1 つのフレームだけがステージ上に表示されます。

表示されるフレームは、タイムラインの再生ヘッドの位置に対応します。オニオンスキンが有効になっているときは、再生ヘッドのあるフレームは本来の色で表示され、周囲のフレームは淡色表示されます(薄紙に描かれたフレームが何枚も重ねられているイメージです)。

淡色表示されたフレームは視覚情報として表示されるだけで、編集することはできません。

オニオンスキンについて詳しくは、フレームアニメーションの作成タイムラインを参照してください。

レイヤー

モーショントゥイーンアニメーションのレイヤー

レイヤーは、Adobe Animate ドキュメント内のアートワークを整理するのに役立ちます。各レイヤーは独立しており、あるレイヤー上でオブジェクトの描画や編集を行っても、他のレイヤーのオブジェクトには影響しません。レイヤー上にオブジェクトがないステージ領域では、下のレイヤーを透かして見ることができます。描画やペイントなどを行ってレイヤーやフォルダーを変更するには、タイムライン内の目的のレイヤーを選択してアクティブにします。タイムライン内のアクティブなレイヤーやフォルダーには、名前の隣に鉛筆のアイコンが表示されます。

レイヤーは一度に複数選択できますが、一度にアクティブにできるのは 1 つのレイヤーのみです。Animate ドキュメントを新規作成したときには、レイヤーが 1 つだけ含まれています。ドキュメント内のアートワーク、アニメーション、その他のエレメントを整理するために、レイヤーを追加できます。さらに、レイヤーの表示/非表示の切り替え、ロック/ロック解除の切り替え、並べ替えを行うことができます。 

作成できるレイヤー数は、コンピューターのメモリ容量によって制限されます。レイヤーを追加しても、パブリッシュされた SWF ファイルのファイルサイズが増加することはありません。レイヤーに配置されたオブジェクトのみがプロジェクトのファイルサイズに加算されます。洗練された効果を作成するために、描画や編集を容易にする特殊なガイドレイヤーを使用したり、マスクレイヤーを作成することも可能です。

レイヤーについて詳しくは、タイムラインレイヤーの作成を参照してください。

マスクレイヤー

Animate CC のマスクレイヤー

マスクレイヤーには、下位レイヤーの一部を覆い隠すための「マスク」となるオブジェクトが含まれます。マスクレイヤーのマスクで覆われていない部分のみが表示されます。

マスクレイヤーの使用方法については、Animate でのマスクレイヤーの使用を参照してください。

ガイドレイヤー

モーショントゥイーンアニメーションのガイドレイヤー

Adobe Animate で描画中にオブジェクトを整列させるには、ガイドレイヤーを作成し、そのガイドレイヤー上に作成したオブジェクトを基準にして、別のレイヤー上のオブジェクトを配置します。任意のレイヤーをガイドレイヤーとして使用できます。ガイドレイヤー名の左側にガイドアイコンが表示されます。ガイドレイヤーは書き出されないので、パブリッシュされた SWF ファイルには表示されません。

モーショントゥイーンレイヤーやインバースキネマティックポーズレイヤーをガイドレイヤー上にドラッグすることはできませんが、標準レイヤーはガイドレイヤー上にドラッグできます。これにより、ガイドレイヤーがモーションガイドレイヤーに変換され、標準レイヤーが新しいモーションガイドレイヤーにリンクされます。

 Adobe

ヘルプをすばやく簡単に入手

新規ユーザーの場合

Adobe MAX 2024

Adobe MAX
クリエイティブカンファレンス

10 月 14 日~ 16 日 マイアミビーチおよびオンライン

Adobe MAX

クリエイティブカンファレンス

10 月 14 日~ 16 日 マイアミビーチおよびオンライン

Adobe MAX 2024

Adobe MAX
クリエイティブカンファレンス

10 月 14 日~ 16 日 マイアミビーチおよびオンライン

Adobe MAX

クリエイティブカンファレンス

10 月 14 日~ 16 日 マイアミビーチおよびオンライン