Creative_Cloud_mnemonic_RGB_128px

Edge Animate CC のアップデートをご利用いただけます

詳しくは、新機能の概要を参照してください。


モーションパス

モーションパスにより、手動で描いた曲線のパスに沿って動作するエレメントに、表現豊かなモーションを追加できます。この機能を使用して、線形運動では実現できない流体物理学的な運動による現実世界の現象をエミュレートできます。

モーションパスを使用してエレメントの運動を制御するには、以下の手順に従ってください。

  1. ステージ上のエレメントを選択し、「位置とサイズ」アコーディオンの下にあるコンテキストプロパティパネル(CPP)の「モーションパス」をクリックします。

    コンテキストプロパティパネルの「モーションパス」オプション
    コンテキストプロパティパネルの「モーションパス」オプション

    コンポジション内の新しいエレメントのデフォルトの移動手段をモーションパスに設定するには、「レイアウトの初期設定」で「モーションパスを使用してアニメーション化」を選択します。

     

    新しいエレメントの初期設定としてモーションパスを使用する
    新しいエレメントの初期設定としてモーションパスを使用する

  2. キーフレームまたはピンを使用して通常行っているようにトランジションを作成します。このとき、次の図のように、2 つのアンカーポイント(三角形で表される)の間に線が描画されます。

    モーションパスの例
    動かされる「Bee」エレメント

    モーションパスの例
    「Bee」エレメントのパス

    線の任意の場所をクリックすると、ハンドルが表示されます。ハンドルをドラッグすることによって、ベジェ曲線を使用してパスを定義できます。「自動回転」オプションを使用して、オブジェクトがパスに沿って動くときのオブジェクトの方向を制御します。

    パスをクリックして編集用のハンドルを表示
    パスをクリックして編集用のハンドルを表示

    ベジェ曲線を使用して定義されたモーションパス

    • アンカーポイントを追加するには、パスをマウスでポイントし、クリックします。
    • アンカーポイントを削除するには、アンカーをマウスでポイントし、Ctrl キー(Windows)または Command キー(Mac OS)を押しながらクリックします。
    • ベジェ曲線を鋭角な点に変換するには、アンカーポイントをクリックし、Alt キー(Windows)または Option キー(Mac OS)を押しながらクリックします。
    • アンカーポイントのいずれかの側で 2 つのハンドルのリンクを解除し、互いに独立して移動できるようにするには、Alt キー(Windows)または Option キー(Mac OS)を押しながらクリックしてドラッグします。

タイムライン上の位置のキーフレームは、2 つの独立したモーションパスを表します。キーフレームを追加してパスを 2 つに分割したり、キーフレームを削除して 1 つの連続したパスを作成したりすることができます。モーションパスにイージングを適用することができ、イージング効果はパスごとに再生されます。

  • モーションパスを分割するには、タイムラインにキーフレームを追加します。
  • 連続したモーションパスを作成するには、タイムラインで位置のキーフレームを削除します。
  • 隣接する 2 つのモーションパスを間隔を置いて分割するには、Ctrl キー(Windows)または Command キー(Mac OS)を押しながら、連結されたキーフレームアンカーをクリックしてドラッグします。
  • 独立したモーションパスの 2 つのエンドアンカーを接続するには、アンカーをドラッグして近付けます。エンドアンカーは接続位置にスナップされます。

オブジェクトは変形の基点によってパスに結び付けられます。オブジェクトが中心からずれたパスに沿って移動するように、変形の基点を調整できます。

モーションパスとレスポンシブレイアウト

現在の実装では、モーションパスでパーセンテージベースのレイアウトを使用するように設定できません。この問題を回避するには、パスオブジェクトをグループ、親またはシンボル内に設定し、親でパーセンテージベースの配置を使用するように設定します。この方法を使用して、上/右/下/左を基準にしてモーションパスを設定することもできます。

チュートリアル

ウィンドウ/レッスンパネルをクリックし、「モーションパス」をクリックすると、Animate コンポジションでのモーションパスの使用方法に関するガイド付きの実習を実行できます。

CDN ホスティングによって最適化されたパブリッシュ

Adobe Content Deliver Network(CDN)でランタイムファイルを使用して、コンテンツの高速配信を許可します。そのためには、パブリッシュ設定で「Runtime ファイルを Adobe CDN でホスト」オプションを選択します。全く料金の発生しないキャッシュホスティングの特典付きで、プロジェクトのダウンロードを高速化できます。

コンテンツをオフラインで実行する必要がある場合は、パブリッシュ設定でこのオプションの選択を解除します。このオプションは初期設定では有効になっています。

CDN ホスティングによるパブリッシュ
CDN ホスティングによるパブリッシュ

テンプレート

テンプレートギャラリーからテンプレートの読み込み、保存、再利用ができるようになりました。この機能により、共通ファイルパターン用の Animate コンポジションを読み込むことができます。テンプレートでは、イメージ、テキスト、シンボル、フォントのほか、現在のコンポジションでカスタマイズした変更点をキャプチャできます。ビジュアルテンプレートローダーからテンプレートを読み込むこともできます。

テンプレートのメニューには、ようこそ画面(「テンプレートから作成」)または「ファイル」メニューからアクセスできます。テンプレートギャラリーで、テンプレートのインポートや削除ができるほか、テンプレートから新しいコンポジションを作成できます。

ファイルメニューの「テンプレートから作成」オプション
ファイルメニューの「テンプレートから作成」オプション

テンプレートファイルは、.antmpl という拡張子を持ち、自由に配布できると共に、ファイルシステムの任意の場所に格納できます。

スワイプジェスチャ

モバイル用の操作として、エレメントに左右のスワイプアクションをバインドできるようになりました。スワイプアクションは、コンポジション内のすべてのエレメントにバインドできます。スワイプジェスチャをステージ自体に割り当てるか、複数のエレメントに適用して、ユニークなモバイル操作性を作成できます。

タイムラインでエレメントを右クリックして、メニューから「<エレメント> のアクションを開く」をクリックします。次に、「swipeleft」または「swiperight」をクリックします。

スワイプジェスチャ
スワイプジェスチャ

スポイトツール

カラー選択パネルで新しいスポイトツールが導入されました。スポイトツールアイコンを選択して、ステージからカラーをサンプリングします。

スポイトツール
スポイトツール

エレメントのカラーコーディング

コンポジション内の様々なエレメントにカラーを割り当てることができるようになり、エレメントを容易に識別して操作できます。エレメントパネルまたはタイムラインでカラーパレットをクリックしてカラーを割り当てることができます。これらのカラーはタイムラインのトランジションにも反映されます。

タイムラインでのエレメントのカラーコーディング
タイムラインでのエレメントのカラーコーディング

エレメントパネルでのカラーコーディング
エレメントパネルでのカラーコーディング


エレメントパネルとタイムラインでのジャンプ

エレメントパネルやタイムラインでは、スクロールして選択したエレメントを表示できるようになりました(パネルがスクロールする場合)。

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー