2.1 Animation ウィンドウ:機能と設定

Tutorial

·

Beginner

·

+10XP

·

45 mins

·

(49)

Unity Technologies

2.1 Animation ウィンドウ:機能と設定

本チュートリアルでは、Animation ウィンドウの主な機能と設定をコンテキストで確認します。

Languages available:

1. 概要

1.2: 主要なコンセプト:アニメーションデータ」では、アニメーションデータがバインディングや値としてどのように存在するかについて触れました。

このチュートリアルでは、以下のことを学びます:

  • Animation ウィンドウでバインディングと値がどのように表現されるかを理解を深めます。
  • Animation ウィンドウでアニメーションクリップを表示するための基本的な方法について詳しく見ていきます。

2. はじめる前に

このチュートリアルでは、3D アニメーションシステム入門Unity プロジェクトを使用します。まだダウンロードしていない場合は、先にダウンロードしておきます。

プロジェクトのダウンロードが完了したら:

1. Unity エディターでプロジェクトを開きます。

2. Project ウィンドウで、Assets > 2.1 Animation Window Features and Settings の順に進みます。

このチュートリアルに必要なアセットはすべてこのフォルダーにあります。

3. アニメーションクリップのデータの振り返り

アニメーションクリップに保存されているアニメーションデータは、バインディングと値の 2 つの部分で構成されています。

このチュートリアルを始める前に、このデータに関する重要な情報をざっと振り返りましょう:

  • バインディングは、アニメーションの再生中にゲームオブジェクトをやコンポーネントのどのフィールドを変更するかを示します。
  • 値は、ある時点でフィールドが何に変更されるべきかを示します。通常、これらの値は、時間の経過とともに変化し、曲線として表現される float(小数値)です。
  • Animation ウィンドウ(これは Animator ウィンドウとは異なります)には、アニメーションクリップに関連付けられたバインディングと値が表示されます。
  • Animation ウィンドウを使用して、アニメーションクリップのバインディングと値の両方を編集することができます。

4. アニメーションの例を見てみよう

まず、Core Concepts チュートリアルにある円形と四角形の例とは少し異なるアニメーションの例を見てみましょう。

このチュートリアルでは、街灯のアニメーションについて詳しく見ていきましょう。


このアニメーションを開くには:

1. Project ウィンドウで、Assets > 2.1 - Animation Window Features and Settings > Scenes の順に進み、StreetLampExample シーンをダブルクリックして開きます。

2. 再生ボタンを押して再生モードに入り、アニメーションが動作することを確認してください。街灯が点滅しているのが見えるはずです。

3. もう一度再生ボタンを押して再生モードを終了します。

4. Project ウィンドウで、2.1 - Animation Window Features and Settings > AnimationClips に順に進み、LightFlicker アニメーションクリップをダブルクリックして Animation ウィンドウで開きます。

このアニメーションクリップは、Light コンポーネントの Intensity フィールドを変更する単一のバインディング値のペアを持っています。

5. Animation ウィンドウが Curves モードに設定されていることを確認して、値の編集を開始したときに変更がより明確にわかるようにしてください。

3a61d980-075c-400a-b586-6509cde7a75a_image7.png

5. インポートしたアニメーションクリップの編集

StreetLamp アニメーション用のアニメーションクリップはUnity で直接作成したものですが、他のソフトで作成したアニメーションクリップを使ってモデルをインポートすることもできます。モデルの一部としてインポートされたアニメーションクリップは読み込み専用で、編集することはできません。

モデルの一部としてインポートされたアニメーションクリップを編集したい場合は、アニメーションクリップアセットを複製して、この新しいアニメーションクリップを編集することができます。複製されたアニメーションクリップはモデルに関連付けられていないため、モデルのインポート設定を変更しても変更されません。

インポートした HumanoidCrouch モデルのアニメーションクリップを複製して編集してみましょう:

1. Project ウィンドウで、Assets > 2.1 - Animation Window Features and Settings > AnimationClips フォルダーの順に移動し、HumanoidCrouch モデルを選択します。

2. HumanoidCrouch モデルアイコンの左にある折りたたみ矢印をクリックすると、サブアセットが表示されます。このモデルの下には、いくつかのアニメーションクリップが入れ子になっています。

0b8708cc-50d4-49f8-a1e4-faf51ae9620b_image9.png


3.
SelectAnimation ウィンドウでアニメーションクリップを選択して表示します。

3e7c47aa-1780-4772-980d-bb955f55d269_image15.png


4. Ctrl + D
(Windows) または Cmd + D (MacOS) を押して、アニメーションクリップを複製します。

新しいアニメーションクリップのプロパティを編集できるようになりましたが、HumanoidCrouch モデルに関連付けられていないことを覚えておいてください。

読み取り専用のアニメーションクリップを表示する

Unity では、読み取り専用のプロパティを非表示にすることができます。これらのプロパティを非表示または公開するには:


1.
Animation ウィンドウで、タイムラインの横にあるコンテキストメニューを選択します(隣接する 2 つのコンテキストメニューのうち、下の方)。

672926bf-82de-4db9-a4d0-9f6c71f3e3b2_image17.png


2. Show Read-only Properties
の表示を有効または無効にして、読み取り専用のプロパティを表示または非表示にします。

6. アニメーション クリップのコンテキスト

Animation ウィンドウでアニメーションクリップを表示するには、アセットとして表示する方法とコンテキストとして表示する方法の 2 つの方法があります。選択した方法は、アニメーションクリップの編集方法に影響を与えます。

アニメーションクリップをアセットとして表示

アニメーションクリップをアセットとして表示すると、Animation ウィンドウには再生に使用されるゲームオブジェクトのコンテキストが表示されません。これは、Unity が追加可能なフィールドを認識していないため、アニメーションクリップにアニメーションカーブを追加することができないことを意味します。

アニメーションクリップをアセットとして表示するには:

  • Project ウィンドウでアニメーションクリップを選択して開きます。

アニメーションクリップをコンテキストで表示

ゲームオブジェクトの階層でアニメーションクリップを表示すると、Animation ウィンドウにはコンテキストが表示されます。つまり、Animation Curves を追加することができます。

アニメーションクリップをコンテキストで表示するには:

  • Hierarchy で、アニメーションクリップを含むアニメーターコントローラーを持つゲームオブジェクトを選択します。アニメーターコントローラーが参照しているクリップが Animation ウィンドウで利用できるようになり、コンテキストを必要とする設定にアクセスできるようになります。

このコンテキストの考え方は、Animation ウィンドウの機能にも影響を与えます。例えば、コンテキストなしではアニメーションクリップをプレビューすることはできません。

Animation ウィンドウのさまざまな機能、設定、ツールに触れながら、コンテキストが各要素にどのように影響するかを学びます。

7. アニメーションクリップのコンテキスト 街灯の例

StreetLamp(街灯)の例を使って、Unity エディターでコンテキストの概念を詳しく見てみましょう。

LightFlicker をアセットとして表示する

LightFlicker アニメーションクリップをアセットとして表示するには:

  • Project ウィンドウで、Assets > 2.1 - Animation Window Features and Settings > AnimationClips に移動し、LightFlicker アニメーションクリップを選択して Animation ウィンドウで開きます。

Add Property ボタンが無効になっているので、既存のアニメーションカーブを編集することができません。これは、ゲームオブジェクトのコンテキストなしでアニメーションクリップを表示しているためです。

adcdc6df-eace-436c-bee8-75ea51e5e155_image4.png

LightFlicker をコンテキストで見る

ゲームオブジェクトのコンテキストで LightFlicker アニメーションクリップを表示するには:

  • Hierarchy で、StreetLamp ゲームオブジェクトを選択します。Animation ウィンドウに LightFlicker アニメーションクリップが表示されます。

アニメーションクリップを編集したい場合、ゲームオブジェクトのプロパティにアクセスできるようになりました。これは、Animation ウィンドウがアニメーションクリップのコンテキストを検出したためです。これでプロパティの Add Property ボタンが有効になりました。

7da7d460-33ad-46bb-8fbf-875eecfa52b2_image3.png

アニメーションクリップの編集については、次のチュートリアルで詳しく説明します。

8. Animation ウィンドウのモードを確認

Animation ウィンドウでアニメーションクリップを開いたり編集したりする方法を学んだところで、Animation ウィンドウの機能をより詳しく見てみましょう。

Animation ウィンドウの概要

アニメーションクリップは、値とバインディングの 2 つの部分で構成されています。Animation ウィンドウは主に 2 つのエリアに分かれていて、左側にバインディング、右側に値となり、それぞれのアニメーションクリップの各パートに対応しています。

00dce965-5546-4f46-8862-a43973476950_image1.png

キーフレーム

アニメーションクリップの各バインディングには、対応する値を構成するキーフレームのコレクションがあります。これらのキーフレームには、特定の時間におけるアニメーションカーブの値や、その間の値の補間方法などの情報が含まれています。

ドープシートとカーブモード

アニメーションクリップの値は、Animation ウィンドウで 2 つの異なるモードで見ることができます。Dopesheet (ドープシート) モードと Curves (カーブ) モードです。

ドープシートモードは、キーフレームのみが表示される凝縮されたビューです。このビューは、キーフレームがどのようにレイアウトされているかを見たい場合や、キーフレームが float 値ではなくオブジェクト参照を表している場合に便利です。これは、キーフレームごとに異なるスプライトが入れ替わる 2D アニメーションでよく見られます。

カーブモードでは、すべてのバインディングまたは選択されたバインディングのキーフレーム値とその補間を表示します。

このコースでは、Unity の 3D アニメーションシステムに焦点を当てていますが、内容の大部分は Unity の 2D アニメーションにも適用されます。ただし、このコースでは、Sprite アニメーションに使用される Object Reference(オブジェクト参照)のカーブは扱いません。

モードの変更

ここまでのチュートリアルでは、アニメーションクリップをカーブモードで表示していました。Animation ウィンドウをドープシート (Dopesheet) モードに変更してみましょう:


1.
Animation ウィンドウの左下にある Dopesheet タブを選択して、Dopesheet モードに切り替えます。

b7d19ff4-aafb-4cb3-aff4-58dce29004f7_image23.png

このモードは Curves モードよりもずっと凝縮されていて、このチュートリアルで必要とするアニメーションについての詳細が一切示されていないことに気づくでしょう。


2. Curves
タブを選択すると、Curves モードに戻ります。

速度を変更する

ドープシートモードでもカーブモードでも、Animation ウィンドウの上部には常にタイムラインが表示されています。このタイムラインには、秒:フレームの表示形式で時間が表示されています。例えば、1:15 はアニメーションクリップの開始から 15 フレームと 1 秒を意味します。

アニメーションの速度を変更するには、1 秒あたりのフレーム数を変更することができます。これを行うには:

1. タイムラインの横にあるコンテキストメニューで、Frames を選択します。

151645b8-1c94-49ba-8f91-a545fa02b0d9_image19.png


2.
もう一度同じコンテキストメニューを開き、Show Sample Rate を選択します。


3.
その後、Animation ウィンドウで手動でフレーム数を設定することができます。

b01e5a28-081e-47ad-bee2-de95cf47ee8a_image16.png


または、コンテキストメニューを使用して Set Sample Rate を選択し、利用可能なオプションの 1 つを選択して速度を変更することもできます。

9. Animation ウィンドウのツールバーを見直す

Animation ウィンドウの左側、バインディングの上には、アニメーションクリップのデータを表示したり編集したりするのに役立つボタンや設定がいくつかあります。

fc2c0e18-38e5-4260-aa7e-8d152d88fca8_image13.png

アニメーションクリップをアセットとして表示している場合、これらのボタンの一部は無効になっています。Hierarchy で該当するゲームオブジェクトを選択すると、アニメーションクリップをコンテキストで表示し、これらすべてのツールにアクセスできます。

Preview モード

最初のボタンは Preview ボタンです。Preview モードでは、タイムラインとプレビューされているインスペクターのプロパティの両方が青色で表示されます。

b371b1a9-f43e-4f02-8243-fd86e3df37f7_image22.png

このモードを有効にすると、アニメーションクリップの値が一時的にゲームオブジェクトに設定され、どのように見えるかをプレビューすることができます。つまり、アニメーションクリップがアセットとして表示されている場合は、この設定は使用できません。

また、カーブ表示の上のタイムラインをクリックしてドラッグすると Preview モードになります。

レコードモード

アニメーションウィンドウのツールバーの次のボタンは、Record(レコード)ボタンです。レコードモードにすると、タイムラインとプレビュー中のインスペクターのプロパティの両方が赤色に表示されます。

5a1ece37-7220-409e-b286-0665b5fd371b_image12.png

Preview モードと同様に、レコードモードを有効にすると、アニメーションクリップの値が一時的にゲームオブジェクトに設定されます。重要な違いは、このモードを有効にしている間に行ったプロパティの変更がアニメーションクリップに記録されることです。

このモードで変更して保存できる内容には、以下のようなものがあります:

  • アニメーションクリップへの新しいバインディングの追加
  • アニメーションカーブへのキーフレームの追加
  • キーフレームの値を設定

つまり、ゲームオブジェクトのプロパティを変更することができ、新しい値、バインディング、キーフレームはアニメーションクリップに記録されます。

タイムライン再生ヘッド

タイムライン再生ヘッドは、プレビューされているタイムライン上の正確なポイントを示しています。

cf75dc04-22ee-4cd9-8717-64ee1d2c87d7_image18.png


ツールバーの以下の 5 つのボタンは、タイムライン再生ヘッドの位置を設定するためのものです。

プレイボタン

ここでプレイボタンを使用できるのは、アニメーションクリップをコンテキストで表示している場合のみです。このボタンを押すと:

  1. Preview モードが有効になります。
  2. 再生ヘッドの現在時刻からアニメーションの再生が開始されます。
  3. Scene ビューでアニメーションを見ることができるようになります。

最初、前、次、最後のボタン

プレイの両側にあるボタンは、アニメーションクリップをアセットとして表示している場合でも、コンテキストとして表示している場合でも使用できます。これらのボタンを使用して、キーフレーム間で再生ヘッドを動かすことができます。これらのボタンは、再生ヘッドをそれぞれ最初、前、次、最後のキーフレームに移動します。

2059823e-5062-4bfc-894b-9f160369e262_image6.png

現在のフレーム

最後の 5 つのボタンの右側には、再生ヘッドの位置を設定するためにも使用できる数値フィールドがあります。この数字は現在のフレームの位置を表しています。この数字を変えると再生ヘッドの位置が変わります。

22eb3178-b7b8-4559-ab27-223232062b26_image21.png

アニメーションクリップがコンテキストで表示されているときに、再生ヘッドの位置ボタンのいずれかを選択したり、数値フィールドを変更したりすると、Preview モードが有効になります。

10. アニメーションクリップの選択と作成

Animation ウィンドウの設定とボタンの 2 列目には、現在表示しているアニメーションクリップの名前が表示されています。

fda3ab66-9a0a-4e50-bdb0-e1634242ed72_image11.png

アニメーションクリップをコンテキストで表示しているときに、別のアニメーションクリップを選択したり、新しいアニメーションクリップを作成したりするには、以下の手順に従います:

1. Animation ウィンドウで、アニメーションクリップ名を選択してドロップダウン選択メニューを開きます。


2.
アニメーターコントローラーで現在使用されているアニメーションクリップを選択するか、Create New Animation Clip を選択して新規アニメーションクリップを作成します。

99348067-460f-4513-96b2-3f17387ae2e0_image14.png


新規アニメーションクリップを作成すると、現在使用しているアニメーターコントローラーに自動的に追加され、現在のゲームオブジェクトのコンテキストに配置されます。

11. アニメーションクリップのアニメーションカーブのフィルタリング

原則として、複雑なアニメーションクリップであればあるほど、アニメーションカーブの数は多くなります。アニメーションクリップの中にたくさんのアニメーションカーブがある場合、どのアニメーションカーブを見るかをフィルタリングできると便利です。

選択したゲームオブジェクトに関連付けられたアニメーションカーブのみを表示するようにフィルタリングするには:

1. Hierarchy で、関連するアニメーションカーブを表示したいゲームオブジェクト(またはその子)を選択します。

2. Animation ウィンドウで、Filter by selection をクリックします(アニメーションクリップ名の右側)。

dfa36069-8cbe-428e-87f5-f37d24f9404b_image5.png


例えば

キャラクターアニメーションを見ているが、特に手のアニメーションに注目したい場合にこのフィルター機能を使用することができます。手の Transforms に関連するアニメーションカーブだけを表示するには、以下のようにします:

1. Hierarchy で、hand の子ゲームオブジェクトを選択します。

2. Animation ウィンドウで、Filter by selection ボタンをクリックします。

12. キーフレームとアニメーションイベントの追加

最後の 2 つのボタンでは、キーフレームとアニメーションイベントを追加します。

9d403922-3988-490e-ae4f-85cdf429cf7d_image20.png

Add keyframe ボタン

Add keyframe ボタンは、再生ヘッドの現在の時刻に選択されているすべてのアニメーションカーブにキーフレームを追加します。アニメーションカーブを選択していない状態で Add keyframe をクリックすると、選択したゲームオブジェクトに関連付けられたすべてのアニメーションカーブにキーフレームが追加されます。

Add event ボタン

Add event ボタンは、新しいアニメーションイベントを追加します。アニメーションクリップをアセットとして表示している場合でも、コンテキストとして表示している場合でも動作しますが、アニメーションイベントの設定方法に影響します。 アニメーションイベントについては、2.7: Creating and configuring Animation Events で詳しく説明します。 .

13. まとめ

このチュートリアルでは、Animation ウィンドウのさまざまな機能について詳しく触れました。以下のことを学びました:

  • インポートしたアニメーションクリップを複製して編集することができる
  • アニメーションクリップをアセットとして、またはコンテキストとして表示する際に、アニメーションウィンドウで利用できるさまざまな機能
  • ドープシートとカーブモードの違い

アニメーションウィンドウの各ボタンもおさらいしましたね。

このコースでは、いくつかの機能について詳しく説明しますが、この概要は Animation ウィンドウを自信を持って使えるようにするためのものです。これは、この学習プロジェクトで行う他のチュートリアルの基礎となります。

次のチュートリアルでは、Unity エディターでアニメーションクリップを作成して編集します。

Complete this tutorial