線とシェイプの変更

  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. アニメーションのクイック共有とパブリッシュ

ダイレクト選択ツールによるポイントの表示および調整

  1. ダイレクト選択ツール を選択します。
  2. 線またはシェイプのアウトラインをクリックします。

線またはシェイプの変更

線またはシェイプのアウトラインを変更するには、選択ツールを使用して、線上の任意のポイントをドラッグします。マウスポインターが変化して、線または塗りを変更する方法が示されます。

Animate では、移動したポイントの新しい位置に合わせて、線のセグメントの曲線が調整されます。位置を変更するポイントが終点である場合、線を延長または短縮できます。位置が変更されたポイントが角である場合、角を構成する線のセグメントは、延長または短縮されてもまっすぐに保たれます。

カーソルに直角が付いている場合は、線の端点で変形が行われます。カーソルに曲線が付いている場合は、線の中点から変形して曲線が作成されます。

ブラシ線によっては、アウトラインとして表示した方が簡単に変更できます。

線が複雑で変更が困難な場合は、細部を消去して滑らかにすると簡単に変更できます。表示比率を拡大すれば、シェイプの変更が容易になると同時に正確に変更できるようになります。

  1. 選択ツール を選択します。
  2. 次のいずれかの操作をおこないます。
    • セグメントのシェイプを変更するには、任意のポイントをドラッグします。

    • 線をドラッグして新しいコーナーポイントを作成るすには、Ctrl キー(Windows)または Option キー(Mac OS)を押しながらクリックします。

線をまっすぐで滑らかにする

まっすぐにする機能を使用すると、既に描画した線と曲線をまっすぐにする調整を行うことができます。このコマンドは、既にまっすぐになっている線のセグメントには適用されません。

注意:

線をまっすぐで滑らかにする程度は、描画設定の環境設定で調整します。

Animate にシェイプを認識させるには、まっすぐにするテクニックを使用します。シェイプの認識オプションをオフにして楕円、矩形、または三角形を描画する場合は、このオプションを使用してシェイプを幾何学的に完全な図形にします。ただし、他のエレメントに接触したり結合しているシェイプは識別されません。

シェイプの認識オプションによって、上のシェイプが下のシェイプに変更されます。

滑らかにする機能を使用すると、曲線は滑らかになり、でこぼこが少なくなります。曲線に使用されるセグメント数も少なくなります。ただし、直線に対しては適用されません。この機能は、多くの短いセグメントからなる曲線、編集が困難な曲線を変更する際に便利です。すべてのセグメントを選択してこの機能を適用すると、セグメント数が減って曲線が滑らかになり、シェイプを変更しやすくなります。

滑らかにする、またはまっすぐにする機能を繰り返し適用すると、各セグメントがさらに滑らかに、またはまっすぐになります。その変化の度合いは、セグメントがどの程度曲がっているか、あるいはまっすぐかによって異なります。

  • 選択した線の曲線を滑らかにするには、選択ツールを選択し、ツールパネルの「オプション」でスムージングボタン  をクリックします。スムージングボタンをクリックするたびに、選択した線が徐々に滑らかになります。

  • スムージング操作のパラメーターを入力するには、修正/シェイプ/滑らかにを選択します。スムーズダイアログボックスで「スムージング角度(上)」、「スムージング角度(下)」、「ストレートの強さ」の各パラメーターの値を入力します。

  • 選択した塗りのアウトラインまたは曲線を滑らかにするには、選択ツール  を選択し、ツールパネルの「オプション」でストレートボタン  をクリックします。

  • まっすぐにする操作のパラメーターを入力するには、修正/シェイプ/まっすぐにを選択します。ストレートダイアログボックスで「ストレートの強さ」パラメーターの値を入力します。

  • シェイプの認識を行うには、選択ツール  を選択し、ストレートボタン  をクリックするか、修正/シェイプ/まっすぐにを選択します。

曲線の最適化

曲線と塗りのアウトラインを改良し、エレメントを定義するために使用する曲線の数を減らすことにより、曲線の滑らかさを最適化します。曲線の最適化を行うと、Flash Professional ドキュメント(FLA ファイル)のサイズや書き出す Animate アプリケーション(SWF ファイル)のサイズが小さくなります。同じエレメントに対して最適化を何度でも実行できます。

  1. 最適化するエレメントを選択し、修正/シェイプ/最適化を選択します。
  2. スムージングの程度を指定するには、最適化の強さスライダーをドラッグします。スムージング効果は、選択された曲線によって異なります。通常、最適化によって曲線の数は減少し、アウトラインの形も変化します。
  3. 最適化の前と後に選択されているセグメント数を示すメッセージを表示するには、「処理結果を表示」オプションを選択します。Animate によって、操作の完了後にメッセージが表示されます。

  4. 「OK」をクリックします。

シェイプの修正

  1. 線を塗りに変換するには、線を選択し、修正/シェイプ/線を塗りに変換を選択します。選択した線は塗りつぶされたシェイプに変換されるので、線のグラデーション塗りや部分消去ができます。線を塗りに変換するとファイルサイズが大きくなり、アニメーションによっては描画速度が速くなります。
  2. 塗りつぶされたオブジェクトのシェイプを拡張するには、塗りつぶされたシェイプを選択し、修正/シェイプ/塗りを拡張を選択します。「幅」にピクセル単位で値を入力し、「方向」に「外側」または「内側」を選択します。「外側」はシェイプを拡張し、「内側」はシェイプを縮小します。

    この機能は、細部が少なく線を含まない単色で塗りつぶされたシェイプに最適です。

  3. オブジェクトのエッジをぼかすには、塗りつぶされたシェイプを選択し、修正/シェイプ/ソフトエッジを選択します。次のオプションを設定します。

    エッジをぼかす幅をピクセル単位で指定します。

    ステップの数

    ソフトエッジ効果に使用する曲線の数を指定します。ステップ数が多いほどきれいにぼかせます。ただし、ステップ数を増やすと、ファイルサイズが大きくなり、描画に時間がかかります。

    外側または内側

    エッジをぼかすためにシェイプを拡張するか縮小するかを指定します。

    この機能は、線を含まない単色で塗りつぶされたシェイプに最適ですが、Animate ドキュメントおよびそれによって生成される SWF ファイルのサイズが大きくなることがあります。

ステージ上のすべてのものを消去

  1. ツールバーの消しゴムツール をダブルクリックします。これにより、ステージおよびペーストボード上のすべてのタイプのコンテンツが消去されます。

線のセグメントまたは塗り領域を消去する

  1. 消しゴムツールを選択し、「流し消す」ボタン をクリックします。
  2. 消去する線のセグメントまたは塗り領域をクリックします。

ドラッグして消去する

  1. 消しゴムツールを選択します。
  2. 「消しゴムモード」ボタンをクリックし、消去モードを選択します。
    消しゴムモード修飾子
    消しゴムモード修飾子

    消す(標準)

    線と塗りを消去します。

    塗りを消す

    塗りのみを消去します。線には適用されません。

    線を消す

    線のみを消去します。塗りには適用されません。

    選択された塗りを消す

    選択されている塗りを消去します。選択されているかどうかにかかわらず、線には適用されません。(このモードで消しゴムツールを使用する前に、消去する塗りを選択しておきます)。

    内側を消す

    消しゴムツールの線で消去を開始した塗り領域のみを消去します。空白の部分から消し始めた場合は、何も消去されません。このモードは線には適用されません。

  3. 「消しゴムの形」ボタンをクリックして、消しゴムの形とサイズを選択します。「流し消す」ボタンがオフになっていることを確認してください。
    消しゴムシェイプ
    消しゴムシェイプ

    消しゴムシェイプのサイズを調整するには、水平スクロールバーを使用します。 

  4. カスタマイズしたシェイプをカスタマイズ、削除、または編集します。カスタムの消しゴムシェイプを作成するには、消しゴムシェイプアイコンカスタム消しゴムシェイプを追加アイコンをクリックします。ペン先のプロパティを定義するには、シェイプ、角度、および平坦度を選択します。カスタマイズしたシェイプを作成するには、「OK」をクリックします。

    消しゴム - ペンの先オプション
    消しゴム - ペンの先オプション

  5. ステージ上でドラッグします。

筆圧および傾きのオプションの使用

消しゴムツールに筆圧および傾きオプションが追加され、描画オプションが強化されました。

筆圧および傾きオプション
筆圧および傾きオプション

消しゴムツールを選択し、ツールバーから アイコンを選択すると、筆圧感知が有効になります。また、 アイコンを選択すると、傾き感知が有効になります。デフォルトのパーセント値は、筆圧と傾きの最小値と最大値がそれぞれ 1%と 100%です。

消しゴムツールを使用すると、消しゴムにかかる筆圧や傾きに基づいて可変線幅の線を作成できます。

説明用に、消しゴムの筆圧および傾きオプションを活用して描画したサンプルドローイングを次に示します。

筆圧および傾きオプションの適用を示す図
筆圧および傾きオプションの適用を示す図

消しゴムツールとブラシツールの同期設定

ブラシツール(B)および消しゴムツール(E)で、筆圧や傾き設定、ペン先のサイズおよびペン先のシェイプなどのサブ設定を同期できます。これらの設定は、Animate でセッションを終了して再起動した後でも記憶されます。

  1. 消しゴムツール(E)で、「ブラシとの同期設定」チェックボックスをオンにします。
  2. 消しゴムツール(E)の現在の設定がブラシツール(B)にミラーリングされます(逆も同様)。Wacom ペンは、常にブラシツール(B)からスムージング設定を使用します。Wacom の後端は、ブラシツール(B)が選択されている場合、ブラシ設定を使用します。その他のツールの場合、消しゴム設定を使用します。
消しゴムツールとブラシツールの同期設定

アクティブレイヤーで消去

消しゴムツール(E)を使用して、アクティブレイヤー上のみを消去できます。

消しゴムツール(E)で、「アクティブレイヤーで消去」チェックボックスをオンにします。

アクティブレイヤーで消去

アドビのロゴ

アカウントにログイン