こんにちは!楽じい(“@rakujii7“)です。

今回は、パペットの動く方向に合わせて表示を切り替えてくれるモーショントリガーをご紹介します。

このビヘイビアーを適用すると動きながら軌跡も描いてくれます。マウスで操作しますが、高速で動かしたいキャラクターには向いていますね!

照れる楽じい

大空を飛び回る鳥を表現してみました。ボタンインコのつもりですが、見えるかな?

スポンサーリンク

【Character Animator】動きの方向に基づいてアートワークを表示(モーショントリガー)

フォルダーの階層構造

はじめに、Character Animatorでお決まりのフォルダーの階層構造からです。

モーショントリガーは、親パペット(+ボタンインコ.F)の動く方向に合わせてグループ間を切り替えます。

切り替えるグループ(モーショントリガー)の中には、方向を指定できる5つのグループを作りました。

5つのグループの中には、さらに [>Head][>Body]と細かく分けることもできます。

以前紹介したヘッドターナーのフォルダー構造と考え方は同じですね。「正面だけのパペット×5」のビューを作成することになります。

もちろん、左右の移動だけでいいと言うのなら2つビューでOKです。

ちなみに、Character Animatorでは6っまでのビューを指定することができます。

  • 静止
  • 右に移動
  • 左に移動
  • 上に移動
  • 下に移動
  • トランジション中

ビヘイビアーの追加とタグ付け

次に、モーショントリガーを有効にする為のビヘイビアーの追加とタグ付けです。

こちらもCharacter Animator お決まりの作業手順となりますが、追加するフォルダーの選択などは確認しながら行わないと動作しないので注意です。

親パペットを動かすタグ

まず、親パペットをマウスで動かせるようにタグを付けます。

パペットパネルで、(+ボタンインコ.F)と名付けた親パペットを選択して、右側のプロパティーパネルの「ドラッグ可能」をクリックすればパペットを動かすタグ付けは完了です。

これでマウスのドラッグでスクリーン上を自由に動き回ります。

表示を切り替えるタグ

次に、ドラッグで動かす方向に合わせて表示を切り替えるタグを付けます。

今回は5つのビューを作成したので、それぞれプロパティーパネルで指定します。

こちらも「上へ移動」のグループならモーショントリガーも「上に移動」です。パペットパネルにもタグ名が表示されていればOKです。

モーショントリガーを追加

それぞれのビューにタグが付いたので、モーショントリガーを追加します。

追加する場所は、5つのビューが収まっているフォルダーです。分かりやすいように [>モーショントリガー] としました。

これで、ドラッグした方向にビューが切り替わるようになります。

パラメーターの調整

最後に、パラメターの調整です。

速度しきい値は、表示が切り替わる為に必要なマウスの速度です。(1 フレームあたりのピクセル数でコントロール)

設定したしきい値より遅い速度では、切り替わらず基本姿勢が表示されます。つまり数値を上げるほど早く動かさないと切り替わらない

最短期間は、マウスの方向を変えた時に切り替わるビューの最小フレーム数をコントロールします。数値を上げるほど切り替えが遅くなります

照れる楽じい

パラメータを変えて試して見ましたが、結局「デフォルトのままでいい」ということに落ち着きました。参考まで・・・

data-matched-content-ui-type="image_card_stacked"