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 に読み込む際には、様々な方法でビットマップを加工して Animate ドキュメントに使用することができます。

Animate ドキュメント内で、読み込まれたビットマップをオリジナルより大きなサイズで表示すると、イメージが歪む可能性があります。読み込むビットマップをプレビューして、イメージが正しく表示されるかどうかを確認してください。

ステージ上でビットマップを選択すると、プロパティインスペクターにビットマップのシンボル名とピクセルサイズ、およびステージでの位置が表示されます。プロパティインスペクターを使用して、ビットマップのインスタンスを入れ替えることができます。つまり、現在のドキュメント内でインスタンスを別のビットマップのインスタンスに置き換えることができます。

 

プロパティインスペクターにビットマップのプロパティを表示

  1. ステージでビットマップのインスタンスを選択します。

  2. ウィンドウ/プロパティを選択します。

ビットマップのインスタンスを別のビットマップのインスタンスに置き換え

  1. ステージでビットマップインスタンスを選択します。

  2. ウィンドウ/プロパティを選択し、「入れ替え」をクリックします。

  3. 現在インスタンスに割り当てられているビットマップを置き換えるビットマップを選択します。

ビットマッププロパティの設定

読み込まれたビットマップにアンチエイリアス処理をして、イメージのエッジを滑らかにすることができます。また、圧縮オプションを選択して、ビットマップのファイルサイズを小さくし、Web 上での表示に適したファイル形式を設定することもできます。

  1. ライブラリパネルでビットマップを選択し、このパネルの下部にある「プロパティ」ボタンをクリックします。
  2. 「スムージング」を選択します。スムージングによって、拡大/縮小されるときのビットマップイメージの品質が向上します。
  3. 「圧縮」では、次のいずれかのオプションを設定します。

    写真画質(JPEG)

    イメージを JPEG 形式で圧縮します。読み込まれたイメージに指定されたデフォルトの圧縮形式を適用するには、「デフォルトの画質を適用」をオンにします。新たに高品質圧縮形式を適用するには、「デフォルトの画質を適用」をオフにして、「画質」テキストフィールドに 1 ~ 100 の範囲で値を入力します(設定値が高いほどイメージの画質は高くなりますが、ファイルサイズは大きくなります)。

    可逆圧縮(PNG/GIF)

    このオプションを選択すると、イメージが可逆圧縮され、イメージからデータが削除されません。

    注意:グラデーション塗りを含む写真やイメージなど、カラーやトーンが複雑に変化するイメージには、「写真画質(JPEG)」を使用します。使用されているシェイプが単純でカラーがほとんどないイメージには、「可逆圧縮(PNG/GIF)」を使用します。

  4. ファイル圧縮の結果を確認するには、「テスト」ボタンをクリックします。選択した圧縮の設定が適切かどうかを判断するには、元のファイルサイズと圧縮後のファイルサイズを比較します。
  5. 「OK」をクリックします。
注意:

パブリッシュ設定ダイアログボックスで選択する「JPEG 画質」では、読み込まれた JPEG ファイルの画質を指定できません。ビットマッププロパティダイアログボックスで、読み込まれた各 JPEG ファイルの画質を設定します。

(Animate のみ)複数のビットマップの入れ替え

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

  1. Animate で、ステージ上の複数のビットマップを選択します。

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

実行時のビットマップの読み込み

実行時にビットマップをドキュメントに追加するには、ActionScript® 2.0 または ActionScript 3.0 の BitmapData コマンドを使用します。そのためには、ビットマップのリンケージ識別子を指定します。 詳しくは、「ライブラリ内のアセットへのリンケージ割り当て」(『ActionScript 2.0 の学習』)または「ActionScript に対するライブラリシンボルの書き出し」(『ActionScript 3.0 開発ガイド』)を参照してください。

  1. ライブラリパネルでビットマップを選択します。
  2. 次のいずれかの操作を行います。
    • パネルの右上隅にあるパネルメニューで「リンケージ」を選択します。

    • ライブラリパネルで、ビットマップ名を右クリック(Windows)または Control キーを押しながらクリック(Mac OS)し、コンテキストメニューから「プロパティ」を選択します。

      プロパティダイアログボックスで「リンケージプロパティ」が表示されない場合は、「詳細」をクリックします。

  3. 「リンケージ」で、「ActionScript に書き出し」を選択します。
  4. テキストフィールドに識別子ストリングを入力し、「OK」をクリックします。

ビットマップの塗りとしての適用

ビットマップを塗りとしてグラフィックオブジェクトに適用するには、カラーパネルを使用します。ビットマップを塗りとして適用すると、オブジェクトがパターンタイルで塗りつぶされます。グラデーション変形ツールを使用して、イメージやビットマップの塗りを伸縮、回転、または傾斜させることもできます。

  1. 塗りを既存のアートワークに適用するには、ステージでグラフィックオブジェクトを選択します。
  2. ウィンドウ/カラーを選択します。
  3. パネル中央のポップアップメニューからビットマップを選択します。
  4. 現在のドキュメントでより多くのビットマップを表示できるようプレビューウィンドウのサイズを拡大するには、右下隅の三角形をクリックしてカラーパネルを拡大します。
  5. ビットマップをクリックして選択します。

    ビットマップが現在の塗りのカラーになります。手順 1 でアートワークを選択した場合、ビットマップがアートワークに塗りとして適用されます。

外部エディターでのビットマップの編集

統合されたイメージとして読み込まれた Fireworks PNG ファイルを編集する場合は、ビットマップの PNG ソースファイルを編集します。

注意:

編集可能なオブジェクトとして読み込まれた Fireworks PNG ファイルのビットマップを、外部イメージエディターで編集することはできません。

Fireworks 3 以降、またはその他のイメージ編集アプリケーションがシステムにインストールされている場合は、Animate からそのアプリケーションを起動して、読み込まれたビットマップを編集できます。

Photoshop CS5 以降によるビットマップの編集

注意:

CS5.5 を使用している場合、この機能にアクセスするには、Photoshop CS5.1 を使用する必要があります。

  1. ライブラリパネルで、ビットマップのアイコンを右クリック(Windows)または Control キーを押しながらクリック(Mac OS)し、「Photoshop CS5 を使用して編集する」を選択します。

  2. Photoshop のファイルに必要な修正を加えます。

  3. Photoshop で、ファイル/保存を選択します(ファイル名や形式は変更しないでください)。

  4. Animate に戻ります。

    ファイルは、Animate で自動的に更新されます。

Fireworks 3 以降でのビットマップの編集

  1. ライブラリパネルで、ビットマップのアイコンを右クリック(Windows)または Control キーを押しながらクリック(Mac OS)し、Fireworks 3 での編集を選択します。

  2. PNG ソースファイルとビットマップファイルのどちらを開くかを指定します。

  3. Fireworks のファイルに必要な修正を加えます。

  4. Fireworks でファイル/更新を選択します。

  5. Animate に戻ります。

    ファイルは、Animate で自動的に更新されます。

その他のイメージ編集アプリケーションによるビットマップの編集

  1. ライブラリパネルで、ビットマップのアイコンを右クリック(Windows)または Control キーを押しながらクリック(Mac OS)し、「編集」を選択します。

  2. イメージ編集アプリケーションを選択してビットマップファイルを開きます。

  3. イメージ編集アプリケーションで、ファイルに必要な修正を加えます。

  4. イメージ編集アプリケーションでファイルを保存します。

    ファイルは、Animate で自動的に更新されます。

  5. Animate に戻り、ドキュメントの編集を続けます。

ビットマップの分解およびビットマップの塗りの作成

ステージ上のビットマップを分解すると、ステージ上のイメージがライブラリ項目から分離され、ビットマップインスタンスからシェイプに変換されます。分解したビットマップは、Animate の描画ツールとペイントツールで修正できます。自動選択ツールを使用すると、同一または類似のカラーを含むビットマップの領域を選択できます。

分解されたビットマップを使用してペイントするには、スポイトツールでビットマップを選択し、バケツツールまたはその他の描画ツールを使用してそのビットマップを塗りとして適用します。

ビットマップの分解

  1. 現在のシーンでビットマップを選択します。

  2. 修正/分解を選択します。

分解されたビットマップでの領域の塗りの変更

  1. ツールパネルで、自動選択ツールを選択します。自動選択ツールが隠れている場合は、なげなわツールをクリックし、ポップアップメニューから自動選択ツールを選択します。プロパティインスペクターで、以下のオプションを設定します。

    • 「選択する色の範囲」では、1 ~ 200 の範囲で値を入力し、隣接するピクセルのカラー値がどのくらい近いときに選択範囲に含めるかを指定します。大きな値を指定するほど、含める色の範囲が広くなります。「0」を入力すると、最初にクリックしたピクセルと完全に同じカラーのピクセルだけが選択されます。

    • 「スムージング」では、選択範囲のエッジをどのくらい滑らかにするかを指定します。

  2. 領域を選択するには、ビットマップをクリックします。選択範囲に追加するには、追加する範囲を続けてクリックします。

  3. ビットマップ内で選択した領域を塗りつぶすには、塗りのカラーコントロールから塗りを選択します。

  4. 新しい塗りを適用するには、バケツツールを選択し、選択した領域の任意の場所をクリックします。

ビットマップのベクターグラフィックへの変換

「ビットマップのトレース」コマンドを使用すると、ビットマップが、編集可能なカラー領域を持つベクターグラフィックに変換されます。イメージは、ベクターグラフィックとして編集します。また、ファイルサイズを小さくすることができます。

ビットマップをベクターグラフィックに変換すると、そのベクターグラフィックはライブラリパネルのビットマップシンボルにリンクされなくなります。

注意:

読み込まれたビットマップに複雑な形状や多数のカラーが使用されている場合、そのビットマップを変換したベクターグラフィックのファイルサイズが、オリジナルのビットマップより大きくなることがあります。ファイルサイズとイメージ画質のバランスがとれるように、ビットマップのトレースダイアログボックスで様々な設定を試してみてください。

ビットマップを分解し、Animate の描画ツールやペイントツールを使用してイメージを修正することもできます。

  1. 現在のシーンでビットマップを選択します。

  2. 修正/ビットマップ/ビットマップのトレースを選択します。

  3. 「色のしきい値」の値を入力します。

    2 つのピクセルが比較されたときに、RGB 値の差が指定した色のしきい値よりも小さい場合は、その 2 つのピクセルが同じ色として処理されます。色のしきい値が大きいほど、カラーの数が少なくなります。

  4. 「ノイズの許容量」では、ピクセルに色を割り当てるときに、その対象となる周囲のピクセル数を指定する値を入力します。

  5. 「トレースの精度」では、アウトラインの滑らかさを設定するオプションを選択します。

  6. 「ポイントの数」では、鋭いエッジを残すか滑らかにするかを選択します。

    オリジナルのビットマップに最も近いベクターグラフィックを作成するには、次の値を入力します。

    • 色のしきい値:10

    • ノイズの許容量:1 ピクセル

    • トレースの精度:ピクセル

    • ポイントの数:多い

スポイトツールを使用したビットマップの塗りの適用

  1. スポイトツールを選択して、ステージ上の分解されたビットマップをクリックします。スポイトツールでビットマップが現在の塗りに設定され、アクティブツールがバケツツールに変更されます。

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

    • ビットマップを塗りとして適用するには、既存のグラフィックオブジェクトをバケツツールでクリックします。

    • 楕円ツール、矩形ツール、またはペンツールを選択して、新規オブジェクトを描画します。このオブジェクトは、分解されたビットマップで塗りつぶされます。

      ビットマップの塗りを伸縮、回転、または傾斜させるには、自由変形ツールを使用します。

アドビのロゴ

アカウントにログイン