- 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 の使用
- アニメーションのクイック共有とパブリッシュ
- トラブルシューティング
イージングとは、アニメーション中に徐々に速度を上げたり下げたりすることです。これによって、トゥイーンをより現実的または自然に見せることができます。イージングを使用して特殊な動きを再現することで、ランダムな動きやボールが弾む動きなどのアニメーションを作成できます。緩やかなイージング曲線を使用して変化率を徐々に調整すれば、加速や減速をより自然に見せることができます。イージングを利用して x や y などのプロパティを変化させ、ランダムに飛び回る動きを実現することもできます。
モーショントゥイーンへのプリセットおよびカスタムイージングの追加
Animate では、モーショントゥイーンにイージングを適用する方法が 2 つあります。
- モーショントゥイーンのそれぞれに対して、モーションプロパティインスペクターにあるイージングスライダーを使用してイージング値を指定できます。
- モーションエディターを使用して、プリセットまたはカスタムイージングを 1 つ以上のプロパティに適用できます。
モーションプロパティインスペクターでモーショントゥイーンにイージングを適用するには:
- motionease.fla という名前のファイルを作成します。
- いずれかの描画ツールでグラフィックを作成し、すべてのグラフィックを選択して、右クリックするか Control キーを押しながらクリックし、「モーショントゥイーンを作成」を選択します。「OK」をクリックして図形をシンボルに変換します。タイムラインに 1 秒分のフレームが追加されますが、必要な場合は、トゥイーンスパンの末尾をドラッグして、24 フレーム以上の長さにします。
- 再生ヘッドをトゥイーンスパンの最終フレームに移動し、インスタンスをステージ上の別の場所に移動します。
- トゥイーンスパンを選択して、モーションプロパティインスペクターで「イージング」ホットテキスト(「イージング」の隣の青いテキスト)をドラッグします。値を入力して、トゥイーン処理されたフレームの間の変化速度を調整することもできます。
- モーショントゥイーンを開始し、アニメーションの最後に近づくにしたがって加速するには:
- ホットテキストをドラッグして、-1 ~ -100 の負の値を入力します。
- ホットテキストをドラッグして、1 ~ 100 の正の値を入力します。
- 制御/ムービープレビューを選択し、アニメーションをテストします。イージングを適用したことで、ステージ上のトゥイーンドットがどのように変化したかに注目してください。
- 「イージング」セクションまで下にスクロールし、バウンス数を 5 に変更します。
関連項目
モーションエディターでのイージング
グラフ化可能なプロパティにイージングを適用すると、「値」カテゴリのホットテキストがグレー表示になります。ホットテキスト(トゥイーン処理された値)はイージングの式で制御され、値には制限があります。編集するには、グラフの実線の曲線で制御点または他のベジェ編集ツールを使用します。または、イージングを無効にし、ホットテキストコントロールを使用してから、イージングを再び有効にして、変更の結果を確認する方法もあります。
モーショントゥイーンへのカスタムイージングの追加
カスタムイージングを使用すると、モーションエディターのグラフを使用して独自のイージングを作成できます。トゥイーン処理されたインスタンスの任意のプロパティにカスタムイージングを適用することもできます。
カスタムのイージンググラフは、一定時間内のモーションの度合いを表します。水平軸はフレームを、垂直軸はトゥイーンの変化のパーセンテージを表します。アニメーション内の開始の値は 0 %です。終了キーフレームには 0 ~ 100 %の値を設定できます。グラフの曲線の傾きは、トゥイーン処理されたインスタンスの変化速度を表します。グラフ上に水平線(傾きなし)を作成した場合は速度 0 であり、グラフ上に垂直線を作成した場合は、変化率は一瞬です。
- モーショントゥイーンを作成します。
- タイムラインでトゥイーンスパンを選択し、モーションエディターを開きます。
- 「Eases(イージング)」カテゴリまでスクロールし、Add(追加)ボタンをクリックし、メニューから「Custom(カスタム)」を選択します。
カスタムイージングの変更と適用
カスタムイージングは、モーションエディターの他のプロパティグラフにある標準のベジェ編集コントロールを使用して編集できます。この機能を使用すると、カスタム曲線を作成してキーフレームの間のイージングを実現できます。
プロパティにカスタムイージングを適用するには、イージングメニューからカスタムイージングの名前を選択します。イージングを適用すると、プロパティグラフが更新され、トゥイーン処理された実際の値を示す破線の曲線が表示されます。
カスタムイージングのコピーと保存
他のトゥイーンインスタンスや他のドキュメントでカスタムイージングを再利用するには、以下のいずれかの方法を使用します。
- カスタムイージンググラフ(グラフの曲線の外側)を右クリックして、「曲線をコピー」を選択します。次に、もう 1 つのインスタンスで、カスタムイージングを追加し、カスタムイージンググラフを右クリックして、「曲線をペースト」を選択します。グラフは空間プロパティ以外の任意のプロパティグラフに貼り付けることができます。
- カスタムイージングをモーションプリセットに保存します。