アニメーション

2025-03-13

[Microsoft エージェントは Windows 7 の時点で非推奨となり、以降のバージョンの Windows では使用できない可能性があります。]

キャラクターのアニメーションは、性別、年齢、性格、行動を反映しています。キャラクターに対して作成するアニメーションの数と種類は、キャラクターの動作と、それがさまざまな状況にどのように応答するかによって異なります。

従来のアニメーションと同様に、デジタルアニメーションでは、少し異なる一連の画像を作成し、順番に表示すると、アクションの錯覚を提供します。高品質のアニメーション画像を作成するには熟練したアニメーターが必要な場合がありますが、作成するキャラクターのスタイルとプレゼンテーションも品質に影響します。単純な図形や特徴を持つ 2 次元の文字は、高度にレンダリングされた文字と同じ (またはより効果的な) 場合があります。効果的なキャラクターを描くために現実的なイメージを作成する必要はありません。人気のある漫画キャラクターの多くはプレゼンテーションでは現実的ではありませんが、アニメーターがアクションや感情を伝える方法を理解しているため、効果的です。付録では、アニメーションの基本的な設計原則に関する一般的な情報を提供します。

フレーム

Microsoft エージェント文字用に作成する各アニメーションは、時間指定されたフレームシーケンスで構成されます。アニメーション内の各フレームは、1 つ以上のビットマップイメージで構成されます。画像は、必要に応じて小さくすることも、フレーム自体と同じ大きさにすることもできます。

目の点滅や指の動きなどのアニメーションの詳細は、フレームの追加画像として含めることができます。複数の画像をオーバーレイして複合を作成し、レイヤー内のそれらの位置を変更できます。この手法を使用すると、複数のフレームで画像を再利用し、変更される詳細を変更できます。たとえば、文字の手を振る必要がある場合は、フレームごとに、手以外のすべてを含む基本イメージを使用し、基本イメージを別の手の画像でオーバーレイすることができます。同様に、文字を点滅させる場合は、フレームごとに異なる目のセットを基本イメージの上に重ねることができます。イメージは、基本イメージからオフセットすることもできます。ただし、フレームのサイズ内に存在するイメージの部分のみが表示されます。

アニメーションには、必要な数のフレームを含めることができます。ただし、一般的なアニメーションは約 14 フレームを平均して、6 秒以下で再生します。この緩やかな時間の長さにより、ユーザー入力に対して文字の応答性が確保されます。さらに、フレームの数が多いほど、アニメーションファイルが大きくなります。ダウンロードした Web ベースの文字の場合は、アニメーションファイルのサイズをできるだけ小さくし、文字のアニメーションがぎくしゃくしないように、適切なサイズのフレームセットを提供します。

画像のデザイン

Windows ビットマップ (.BMP) 形式で最終的なイメージを格納する場合は、任意のグラフィックスまたはアニメーションツールを使用してアニメーションフレーム用のイメージを作成できます。イメージが作成されたら、Microsoft エージェント文字エディターを使用して、イメージのアセンブル、シーケンス、時刻の設定、その他の文字情報の提供、すべての情報の最終文字ファイルへのコンパイルを行います。

文字イメージは、256 色のパレットに設計する必要があります。20 の標準の Windows システムカラーは、パレット内の標準の位置 (最初の 10 と最後の 10 の位置) に保持されます。つまり、キャラクターのカラーパレットでは、標準のシステムカラーと最大 236 色の他の色を使用できます。パレットを定義するときに、アニメーションにキャラクターが使用する小道具を含めます。文字のパレットがシステムの色の位置に色を配置すると、Microsoft Agent がパレットを作成するときに、それらの文字の色がシステムの色で上書きされます。

文字のカラーパレットで使用する色の数が多いほど、8 ビット (256) の色設定に構成されたシステムで、キャラクターの色の一部が再マップされる可能性が高くなります。文字が使用されるアプリケーションのパレットの使用も検討してください。文字がホストアプリケーションの色を再マップしないようにすることをお勧めし、その逆も同様です。同様に、同時に表示される複数の文字をサポートする場合は、それらの文字の一貫性のあるパレットを維持する必要があります。 8 ビットのカラー構成を持つユーザーを対象とする場合は、文字に標準のシステムカラーのみを使用することを検討してください。ただし、別のアプリケーションがカラーパレットを広範に再定義する場合、これはキャラクターの色の再マップを妨げる可能性はありません。より高い色解像度に設定されたシステムでは、カラーパレットが自動的に管理されるため、カラーパレットの再マッピングは問題になりません。

画像で色の数を増やすと、アニメーションファイルの全体的なサイズが大きくなる場合もあります。色の数とバリエーションの頻度によって、文字ファイルの圧縮率が決まります。たとえば、少数の色のみを使用する 2 次元文字は、3 次元の網掛け文字よりも圧縮が優れています。

文字ファイル全体に同じカラーパレットを使用する必要があります。異なるアニメーションのパレットを変更することはできません。 8 ビットのカラー構成をサポートする場合は、アプリケーションとサポートする予定の他の文字に同じパレットを使用することを検討してください。

パレットの 11^番目の位置は、既定では透明度 (またはアルファ) の色として定義されますが、Microsoft エージェント文字エディターを使用して色を設定することもできます。 Microsoft Agent アニメーションサービスは、この色のピクセルを透明にレンダリングするため、イメージ内の色は透明度が必要な場所でのみ使用します。

アニメーションのパフォーマンスに影響を与える可能性があるため、キャラクターの形状を慎重に検討してください。アニメーションサービスは、キャラクターを表示するために、画像全体に基づいて領域ウィンドウを作成します。不規則な領域が小さい場合、多くの場合、より多くの領域データが必要になり、キャラクターのアニメーションのパフォーマンスが低下する可能性があります。そのため、可能な場合は、ギャップや単一ピクセルの要素と詳細を避けてください。

文字の外側の端にアンチエイリアスを付けないようにします。アンチエイリアシングはジャグエッジを減らす良い手法ですが、隣接する色に基づいています。キャラクターはさまざまな色の上に表示される場合があるため、外側のエッジをアンチエイリアシングすると、他の背景に対してキャラクターの表示が悪くなる可能性があります。ただし、この問題を発生させることなく、キャラクターの内側の詳細にアンチエイリアスを使用できます。

フレームサイズ

通常、フレームサイズは 128 x 128 ピクセル以下にする必要があります。どちらのディメンションでも文字を大きくまたは小さくできますが、Microsoft Agent Character Editor ではこれを表示サイズとして使用し、大きなフレームサイズを定義した場合は文字イメージを拡大縮小します。 128 x 128 のフレームサイズは、キャラクターが画面上で占有するスペースと妥当なトレードオフを行います。アプリケーションでは、実行時に文字をスケーリングできます。

フレームの期間

Microsoft Agent Character Editor を使用して、アニメーションの各フレームが次のフレームに移動するまでの表示時間を設定できます。各フレームの期間を少なくとも 1000 分の 1 秒 (1 秒あたり 10 フレーム) に設定します。一部のシステムでは、少なくとも 1000 分の 1 のフレームが認識されない可能性があります。期間を長く設定することもできますが、アクションの不自然な一時停止は避けてください。

Microsoft Agent Character Editor では、指定した確率パーセンテージに基づいて、アニメーション内のあるフレームから別のフレームへの分岐もサポートされています。任意のフレームに対して、最大 3 つの異なる分岐を定義できます。分岐を使用すると、再生時に変化するアニメーションとループするアニメーションを作成できます。ただし、分岐を使用する場合は、アニメーションを次々に再生しようとすると問題が発生する可能性があるため、注意が必要です。たとえば、ループまたは分岐アニメーションを再生する場合は、Stop メソッドを使用しない限り、無期限に続行される可能性があります。不明な場合は、分岐を避けてください。

イメージがなく、継続時間が 0 に設定されているフレームは、アニメーションに含まれている場合は表示されません。この機能を使用すると、表示されずに分岐をサポートするフレームを作成できます。ただし、画像がまだないフレームの期間が 0 より大きい場合は、表示されます。そのため、空のフレームをアニメーションに含めないでください。これは、ユーザーが空のフレームをキャラクターが非表示の場合と区別できない可能性があるためです。

フレームの切り替え

アニメーションをデザインするときは、アニメーションとの間をスムーズに切り替える方法を検討してください。たとえば、文字ジェスチャが右に動き、もう 1 つの文字ジェスチャが左に移動するアニメーションを作成する場合、キャラクターをある位置から他方の位置にスムーズにアニメーション化する必要があります。これをアニメーションに組み込む方法はありますが、より適切な解決策は、キャラクターが開始して戻る中立的な位置または遷移的な位置を定義することです。ニュートラル位置へのアニメーション化は、各アニメーションの一部として、または個別のアニメーションとして組み込むことができます。 Microsoft エージェントキャラクターエディタでは、キャラクターのアニメーションごとに補完的なアニメーションを指定できます。戻るアニメーションは、通常、2 ~ 4 フレーム以下にする必要があります。そのため、キャラクターはニュートラルな位置にすばやく切り替えることができます。

たとえば、"gesturing right, then gesturing left" シナリオを使用すると、GestureRight アニメーションを作成し、文字がニュートラルな位置に表示されるフレームから始まり、キャラクターの手を右に伸ばす画像を含むフレームを追加できます。次に、その戻るアニメーションを作成します。これは、キャラクターをニュートラルな位置に戻す画像を含む補完的なアニメーションです。これを、GestureRight アニメーションの Return アニメーションとして割り当てることができます。次に、ニュートラル位置から開始し、キャラクターの腕を左に拡張する GestureLeft アニメーションを作成します。最後に、このアニメーションの補完的な Return アニメーションも作成します。 Return アニメーションは、通常、前のアニメーションの最後の画像に続くイメージで始まります。

アニメーション内で、または Return アニメーションを使用して、同じニュートラル位置に開始して戻ると、任意の順序でアニメーションを再生できます。 Microsoft エージェントアニメーションサービスは、多くの状況で指定された Return アニメーションを自動的に再生します。たとえば、サービスは、キャラクターのアイドリング状態アニメーションを再生する前に、指定された Return アニメーションを再生します。アニメーションがまだニュートラルな位置で終わっていない場合は、Return アニメーションを定義して割り当てることをお勧めします。

特定のアニメーション間で独自の遷移を提供する場合。たとえば、常に適切に定義された順序で再生するため、return アニメーション 定義しないようにすることができます。ただし、ニュートラルな位置からアニメーションのシーケンスを開始して終了することをお勧めします。

話すアニメーション

キャラクターのデザインにアニメーションの口や音声出力の表示がない場合を除き、キャラクターが話せるようにしたいアニメーションごとに口の画像を提供します。一般に、口の動きは非常に重要です。口の動きが音声と合理的に同期されていない場合、キャラクターはあまりインテリジェントで好ましくない、または正直に見える可能性があります。口の画像を使用すると、キャラクターが音声出力にリップ同期できます。マウスイメージは、Windows ビットマップファイルとして個別に定義します。アニメーション内の他のイメージと同じカラーパレットと一致する必要があります。

Microsoft Agent アニメーションサービスは、アニメーションの最後のフレームの上にマウスアニメーションフレームを表示します。これは、アニメーションの 読み上げフレーム とも呼ばれます。たとえば、文字が GestureRight アニメーションで読み上げる場合、アニメーションサービスは、GestureRight の最後のフレームマウスアニメーションフレームをオーバーレイします。キャラクターはアニメーション化中に話すことができないので、アニメーションの最後のフレームにのみ口の画像を提供します。また、スピーキングフレームはアニメーションの終了フレームである必要があるため、キャラクターはループアニメーションでは読み上げられません。

通常、マウスイメージはフレーム (および基本イメージ) と同じサイズで提供しますが、マウスの動きの一部としてアニメーション化する領域のみを含め、残りの画像を透明な色でレンダリングします。上に重ね合わせたときに、読み上げフレーム内の画像と一致するようにイメージを設計します。正しく一致させるには、キャラクターが話すアニメーションごとに個別の口の画像セットを作成する必要がある可能性があります。

口の画像には、顎やキャラクターの体の他の部分など、口自体よりも多くのものを含めることができます。ただし、手や脚を動かすと、表示される口のオーバーレイは、話し言葉の現在の音素に基づいているため、ランダムに移動するように見えることがあることに注意してください。さらに、サーバーは口の画像を読み上げるフレーム画像の輪郭にクリップします。サーバーは基本イメージを使用してキャラクターのウィンドウ境界を作成するため、マウスオーバーレイイメージを基本読み上げフレームイメージのアウトライン内に収まるように設計します。

Microsoft Agent Character Editor を使用すると、次の表に示す一般的な音素の口形に対応する 7 つの基本的な口の位置を定義できます。

マウスアニメーションイメージ

口の位置	サンプル画像	表現
クローズド		通常の口閉じ形状。また、"mom" のように "m"、"bob" のように "b"、"fife" のように "f" などの音素にも使用されます。
オープン幅 1		口は、全幅で、少し開いています。 "gag"、"l"、"l"、"hear" のように "ear" などの音素に使用されます。
オープン幅 2		口は全幅で部分的に開いています。 "修道女" のように "n"、"dad" のように "d"、"tot" のように "t" などの音素に使用されます。
オープン幅 3		口は全幅で開いています。 "hut"、"head"、"your"、"hurt" のように "u" などの音素に使用されます。
オープン幅 4		口は全幅で完全に開いています。 "hat" のように "a"、"how" のように "ow" などの音素に使用されます。
Open-medium		口は半角で開いています。 "ahoy" のように "oy"、"hot" のように "o" などの音素に使用されます。
オープンナロー		口は狭い幅で開いています。 "フープ"、"希望" のように "o"、"ウェット" のように "w" などの音素に使用されます。