Animate でのシンボルの操作

  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. ビデオのキューポイントの操作
    9. Animate でのオブジェクトの描画および作成
    10. 線とシェイプの変更
    11. Animate CC での線、塗り、グラデーション
    12. Adobe Premiere Pro と After Effects の使用
    13. Animate CC のカラーパネル
    14. Animate で Flash CS6 ファイルを開く
    15. Animate でのクラシックテキストの操作
    16. Animate へのアートワークの挿入
    17. Animate に読み込まれたビットマップ
    18. 3D グラフィック
    19. Animate でのシンボルの操作
    20. Adobe Animate での線とシェイプの描画
    21. Animate でのライブラリの使用
    22. サウンドの書き出し
    23. Animate CC でのオブジェクトの選択
    24. Animate での Illustrator AI ファイルの操作
    25. スプレーブラシツールでのパターンの適用
    26. ブレンドモードの適用
    27. オブジェクトの配置
    28. コマンドメニューを使用したタスクの自動化
    29. 多言語テキスト
    30. Animate でのカメラの使用
    31. Adobe Scout での Animate の使用
    32. Fireworks ファイルの作業
    33. グラフィックフィルター
    34. サウンドと ActionScript
    35. 描画の環境設定
    36. ペンツールを使用した描画
  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. ベストプラクティス - アクセシビリティガイドライン
    12. Animate ワークスペースのアクセシビリティ
    13. スクリプトの記述と管理
    14. カスタムプラットフォームサポートの有効化
    15. カスタムプラットフォームサポートの概要
    16. アクセシビリティコンテンツの作成
    17. カスタムプラットフォームサポートプラグインの操作
    18. ActionScript 3.0 のデバッグ
    19. カスタムプラットフォームサポートの有効化
  8. 書き出しとパブリッシュ
    1. Animate CC からファイルを書き出す方法
    2. OAM パブリッシング
    3. SVG ファイルの書き出し
    4. Animate によるグラフィックとビデオの書き出し
    5. AS3 ドキュメントのパブリッシュ
    6. モバイルアプリおよびゲームエンジン用アニメーションの書き出し
    7. サウンドの書き出し
    8. QuickTime ビデオファイルの書き出し
    9. ActionScript を使用した外部ビデオ再生の制御
    10. ベストプラクティス - モバイルデバイス向けのコンテンツ作成のヒント
    11. ベストプラクティス - ビデオ規則
    12. ベストプラクティス - SWF アプリケーションのオーサリングガイドライン
    13. ベストプラクティス - FLA ファイルの構造化
    14. FLA ファイルを Animate 向けに最適化するベストプラクティス
    15. ActionScript パブリッシュ設定
    16. Animate のパブリッシュ設定の指定
    17. プロジェクターファイルの書き出し
    18. 画像とアニメーション GIF の書き出し
    19. HTML パブリッシュ用テンプレート
    20. Adobe Premiere Pro と After Effects の使用
    21. アニメーションのクイック共有とパブリッシュ

シンボルについて

「シンボル」とは、グラフィック、ボタンまたはムービークリップです。Animate(旧 Flash Professional CC)オーサリング環境で作成するか、または SimpleButton(AS 3.0)クラスおよび MovieClip クラスを使用して作成します。一度作成したシンボルは、様々なドキュメント内で何度も再利用できます。

シンボルには、他のアプリケーションから読み込んだアートワークを組み込むことができます。作成されたシンボルは、現在のドキュメントのライブラリに自動的に格納されます。

インスタンス」とは、ステージ上または別のシンボルの内部に配置されたシンボルのコピー(正確には、シンボルを参照するエイリアスのようなもの)です。インスタンスは個々が属性を持つので、元になるシンボルとは異なるカラー、サイズ、機能を備えることができます。シンボルを編集した場合は、そのシンボルの全インスタンスが更新されますが、シンボルの 1 つのインスタンスにエフェクトを適用した場合は、そのインスタンスだけが更新されます。

ドキュメントでシンボルを使用すると、ファイルサイズが大幅に縮小されます。これは、シンボルのインスタンスを複数保存するのに必要な格納スペースが、シンボルのコンテンツのコピーを複数保存する場合と比べて小さいからです。例えば、背景イメージなどの静止画をシンボルに変換して再利用することにより、ドキュメントのファイルサイズを縮小できます。Flash® Player でもシンボルは一度しかダウンロードする必要がないので、SWF ファイルの再生を高速化できます。

シンボルは、オーサリング時および実行時に、共有のライブラリアセットとして複数のドキュメント間で共有できます。実行時のランタイム共有アセットでは、ソースドキュメント内のアセットを、任意の数のターゲットドキュメントにリンクさせることができます。その際、アセットをターゲットドキュメントに読み込む必要はありません。オーサリング時のオーサータイム共有アセットとしては、ローカルネットワーク上で利用可能な他のシンボルを使用して、シンボルの更新や置換ができます。

ライブラリ内に存在しているものと同じ名前のライブラリアセットを読み込む場合でも、誤って既存のアセットを上書きすることなく、名前の重複を解決できます。

シンボルに関する追加の概要は、次の情報源から得ることができます。

シンボルのタイプ

各シンボルは、レイヤーを含んだ固有のタイムラインとステージを備えています。メインタイムラインと同様に、シンボルのタイムラインにフレーム、キーフレーム、レイヤーを追加することができます。シンボルを作成する際には、シンボルのタイプを選択します。

  • 静止イメージに関してや、メインタイムラインに連動する再利用可能なアニメーションの作成に関しては、グラフィックシンボル を使用します。グラフィックシンボルは、メインタイムラインに合わせて動作します。グラフィックシンボルのアニメーションシーケンスでは、インタラクティブコントロールとサウンドは機能しません。グラフィックシンボルにはタイムラインがないため、ボタンやムービークリップに比べると、FLA ファイルのサイズの増加が少なくてすみます。

  • マウスのクリックやロールオーバーなどのアクションに反応するインタラクティブボタンを作成するには、ボタンシンボル を使用します。ボタンの各状態に関連付けるグラフィックを定義し、ボタンインスタンスにアクションを割り当てます。詳しくは、『ActionScript 3.0 開発ガイド』の「イベントの処理」を参照してください。

  • 再利用可能なアニメーションを作成するには、ムービークリップシンボル を使用します。ムービークリップは、メインタイムラインとは別に独自のマルチフレームタイムラインを備えています。ムービークリップはメインタイムライン内にネストされ、インタラクティブコントロールやサウンドだけでなく、別のムービークリップインスタンスまでも含むことができます。また、ボタンシンボルのタイムライン内部にムービークリップインスタンスを配置すれば、アニメーション化したボタンを作成することもできます。また、ムービークリップは ActionScript® でスクリプトを作成することが可能です。

  • フォントを書き出して他の Animate ドキュメントで使用するには、フォントシンボルを使用します。

    Animate には、ビルトインのコンポーネント(パラメーターの定義されたムービークリップ)が用意されています。コンポーネントを使用して、ボタン、チェックボックス、スクロールバーなど、ユーザーインターフェイスエレメントをドキュメントに追加できます。詳しくは、『ActionScript 3.0 コンポーネントガイド』の「ActionScript 3.0 コンポーネントについて」を参照してください。

    注意:コンポーネントインスタンス内のアニメーションおよび 9 スライスのムービークリップの拡大/縮小を Animate のオーサリング環境でプレビューするには、制御/ライブプレビューを有効にするを選択します。

シンボルの作成

ステージで選択したオブジェクトからシンボルを作成するか、空白のシンボルを作成してシンボル編集モードで内容を作成または読み込むか、Animate でフォントシンボルを作成することができます。シンボルには、アニメーションなど、Animate で作成できるすべての機能を持たせることができます。

アニメーションを含んだシンボルを使用すれば、ファイルサイズを最小限に抑えながら、動きの多い Animate アプリケーションを作成できます。例えば、鳥が羽をはばたく様子などを表現するには、繰り返しのアクションや周期的なアクションを含んだアニメーションをシンボル内に作成することをお勧めします。

ドキュメントにシンボルを追加するには、ランタイムまたはオーサータイム共有ライブラリアセットを使用します。

選択したエレメントからシンボルへの変換

  1. ステージでエレメントを選択します。次のいずれかの操作を行います。
    • 修正/シンボルに変換を選択します。

    • 選択したエレメントをライブラリパネルにドラッグします。

    • 右クリック(Windows)、または Control キーを押しながらクリック(Mac OS)して、コンテキストメニューから「シンボルに変換」を選択します。

  2. シンボルに変換ダイアログボックスで、シンボルの名前を入力し、タイプを選択します。
  3. 基準グリッド内をクリックし、シンボルの基準点の位置を定めます。
  4. 「OK」をクリックします。

    Animate によりシンボルがライブラリに追加されます。ステージで選択したエレメントは、シンボルのインスタンスに自動的に置き換えられます。作成済みのシンボルは、編集/シンボルの編集を選択してシンボル編集モードで編集することや、編集/同じ位置で編集を選択してステージ上のコンテキスト内で編集することができます。また、シンボルの基準点を変更することもできます。

空のアイテムの作成

  1. 次のいずれかの操作を行います。
    • 挿入/新規シンボルを選択します。

    • ライブラリパネルの左下部にある「新規シンボル」ボタンをクリックします。

    • ライブラリパネルの右上隅にあるライブラリパネルメニューから「新規シンボル」を選択します。

  2. 新規シンボルの作成ダイアログボックスで、シンボルの名前を入力し、タイプを選択します。
  3. 「OK」をクリックします。

    Animate によりシンボルがライブラリに追加され、シンボル編集モードに切り替わります。シンボル編集モードでは、ステージの左上隅の上にシンボル名が表示され、十字カーソルでシンボルの基準点が示されます。

  4. タイムラインを使用するか、描画ツールで描画するか、メディアを読み込むか、または別のシンボルのインスタンスを作成するなどして、シンボルの内容を作成します。
  5. ドキュメント編集モードに戻るには、次のいずれかの操作を行います。
    • 「戻る」ボタンをクリックします。

    • 編集/ドキュメントの編集を選択します。

    • 編集バーに表示されたシーン名をクリックします。

      シンボルの作成時、基準点はシンボル編集モードのウィンドウの中心に配置されています。シンボルのコンテンツは、基準点からの相対位置でウィンドウ内に配置できます。基準点を変更するには、シンボルの編集時に、基準点に対してシンボルコンテンツを動かします。

  6. 「ActionScript リンケージ」セクションで、「ActionScript 用に書き出し」チェックボックスを選択することで、ActionScript を書き出しするよう選択できます。クラスおよび基本クラスが自動的に表示されます(クラス名は変更できます)。外部 AS ファイルまたはリンクされた SWC ファイル内でクラス定義が検索されます。クラス定義がどちらにも見つからない場合は、クラスファイルが自動生成されます。詳しくは、この記事を参照してください。

(Animate のみ)複数のシンボルの入れ替え

「シンボルを入れ替え」オプションを使用すると、シンボルを、選択したシンボルまたはビットマップと入れ替えることができます。

  1. Animate ドキュメントで、ステージ上の複数のシンボルを選択します。

  2. プロパティパネルで、「入れ替え」をクリックします。
  3. シンボルの入れ替えダイアログで、選択したすべてのシンボルまたはビットマップと置き換えるシンボルを選択します。
  4. 「OK」をクリックします。

ステージ上のアニメーションからムービークリップへの変換

ステージ上のアニメーションシーケンスを再利用するか、またはインスタンスとして操作するには、アニメーションシーケンスを選択し、ムービークリップシンボルとして保存します。

  1. メインタイムラインで、使用するステージ上のアニメーションの各レイヤーに含まれるすべてのフレームを選択します。フレームの選択に関して詳しくは、タイムラインへのフレームの挿入を参照してください。
  2. 次のいずれかの方法でフレームをコピーします。
    • 選択したフレームを右クリック(Windows)または Control キーを押しながらクリック(Mac OS)して、コンテキストメニューから「フレームのコピー」を選択します。シーケンスをムービークリップに変換後に削除する場合は、「カット」を選択します。

    • 編集/タイムライン/フレームのコピーを選択します。シーケンスをムービークリップに変換後に削除する場合は、「フレームをカット」を選択します。

  3. 選択を解除し、ステージ上で何も選択されていないことを確認します。挿入/新規シンボルを選択します。
  4. シンボルに名前を付けます。「タイプ」で「ムービークリップ」を選択し、「OK」をクリックします。
  5. タイムラインで、レイヤー 1 のフレーム 1 をクリックし、編集/タイムライン/フレームのペーストを選択します。

    これにより、メインタイムラインからコピーしたフレーム(およびレイヤーとレイヤー名)が、このムービークリップシンボルのタイムラインにペーストされます。コピーしたフレームに含まれていたアニメーション、ボタン、インタラクティブ機能のすべてが、再利用可能な独立したアニメーション(ムービークリップシンボル)となります。

  6. ドキュメント編集モードに戻るには、次のいずれかの操作を行います。
    • 「戻る」ボタンをクリックします。

    • 編集/ドキュメントの編集を選択します。

    • ステージ上部の編集バーに表示されたシーン名をクリックします。

シンボルの複製

シンボルを複製すると、既存のシンボルを基にシンボルを作成できます。

また、インスタンスを併用することで、シンボルの外観を変更したバージョンも作成できます。

ライブラリパネルを使用してシンボルを複製

  1. ライブラリパネルでシンボルを選択して、次のいずれかの操作を行います。
    • 右クリック(Windows)または Control キーを押しながらクリック(Mac OS)して、コンテキストメニューから「複製」を選択します。

    • ライブラリパネルメニューから「複製」を選択します。

インスタンスを選択してシンボルを複製

  1. ステージ上でシンボルのインスタンスを選択します。
  2. 修正/シンボル/シンボルの複製を選択します。

    シンボルが複製され、インスタンスが複製シンボルのインスタンスと置き換えられます。

シンボルの編集

シンボルを編集すると、Animate によりドキュメント内にあるそのシンボルのインスタンスすべてが自動的に更新されます。シンボルは次のようにして編集します。

  • 「同じ位置で編集」コマンドを使用して、ステージ上に他のオブジェクトと共に配置されたコンテキストの中で編集する方法。他のオブジェクトは、編集中のシンボルと区別するために薄く非アクティブ表示されます。編集中のシンボル名は、ステージの一番上にある編集バーで、現在のシーン名の右側に表示されます。

  • 「新規ウィンドウで編集」コマンドを使用して別のウィンドウで編集する方法。シンボルを別のウィンドウで編集すれば、シンボルとメインタイムラインを同時に参照できます。編集中のシンボル名は、ステージの一番上にある編集バーに表示されます。

    シンボルを編集するには、シンボル編集モードを使用して、ウィンドウをステージ表示からシンボルだけの表示に変更します。編集中のシンボル名は、ステージの一番上にある編集バーで、現在のシーン名の右側に表示されます。

    シンボルを編集すると、Animate により、ドキュメント内のそのシンボルの全インスタンスが更新され、編集内容が反映されます。シンボルの編集時には、任意の描画ツールを使用したり、メディアを読み込んだり、また、他のシンボルのインスタンスを作成したりできます。

  • シンボルの基準点(座標 0,0 で表される点)は、いずれの方法でシンボルを編集する場合にも変更できます。

 

シンボルを同じ位置で編集

  1. 次のいずれかの操作を行います。
    • ステージ上でシンボルのインスタンスをダブルクリックします。

    • ステージでシンボルのインスタンスを選択し、右クリック(Windows)または Control キーを押しながらクリック(Mac OS)して、「同じ位置で編集」を選択します。

    • ステージ上でシンボルのインスタンスを選択し、編集/同じ位置で編集を選択します。

  2. シンボルを編集します。
  3. 同じ位置で編集モードを終了して、ドキュメント編集モードに戻るには、次のいずれかの操作を行います。
    • 「戻る」ボタンをクリックします。

    • 編集バーのシーンメニューから、現在のシーン名を選択します。

    • 編集/ドキュメントの編集を選択します。

    • シンボルコンテンツ以外の場所をクリックします。

新規ウィンドウでシンボルを編集

  1. ステージでシンボルのインスタンスを選択し、右クリック(Windows)または Control キーを押しながらクリック(Mac OS)して、コンテキストメニューから「新規ウィンドウで編集」を選択します。
  2. シンボルを編集します。
  3. 右上隅(Windows)または左上隅(Mac OS)にある「クローズ」ボックスをクリックして新規ウィンドウを閉じ、メインドキュメントウィンドウ内をクリックしてメインドキュメントの編集に戻ります。

シンボル編集モードでシンボルを編集

  1. 次のいずれかの方法でシンボルを選択します。
    • ライブラリパネルで、シンボルのアイコンをダブルクリックします。

    • ステージでシンボルのインスタンスを選択し、右クリック(Windows)または Control キーを押しながらクリック(Mac OS)して、コンテキストメニューから「編集」を選択します。

    • ステージ上でシンボルのインスタンスを選択し、編集/シンボルの編集を選択します。

    • ライブラリパネルでシンボルを選択して、ライブラリパネルメニューから「編集」を選択します。あるいは、ライブラリパネルでシンボルを右クリック(Windows)または Control キーを押しながらクリック(Mac OS)し、「編集」を選択します。

  2. シンボルを編集します。
  3. シンボル編集モードを終了してドキュメントの編集に戻るには、次のいずれかの操作を行います。
    • ステージの一番上にある編集バーの左側で「戻る」ボタンをクリックします。

    • 編集/ドキュメントの編集を選択します。

    • ステージの一番上にある編集バーでシーン名をクリックします。

    • シンボルコンテンツ以外の場所をクリックします。

アドビのロゴ

アカウントにログイン