タイムラインでレイヤーを選択します。Animate では、インスタンスは常に現在のレイヤーのキーフレームに挿入されます。キーフレームが選択されていない場合、Animate では現在のフレームの左側にある最初のキーフレームにインスタンスが挿入されます。
- Adobe Animate ユーザーガイド
- Animate の概要
- アニメーション
- Animate のアニメーションの基本
- Animate でフレームとキーフレームを使用する方法
- Animate でのフレームアニメーション
- Animate でのクラシックトゥイーンアニメーションの操作方法
- ブラシツール
- モーションガイド
- モーショントゥイーンと ActionScript 3.0
- モーショントゥイーンアニメーションについて
- モーショントゥイーンアニメーション
- モーショントゥイーンアニメーションの作成
- プロパティキーフレームの使用
- トゥイーンを使用した位置のアニメーション化
- モーションエディターを使用したモーショントゥイーンの編集
- トゥイーンアニメーションのモーションパスの編集
- モーショントゥイーンの操作
- カスタムイージングの追加
- モーションプリセットの作成と適用
- アニメーションのトゥイーンスパンの設定
- XML ファイルとして保存したモーショントゥイーンの操作
- モーショントゥイーンとクラシックトゥイーン
- シェイプトゥイーン
- Animate のボーンツールアニメーションの使用
- Animate でのキャラクターリグの操作
- Adobe Animate でのマスクレイヤーの使用
- Animate でのシーンの操作
- インタラクティブ機能
- ワークスペースとワークフロー
- ペイントブラシの作成と管理
- HTML5 Canvas ドキュメントでの Google フォントの使用
- Creative Cloud ライブラリと Adobe Animate の使用
- Animate のステージとツールパネルの使用
- Animate ワークフローとワークスペース
- HTML5 Canvas ドキュメントでの Web フォントの使用
- タイムラインと ActionScript
- 複数のタイムラインの操作
- 環境設定
- Animate オーサリングパネルの使用
- Animate でのタイムラインレイヤーの作成
- モバイルアプリおよびゲームエンジン用アニメーションの書き出し
- オブジェクトの移動とコピー
- テンプレート
- Animate での検索と置換
- 取り消し、やり直し、ヒストリーパネル
- キーボードショートカット
- Animate でのタイムラインの使用
- HTML 拡張機能の作成
- 画像とアニメーション GIF の最適化オプション
- 画像および GIF の書き出し設定
- Animate のアセットパネル
- マルチメディアとビデオ
- Animate のグラフィックオブイジェクトの変形と組み合わせ
- Animate でのシンボルインスタンスの作成と操作
- 画像トレース
- Adobe Animate でのサウンドの使用方法
- SVG ファイルの書き出し
- Animate で使用するビデオファイルの作成
- Animate にビデオを追加する方法
- Animate でのオブジェクトの描画および作成
- 線とシェイプの変更
- Animate CC での線、塗り、グラデーション
- Adobe Premiere Pro と After Effects の使用
- Animate CC のカラーパネル
- Animate で Flash CS6 ファイルを開く
- Animate でのクラシックテキストの操作
- Animate へのアートワークの挿入
- Animate に読み込まれたビットマップ
- 3D グラフィック
- Animate でのシンボルの操作
- Adobe Animate での線とシェイプの描画
- Animate でのライブラリの使用
- サウンドの書き出し
- Animate CC でのオブジェクトの選択
- Animate での Illustrator AI ファイルの操作
- ブレンドモードの適用
- オブジェクトの配置
- コマンドメニューを使用したタスクの自動化
- 多言語テキスト
- Animate でのカメラの使用
- グラフィックフィルター
- サウンドと ActionScript
- 描画の環境設定
- ペンツールを使用した描画
- プラットフォーム
- 他のドキュメントタイプ形式への Animate プロジェクトの変換
- カスタムプラットフォームサポート
- Animate での HTML5 Canvas ドキュメントの作成およびパブリッシュ
- WebGL ドキュメントの作成とパブリッシュ
- AIR for iOS 用アプリケーションのパッケージ化
- AIR for Android アプリケーションのパブリッシュ
- デスクトップ用 Adobe AIR のパブリッシュ
- ActionScript パブリッシュ設定
- ベストプラクティス - アプリケーションでの ActionScript の整理
- Animate での ActionScript の使用
- Animate ワークスペースのアクセシビリティ
- スクリプトの記述と管理
- カスタムプラットフォームサポートの有効化
- カスタムプラットフォームサポートの概要
- カスタムプラットフォームサポートプラグインの操作
- ActionScript 3.0 のデバッグ
- カスタムプラットフォームサポートの有効化
- 書き出しとパブリッシュ
- Animate CC からファイルを書き出す方法
- OAM パブリッシング
- SVG ファイルの書き出し
- Animate によるグラフィックとビデオの書き出し
- AS3 ドキュメントのパブリッシュ
- モバイルアプリおよびゲームエンジン用アニメーションの書き出し
- サウンドの書き出し
- ベストプラクティス - モバイルデバイス向けのコンテンツ作成のヒント
- ベストプラクティス - ビデオ規則
- ベストプラクティス - SWF アプリケーションのオーサリングガイドライン
- ベストプラクティス - FLA ファイルの構造化
- FLA ファイルを Animate 向けに最適化するベストプラクティス
- ActionScript パブリッシュ設定
- Animate のパブリッシュ設定の指定
- プロジェクターファイルの書き出し
- 画像とアニメーション GIF の書き出し
- HTML パブリッシュ用テンプレート
- Adobe Premiere Pro と After Effects の使用
- アニメーションのクイック共有とパブリッシュ
- トラブルシューティング
インスタンスの作成
シンボルを作成した後は、ドキュメント内のあらゆる場所(別のシンボルの内部も含む)にそのシンボルのインスタンスを作成できます。シンボルを修正すると、Animate がそのシンボルの全インスタンスを更新します。
インスタンス名はプロパティインスペクターで指定できます。インスタンスに付けた名前は、ActionScript からインスタンスを参照する際に使用されます。インスタンスを ActionScript® から制御するには、同じタイムライン内にある各インスタンスの名前がすべて異なっている必要があります。
新しいインスタンスに対し、カラー効果の指定、アクションの割り当て、グラフィック表示モードの設定、タイプの変更などを行うには、プロパティインスペクターを使用します。インスタンスのタイプは、特に指定しない限り、シンボルのタイプと同じです。変更はインスタンスにのみ反映され、シンボルには影響しません。
シンボルのインスタンスの作成
-
キーフレームは、アニメーションでの変化を定義するフレームです。詳しくは、タイムラインへのフレームの挿入を参照してください。
-
ウィンドウ/ライブラリを選択します。
-
シンボルをライブラリからステージにドラッグします。
-
グラフィックシンボルのインスタンスを作成した場合、そのグラフィックシンボルを配置するフレームの数を追加するには、挿入/タイムライン/フレームを選択します。
インスタンスに対するカスタム名の適用
-
ステージでインスタンスを選択します。
-
ウィンドウ/プロパティを選択し、「インスタンス名」テキストボックスに名前を入力します。
インスタンスプロパティの編集
各シンボルインスタンスには、シンボルとは別のプロパティがあります。インスタンスの着色、透明度および明度を変更したり、インスタンスのタイプを再定義(グラフィックからムービークリップへの変更など)したりできます。さらに、グラフィックインスタンス内部でのアニメーションの再生方法を指定できます。シンボルに影響を与えずに、インスタンスの傾斜、回転、または拡大/縮小を行うことも可能です。
また、ActionScript を使用してインスタンスのプロパティを変更できるように、ムービークリップインスタンスまたはボタンインスタンスに名前を付けることができます。詳しくは、『ActionScript 3.0 の学習』の「オブジェクトとクラス」を参照してください。インスタンスプロパティの編集には、プロパティインスペクター(ウィンドウ/プロパティ)を使用します。
インスタンスのプロパティはインスタンスと共に保存されます。シンボルを編集したり、インスタンスを別のシンボルに再リンクしたりしても、変更したインスタンスプロパティはインスタンスに適用されたまま残ります。
インスタンスの可視性の設定
ステージのシンボルインスタンスは、「表示する」プロパティを無効にすることで非表示にできます。「表示する」プロパティを使用すると、シンボルの「アルファ」プロパティを 0 に設定するよりもレンダリングのパフォーマンスが高速になります。
「表示する」プロパティでは、Player 設定を Flash Player 10.2 以降にする必要があり、ムービークリップ、ボタンおよびコンポーネントのインスタンスにのみ対応しています。
-
ステージでインスタンスを選択します。
-
プロパティパネルの「表示」セクションで「表示する」プロパティの選択を解除します。
インスタンスのカラーと透明度の変更
シンボルの各インスタンスには、個別のカラー効果を設定できます。インスタンスにカラーや透明度のオプションを設定するには、プロパティインスペクターを使用します。プロパティインスペクターでの設定は、シンボル内に配置されたビットマップにも影響します。
Animate で、特定のフレームに含まれるインスタンスのカラーと透明度を変更した場合、変更はそのフレームが表示されると同時に反映されます。カラーを段階的に変化させるには、モーショントゥイーンを適用します。カラーをトゥイーンするには、インスタンスの開始および終了キーフレームに異なる効果設定を入力し、その設定をトゥイーンして、インスタンスのカラーが徐々に変化するようにします。
Animate で、複数のフレームから構成されるムービークリップシンボルにカラー効果を適用すると、その効果がムービークリップシンボルのすべてのフレームに適用されます。
-
ステージ上でインスタンスを選択し、ウィンドウ/プロパティを選択します。
-
プロパティインスペクターで、カラーメニューから次のいずれかのオプションを選択します。
明度
イメージの相対的な明るさや暗さを、黒(-100%)~ 白(100%)の範囲で調整します。明度を調整するには、三角形をクリックしてスライダーをドラッグするか、ボックスに値を入力します。
色かぶり補正
インスタンスに同じ色相でカラーを付けます。着色のパーセンテージは、プロパティインスペクターの「着色」スライダーを使用して、透明(0%)~ 完全に濃く塗りつぶした状態(100%)の間で設定します。着色を調整するには、三角形をクリックしてスライダーをドラッグするか、ボックスに値を入力します。カラーを選択するには、赤、緑、青の値をそれぞれのボックスに入力するか、カラーコントロールをクリックしてポップアップウィンドウからカラーを選択します。
アルファ
インスタンスの透明度を、透明(0%)~ 完全に濃く塗りつぶした状態(100%)の間で調整します。アルファ値を調整するには、三角形をクリックしてスライダーをドラッグするか、ボックスに値を入力します。
高度な設定
インスタンスの赤、緑、青、透明度の各値を個別に調整します。これは、ビットマップなどのオブジェクトに微妙なカラー効果を施してアニメーション化する場合に最も効果的です。左側にあるコントロールでは、指定したパーセンテージでカラーまたは透明度の値を小さくします。右側にあるコントロールでは、カラーまたは透明度の値を一定の値だけ大きくしたり小さくしたりします。
現在の赤、緑、青、およびアルファ設定値に対して指定されたパーセントを掛け、その結果を右側の列の定数に加え、新しいカラー値を決定します。例えば、現在の赤の値が 100 である場合、左側のスライダーを 50% に、右側のスライダーを 100% に設定すると、新しい値は 150([100 x .5] + 100 = 150)になります。
エフェクトパネル内の「詳細設定」では、関数 (a * y+ b)= x を実行できます(ここで、a はボックスの左側で指定したパーセント、y は元のビットマップのカラー、b はボックスの右側で指定した値、x は効果の結果(RGB で 0 ~ 255、アルファ透明度で 0 ~ 100)になります)。
インスタンスのカラーは、ActionScript の ColorTransform オブジェクトを使用して変更することもできます。カラーオブジェクトについて詳しくは、『ActionScript 2.0 リファレンスガイド』、または『ActionScript 3.0 言語およびコンポーネントリファレンス』の ColorTransform を参照してください。
インスタンスの入れ替え
元のインスタンスプロパティ(カラー効果やボタンアクションなど)を変更することなく、ステージ上に異なるインスタンスを表示するには、インスタンスに異なるシンボルを割り当てます。
例えば、ねずみのシンボルをキャラクターにしたマンガを作成しているときに、途中でキャラクターを猫に変更するとします。この場合、ねずみのシンボルを猫で置き換えると、更新されたキャラクタをすべてのフレームでほぼ同じ位置に表示させることができます。
インスタンスに対する異なるシンボルの割り当て
-
ステージ上でインスタンスを選択し、ウィンドウ/プロパティを選択します。
-
プロパティインスペクターで「入れ替え」ボタンをクリックします。
-
現在インスタンスに割り当てられているシンボルを置き換えるシンボルを選択します。選択したシンボルを複製するには、「シンボルの複製」をクリックし、「OK」をクリックします。
複製ではライブラリ内の既存のシンボルを元に新しいシンボルを作成するので、共通点の多いシンボルを多数作成する場合に手間を省くことができます。
シンボルのインスタンスすべての置き換え
-
置き換えようとしているシンボルと同じ名前のシンボルを、ライブラリパネルから編集中の FLA ファイルのライブラリパネルにドラッグし、「置換」をクリックします。ライブラリ内にフォルダーがある場合は、置き換えるシンボルがあるフォルダーと同じ場所に新しいシンボルをドラッグする必要があります。
インスタンスのタイプの変更
Animate アプリケーションで、インスタンスのビヘイビアーを定義し直すには、インスタンスのタイプを変更します。例えば、グラフィックインスタンスに含まれるアニメーションをメインタイムラインとは別に再生する場合、そのグラフィックインスタンスをムービークリップインスタンスとして再定義できます。
-
ステージ上でインスタンスを選択し、ウィンドウ/プロパティを選択します。
-
プロパティインスペクターのメニューから「グラフィック」、「ボタン」、または「ムービークリップ」を選択します。
グラフィックインスタンスのループの設定
Animate アプリケーションで、グラフィックインスタンス内部のアニメーションシーケンスをどのように再生するかを指定するには、「プロパティ」インスペクターでオプションを設定します。
アニメーション化されたグラフィックシンボルは、そのシンボルが配置されているドキュメントのタイムラインに連動して再生されます。一方、ムービークリップは、独自のタイムラインを使用します。アニメーション化されたグラフィックシンボルは、メインドキュメントと同じタイムラインを使用するので、ドキュメント編集モードでアニメーションをプレビューできます。ムービークリップシンボルはステージに静止オブジェクトとして表示されますが、Animate オーサリング環境ではアニメーションとして表示されません。
-
ステージ上でグラフィックインスタンスを選択し、ウィンドウ/プロパティを選択します。
-
プロパティインスペクターの「ループ」セクションのオプションメニューでアニメーションオプションを選択します。
ループ
現在のインスタンスに含まれるすべてのアニメーションシーケンスを、インスタンスが配置されるフレームの数だけループさせます。
1 回再生
指定したフレームからアニメーションの終わりまでアニメーションシーケンスを再生して停止します。
シングルフレーム
アニメーションシーケンスのうち単一のフレームを表示します。表示するフレームを指定する必要があります。
-
ループ時に表示するグラフィックシンボルの最初のフレームを指定するには、「開始」テキストボックスにフレーム番号を入力します。ここで指定したフレーム番号は「シングルフレーム」オプションでも使用されます。
フレームピッカー
フレームピッカーは、グラフィックシンボルの最初のフレームを視覚的にプレビューして選択するのに役立ちます。以前のリリースでは、編集モードでシンボル内に入らないとフレームをプレビューできませんでした。この機能により、リップシンクなどのアニメーションワークフローのユーザーエクスペリエンスが向上します。
フレームピッカーパネルはグラフィックシンボルに対してのみ使用でき、ムービークリップタイプやボタンシンボルタイプに対しては無効になります。この機能を使用するには、アセットをシンボルに変換する必要があります。
-
グラフィックシンボルを選択して、プロパティパネル/ループ/「フレームピッカーを使用」ボタンに移動し、フレームピッカーパネルを表示するか、ウィンドウ/フレームピッカーを選択します。
-
選択したシンボルがフレームピッカーパネルに読み込まれます。
-
任意のフレームをクリックして、選択したシンボルの最初のフレームとして設定します。
次に、フレームピッカーパネルで使用できるオプションを示します。
リスト(デフォルトオプション)。フレームを垂直方向に一覧表示します。
サムネール。グリッド表示でフレームを表示します。パネルのサイズが変更されると再調整されます。
キーフレームを作成。このオプションを選択すると、フレームピッカーパネルで位置を選択する際にキーフレームが自動的に作成されます。
現在のシンボルをピン留め。このオプションを使用すると、フレームの選択が変更されても、同じシンボルを操作できます。
新しいフレームピッカーパネルを開く。シンボルを別のフレームピッカーパネルに読み込むことで、複数のシンボルを操作します。
ループ。ループ、一回再生、単一フレームなどグラフィックのループオプションを表示します。
スライダー。プレビューのサイズを調整します。
スライダー左ボタン。ビューが表示するフレームを多くします。
スライダー右ボタン。ビューが表示するフレームを 少なく します。
フレームフィルターオプションドロップダウン。各種フレームフィルターオプションを表示します。
キーフレームを作成
「キーフレームを作成」オプションがオンの場合、このオプションを使用すると、フレームピッカーパネルでフレームを選択する際に、キーフレームが自動的に作成されます。
現在のシンボルをピン留めおよび新しいフレームパネルを開く
フレームピッカーパネルには、現在のシンボルをピン留めするためのオプションがあります。シンボルはパネルに読み込まれたままになり、フレームの選択が変更されても、そのシンボルを操作できます。
シンボルがピン留めされると、このシンボルは、ライブラリに存在する限り、または明示的にピン留めが解除されるまで、記憶されます。
また、フレームピッカーパネルは、シンボルを別のフレームピッカーパネルに読み込むことで、複数のシンボルを操作することもできます。
現在のフレームにピン留めされたシンボルのインスタンスがない場合にフレームピッカーパネルを使用しようとすると、シンボルのピン留めを解除するように求めるプロンプトが表示されます。
フレームのフィルタリングオプション
このパネルに表示するフレームを絞り込むためのオプションが用意されています。次のものでフィルタリングできます。
- すべてのフレーム - すべてのフレームを表示します。
- キーフレーム - キーフレームのみを表示します 。
- ラベル - ラベル付きのフレームのみを表示します。
自動リップシンク
自動リップシンクを使用すると、選択したオーディオレイヤーに基づいて、タイムラインに適切な口の形をすばやくより簡単に配置できます。グラフィックシンボル内で描画した、既存の口の形のリストを使用してこのような効果を得ることができます。グラフィックシンボルで自動リップシンクを適用すると、指定したオーディオレイヤーを分析した後、オーディオ口形素と一致する様々な場所で自動的にキーフレームが作成されます。完了したら、通常のワークフローとフレームピッカーを使用して、必要に応じてさらに調整を行うことができます。
口形素は、サウンドを示すために使用される汎用的な顔の画像です。
リップシンクの作成
次の手順に従って、リップシンクの作成を開始します。
-
グラフィックシンボル(口)を作成します。
グラフィックシンボル内で、すべての口の形/口形素を描画できます。
-
メインタイムラインで、新しいレイヤーにオーディオを読み込みます。
自動リップシンクでは、自動同期設定を「ストリーム」に設定することをお勧めします。
-
口のグラフィックシンボルを選択します。プロパティインスペクターでリンプシンクをクリックします。
リップシンクを作成ダイアログが表示されます。デフォルトでは、次のスクリーンショットのように、12 種類の基本的な口形素が表示されます。
-
任意の口形素をクリックして口の形のマッピングを変更します。ポップアップが表示され、グラフィックシンボル内のすべてのポーズが表示されます。ポップアップから適切なフレームを選択し、現在の口形素用に設定します。
-
リップを同期するオーディオレイヤーを選択します。「同期」ボタンをクリックします。
自動リップシンクは、選択したグラフィックのシンボルがあるフレームスパンに適用されます。また、選択したフレーム範囲でリップシンクを適用するために、最初に複数のキーフレームを選択することもできます。
-
ファイルを実行し、出力をプレビューするには Ctrl+Enter を押します。
サウンドファイルとも同期されている、自動生成された口の動きを使用して、アニメーションファイルを表示できます。
Animate でのリップシンクの自動化
Animate では、リップシンクは、自動化オプションにより簡単に行えるようになりました。アニメーション化されたキャラクターに対して正確なリップシンクを追加するには、この例の最後にあるチュートリアルを参照して、次の手順に従ってください。
-
キャラクターの口をダブルクリックします。
-
プロパティで、リップシンクをクリックします。
-
リップシンクを作成ダイアログが表示されます。デフォルトでは、12 種類の基本的な口形素が表示されます。
-
任意の口形素をクリックして口の形のマッピングを変更します。ポップアップが表示され、グラフィックシンボル内のすべてのポーズが表示されます。適切なフレームを選択します。
-
リップを同期するオーディオレイヤーを選択します。「同期」ボタンをクリックします。
Animate でアニメーション化されたキャラクターを自動的にリップシンクさせる方法
シンボルインスタンスの分解
インスタンスとシンボルのリンクを解除して、インスタンスをグループ化されていないシェイプと線の集合にするには、インスタンスを分解します。この機能は、他のインスタンスに影響を与えることなく特定のインスタンスを大幅に変更する場合に便利です。
インスタンスを分解した後でそのソースシンボルを変更しても、インスタンスは影響を受けません。
-
ステージでインスタンスを選択します。
-
修正/分解を選択します。これにより、インスタンスがその構成要素であるグラフィックエレメントに分解されます。
-
エレメントを修正するには、ペイントツールや描画ツールを使用します。
ステージ上のインスタンスに関する情報の取得
プロパティインスペクターと情報パネルには、ステージ上で選択されているインスタンスに関して次の情報が表示されます。
プロパティインスペクターでは、インスタンスのタイプおよび設定を表示できます。すべてのインスタンスタイプについて、カラー効果設定、場所、サイズが表示されます。グラフィックについてはループモードとそのグラフィックを格納している最初のフレームが、ボタンについてはインスタンス名(名前が付けられている場合)とトラッキングオプションが、ムービークリップについてはインスタンス名(名前が付けられている場合)がそれぞれ表示されます。位置については、プロパティインスペクターに、シンボルの基準点の x 座標と y 座標が表示されます。
情報パネルでは、インスタンスのサイズと場所、および基準点の位置を表示できます。また、インスタンスの赤(R)、緑(G)、青(B)、およびアルファ(A)の値(単色で塗られている場合)、およびポインターの位置も表示できます。プロパティインスペクターの「位置とサイズ」セクションには、シンボルの基準点または変形点の x 座標と y 座標が表示されます。基準点または変形点の座標の表示を切り替えることができます。
ムービーエクスプローラーには、インスタンスとシンボルを含めた、現在のドキュメントの内容が表示されます。
アクションパネルには、ボタンまたはムービークリップに割り当てられたアクションが表示されます。
インスタンスに関する情報の取得
-
ステージでインスタンスを選択します。
-
プロパティインスペクター(ウィンドウ/プロパティ)またはパネルを表示し、必要に応じて次の操作を実行します。
情報パネルを表示するには、ウィンドウ/情報を選択します。
ムービーエクスプローラーを表示するには、ウィンドウ/ムービーエクスプローラーを選択します。
アクションパネルを表示するには、ウィンドウ/アクションを選択します。
選択したシンボルのシンボル定義をムービーエクスプローラーで表示
-
ムービーエクスプローラーの上部にある、「ボタン、ムービークリップ、グラフィックの表示」ボタンをクリックします。
-
右クリック(Windows)または Control キーを押しながらクリック(Mac OS)し、「シンボル定義の表示」と「シンボル定義」を選択します。もしくは、ムービーエクスプローラーの右上隅のメニューでこれらのオプションを選択します。
選択したシンボルのインスタンスを含むシーンへの移動
-
シンボル定義を表示します。
-
右クリック(Windows)または Control キーを押しながらクリック(Mac OS)し、「ムービーエレメントの表示」と「シンボル定義」を選択します。もしくは、ムービーエクスプローラーの右上隅のメニューでこれらのオプションを選択します。