グラフィックフィルター

フィルターの概要

フィルター（グラフィックエフェクト）を使用すると、テキスト、ボタン、およびムービークリップに質の高い視覚効果を追加できます。Animate に固有の機能として、モーショントゥイーンを使って、適用するフィルターをアニメーション化することができます。

Animate ブレンドモードを使用すると、複合イメージを作成できます。「複合」とは、複数の重なるオブジェクトの透明度またはカラーインタラクションを変化させるプロセスです。ブレンドモードでは、オブジェクトとイメージの透明度に関する制御も可能になります。Animate ブレンドモードを使用することで、ハイライトやシャドウの下にあるイメージの詳細が透けて見えるようにすることや、彩度の低いイメージの彩度を上げることができます。

アニメーションフィルターについて

タイムラインでフィルターをアニメーション化できます。トゥイーンによって結合された個々のキーフレーム上のオブジェクトは、中間フレーム上でトゥイーンされた、対応するフィルターのパラメーターを持ちます。一方のフィルターに対応する同じタイプのフィルターがトゥイーンの反対側にない場合は、一致するフィルターが自動的に追加され、アニメーションシーケンスの最後にもエフェクトが適用されるようになります。

トゥイーンの一方の端にフィルターがないことや、フィルターの適用順序が異なることに起因するモーショントゥイーンの誤動作を防ぐために、Animate によって次の処理が行われます。

• フィルターが適用されたムービークリップにモーショントゥイーンを適用する場合、トゥイーンの反対側にキーフレームを挿入すると、ムービークリップの最後のフレームには、トゥイーンの開始フレームと同じフィルターが同じ重ね順で自動的に適用されます。

• 異なるフィルターが適用された 2 つの異なるフレームにムービークリップを配置し、フレーム間にモーショントゥイーンを適用する場合、最も多くのフィルターを持つムービークリップが Animate によって最初に処理されます。次に Animate では、最初のムービークリップに適用されたフィルターが 2 番目のムービークリップに適用されたフィルターと比較されます。一致するフィルターが 2 番目のムービークリップに見つからない場合、パラメーターのない、既存のフィルターのカラーを持つ「ダミー」のフィルターが Animate によって生成されます。

• 2 つのキーフレーム間にモーショントゥイーンがある場合、一方のキーフレームでオブジェクトにフィルターを追加すると、トゥイーンの反対側のキーフレームに達したときに、Animate によってムービークリップに自動的にダミーフィルターが追加されます。

• 2 つのキーフレーム間にモーショントゥイーンがある場合、一方のキーフレームでオブジェクトからフィルターを削除すると、トゥイーンの反対側のキーフレームに達したときに、対応するフィルターが Animate によってムービークリップから自動的に削除されます。

• モーショントゥイーンの最初と最後のフレーム間でフィルターパラメーターが一致せずに設定されている場合、最初のフレームに適用されたフィルター設定が Animate によって補間フレームに適用されます。「ノックアウト」、「シャドウ（内側）」、「光彩（内側）」、および「グラデーション光彩」と「グラデーションベベル」のタイプの設定がトゥイーンの最初と最後で異なっていると、一貫性の問題が発生します。

  例えば、ドロップシャドウフィルターを使ってモーショントゥイーンを作成し、トゥイーンの最初のフレームにノックアウトのあるドロップシャドウが適用され、最後のフレームにシャドウ（内側）が適用されていると、モーショントゥイーン内でフィルターの使用法に一貫性がないため、Animate によって設定が修正されます。この場合、Animate によってトゥイーンの最初のフレームで使用されたフィルター設定（ノックアウトのあるドロップシャドウ）が適用されます。

フィルターと Flash Player のパフォーマンスについて

オブジェクトに適用するフィルターのタイプ、数および品質は、再生時に SWF ファイルのパフォーマンスに影響を与えます。オブジェクトに適用するフィルターの数が多いほど、作成した視覚効果を正しく表示するために Adobe® Flash® Player で必要となる計算処理の回数が増えます。Adobe® では、1 つのオブジェクトに適用するフィルターの数が多くなりすぎないようにすることをお勧めしています。

各フィルターには、適用されたフィルターの強さと品質を調整できるコントロールが含まれています。低い設定を使用すると、処理速度の遅いコンピューターでもパフォーマンスが向上します。様々なコンピューターで再生するためのコンテンツを作成する場合や、ユーザーが使用できるコンピューターの処理能力がわからない場合は、再生のパフォーマンスを最大化するために、品質レベルを「低」に設定します。

Pixel Bender フィルターについて

Adobe Pixel Bender™ は Adobe によって開発されたプログラミング言語で、これにより Animate および After Effects で使用するフィルター、効果、ブレンドモードをカスタマイズすることができます。Pixel Bender は独立したハードウェアで、様々な GPU および CPU アーキテクチャで自動的に効率よく実行できるようになっています。

Pixel Bender 開発者は、ファイル拡張子 pbj を持つテキストファイルに Pixel Bender コードを記述して、そのコードを保存してフィルターを作成します。書き込まれると、Pixel Bender フィルターはどの Animate ドキュメントでも使用できるようになります。ActionScript® 3.0 では、フィルターを読み込んでそのコントロールを使用することができます。

ActionScript でのピクセルベンダーの操作について詳しくは、『ActionScript 3.0 開発ガイド』を参照してください。

次のビデオチュートリアルは、Animate でのピクセルベンダーフィルターの使用方法を解説しています。

フィルターの操作

Animate の拡張機能

オブジェクトに新しいフィルターを追加するたびに、プロパティインスペクターでそのオブジェクトに適用されたフィルターのリストにフィルターが追加されます。1 つのオブジェクトに複数のフィルターを適用することも、以前に適用したフィルターを削除することもできます。テキスト、ボタン、ムービークリップ、コンポーネントおよびコンパイルされたクリップオブジェクトに対してのみフィルターを適用できます。

フィルター設定ライブラリを作成すると、同じフィルターまたはフィルターのセットをオブジェクトに対して簡単に適用できます。Animate では、フィルター／プリセットメニューのプロパティインスペクターの「フィルター」セクションに作成したフィルタープリセットが保存されます。

Flash Professional CS6 および以前のバージョンでは、フィルターの適用先は、ムービークリップシンボルとボタンシンボルのみに制限されていました。Animate では、コンパイルされたクリップとムービークリップコンポーネントにもフィルターを適用できるようになりました。これにより、1 つ（または 2 つ）のボタンをクリックすることで、コンポーネントに様々なエフェクトを直接追加して、アプリケーションの概観をさらに改善できます。Flash CS6 では、コンポーネントにフィルターまたは他のエフェクトを追加するために、ムービークリップシンボル内にフィルターやエフェクトを「ラップ」する必要がありました。具体的には以下のとおりです。

1. ステージ上にコンポーネントを作成または追加します。
2. コンポーネントを右クリックし、「シンボルに変換」を選択します。
   

CS6（および以前のバージョン）では、シンボル内にコンポーネントをラップした後で、フィルターや様々な種類のエフェクトを追加できました。ただし、これは 1 つの回避策にすぎず、推奨されるベストプラクティスではありません。Animate では、プロパティパネルで使用できる「フィルター」、「カラー効果」および「表示設定」の各オプションを直接使用して、コンポーネントに様々なフィルターを追加できます。この重要な機能強化をより深く理解するために、ボタンコンポーネントへのベベルフィルターの追加の例を検討します。

1. コンポーネントパネルからステージ上にボタンを作成または追加した後で、ボタンを選択します。
2. プロパティパネルで、「フィルター」セクションにあるドロップダウンリストの ボタンをクリックし、ベベルフィルターを選択します。ベベルフィルターのプロパティと値が表示されます。
3. 必要なプロパティの値を変更、または適切な値を設定します。例えば、「ぼかし - 水平」、「ぼかし - 垂直」「強度」、「シャドウ」などです。値の設定と同時に、選択したボタンにエフェクトが反映されるのを確認できます。
   

フィルターの適用または削除

フィルターのコピーとペースト

オブジェクトへのプリセットフィルターの適用

 オブジェクトにフィルタープリセットを適用すると、選択したオブジェクトに現在適用されているフィルターが、プリセットで使用されているフィルターに置き換えられます。

オブジェクトに適用されたフィルターを有効または無効にするには

オブジェクトに適用されたすべてのフィルターを有効または無効にするには

プリセットフィルターライブラリの作成

フィルター設定を、ムービークリップやテキストオブジェクトに簡単に適用できる既定のライブラリとして保存します。他のユーザーにフィルター設定を配布して、プリセットフィルターを共有します。フィルター設定ファイルは、次の場所にある Animate の Configuration フォルダーに保存されている XML ファイルです。

 

• Windows および Windows 8 の場合：C:\Users\username\AppData\Local\Adobe\Flash CC\language\Configuration
• （Flash Professional CS6 および以前のバージョンのみ）Windows XP：C:\Documents and Settings\username\Local Settings\Application Data\Adobe\Flash CS6\language\Configuration\Filters\filtername.xml
• （Flash Professional CS6 おおび以前のバージョンのみ）Windows Vista：C:\Users\username\Local Settings\Application Data\Adobe\Flash CS6\language\Configuration\Filters\filtername.xml
• Macintosh：Macintosh HD/Users/username/Library/Application Support/Adobe/Flash CC/language/Configuration/Filters/filtername.xml

既定の設定でのフィルターライブラリの作成

プリセットフィルターの名前の変更

フィルタープリセットの削除

フィルターの適用

ドロップシャドウの適用

「ドロップシャドウ」フィルターは、面に影を落とすオブジェクトの外観をシミュレートします。

クラシックトゥイーンのあるドロップシャドウの使用例については、Animate サンプルページ（www.adobe.com/go/learn_fl_samples_jp）を参照してください。サンプル zip ファイルをダウンロードして解凍し、Graphics¥AnimatedDropShadow ディレクトリに移動します。

傾斜したドロップシャドウの作成

ぼかしの適用

「ぼかし」フィルターを適用すると、オブジェクトのエッジと細部が滑らかになります。オブジェクトにぼかしを適用すると、そのオブジェクトが他のオブジェクトの背後にあるように見せたり、オブジェクトが動いているように見せることができます。

光彩の適用

「光彩」フィルターを使用すると、オブジェクトのエッジの周囲全体にカラーを適用できます。

ベベルの適用

ベベルを適用すると、オブジェクトにハイライトを適用し、背景上で曲げられたように見せることができます。

グラデーション光彩の適用

グラデーション光彩を適用すると、光彩の面全体にグラデーションカラーの光彩の外観を作成できます。グラデーション光彩では、アルファ値 0 を持つ 1 つのカラーをグラデーションの先頭に指定する必要があります。このカラーの位置は移動できませんが、カラーを変更することはできます。

グラデーションベベルの適用

グラデーションベベルを適用すると、背景の上にオブジェクトが持ち上げられたように見せて、ベベルの面全体にグラデーションカラーを表示できます。グラデーションベベルでは、アルファ値 0 を持つ 1 つのカラーをグラデーションの中央に指定する必要があります。

カラー調整フィルターの適用

カラー調整フィルターで、選択したオブジェクトのコントラスト、明度、彩度、色相などのカラー属性をより細かく制御できます。