こんにちは。DECA GEARはホントに出るんでしょうか。
Najikoです。
Table of Contents
前書き
今日はついに、というかいマサラタウン感があるんですけれども物の出し入れについてやっていきます。結構、最初認識していた知識に誤りがあったりしたので特にレイヤー周りの構造は一応の正解をはっきりさせられたらな、と思います。物の出し入れの設定とは要するに、VRC内で例えば普段何も持ってないアバターの手にアイテムを持たせたり消したりする、といった設定をUnity上で行うということです。これができると改変の幅が大きく広がる他、アニメーションの性質の理解に向けて一歩前進できます。
小物の用意
さて、前回の記事で尻尾に謎のsit判定を仕込んだこんちゃんを引き続き利用していきたいと思います。今回はこんちゃんの手に看板を持たせることを目的としてやっていきましょう。
今回使用した素材はこちら。
https://booth.pm/ja/items/1085365
そして、看板に掲げる文字はこちら。
これは何かと言いますとですね、一緒に写真を撮りたい人がいる時にこれを出すわけです。特に、VRChatでは思いがけず有名な方（イベントの主催や有名ワールドの作者の方など）とお目見えする機会があったりするのですが、話をさえぎって「写真撮らせてくれー！！」とアピールするのも恐縮なので、スッとこれが書いたパネルを出すと目に入った時に大体応じていただけます。無言勢のわたくしには重宝するアイテムです。
早速、こんちゃんのプロジェクトに看板と上の画像を貼ったテクスチャをインポートしました。そして立て看板をこんちゃんのいるScene上にドラッグアンドドロップすると……
はい。バカでかい看板が登場しました。右上に「Scale」とある部分を見て下さい。現在は1/1サイズなわけですが、これをXYZそれぞれの方向に対して0.3に設定すると、
まあ、いい感じの大きさになった気がしますね。それでは、次にテクスチャを看板に設定するためマテリアルを作成します。Project上で右クリックして、Create→Materialと進みます。
こうしてNew Materialができたら、次にInspector上の上の方のShaderタブをクリックしてシェーダーを選択します。
今回、上の画像のようにUnlit Textureを選択しました。Unlitはワールドの光源の影響を受けずに描写されるためお出しした看板が真っ暗、または眩しすぎて全然見えない、といったことがなくなります。
今度はMaterialにテクスチャ画像を設定します。上のAlbedoと書いたところをクリックして画像を選択します。すぐ隣にある看板のテクスチャ画像を設定します。
次にHierarchyの立て看板を展開して、ボードと柱のそれぞれのメッシュ（ガワのこと）にMaterialを設定していきます。Mesh Rendererのすぐ下のMaterialと書いた▼を展開して出します（最初はたたまれています）ここのElement 0と書いたところに、標準では「看板」というこの3Dモデル標準のマテリアルが割り当てられていますが、ここに先ほど作ったMaterialをproject上からドラッグアンドドロップしてみます。
するとこのように、Secene上の看板にもしっかりテクスチャが反映されているのが見えますね。
柱の方も同様に行います。本来、メッシュが別々ならMaterialも別々のものを使用することもできますが、今回は1つのテクスチャにボードと柱両方の分が描写されているので、同一のMaterialを設定すればOKです。
小物の設置
一旦Hierarchyの看板の階層を閉じて、画像のように親の階層を選択した状態にしてからScene上の矢印を引っ張って看板をこんちゃんの手のところに持っていきます（先ほどMaterialを設定したメッシュの方を選択したまま動かしてしまうと面倒なことになります）。もし矢印以外になっている場合はHierarchyの上にあるいくつかのボタンの内左から2番目にある、矢印が十字に交差しているボタンを押せば矢印が出ます。そして……
さらにRotationをいじって看板を回転させます。真横から見るとこんな感じで、表面が下になるようにすると出した時に正しい方向になります。先ほど説明したボタンの内リサイクルマークみたいなやつは回転を表しており、これを押すと手動でモデルを回転させることが出来るようになります。またScene右上の四角い立方体をクリックするとパースのオン、オフ、また立方体から出ている円錐をクリックすると真横や真上からの視点に切り替えることが出来るのでうまいこと調整してください。
真上から見るとこんな感じ。看板が手から離れていないかなどよくチェックしましょう。
次にHierarchy上の看板の親オブジェクトを選択して右クリックし、Unpack Prefab Completelyを行います。これは何、と言われると説明が大変なんですけど、これをやらないとオブジェクトがHierarchy上で自由に階層を移動できなくなります。看板を入れる先のこんちゃんも同様にUnpackしておきます（画像ではすでに行われています）。
今度はこんちゃんの階層を展開してArmature内のHips→Spine→Chest→shoulder.R→upper_arm.R→lower_arm.R→hand.R
と階層を辿っていき、このhand.Rに先ほどの立て看板をドラッグアンドドロップします。
はい。無事階層移動が出来ました。これで看板はこんちゃんの一部となります。このままアップロードすると常にこの看板を手に持ったこんちゃんになります。例えば帽子をかぶせたりする場合はこれと同じ方法で、位置を合わせた後Headのところにでも入れておけば常に帽子をかぶったこんちゃんがアップロードできます。今回は出し入れまでできるようにするのでまだ終わりではありません。それと、看板のTransformに設定されている値がえらいことになってるのが見えると思いますが、あれはアバター内に存在している場合の値を計算しているようで、こうなると微調整はかなり面倒になるので、サイズなどをいじり直したい時は一旦入れた小物をアバターの階層の外に出せば数値が直るので、その状態で数値を調整して再度アバター内の階層に入れるようにするといいでしょう。調整が終わったら、一旦右上の「立て看板」と書いた左横のチェックボックスを外して看板を非表示にします。
アニメーションの設定
いよいよアニメーションを設定していきます。急にアニメーションとは？ と思った方に解説です。この場合のアニメーションとは何かを動かしたりする演出ではなく、「物の表示、非表示の切り替え」という処理を行わせるためのファイルです。「看板を出すアニメーション」「看板を消すアニメーション」を切り替えることで出し入れを行います。まず、こんちゃんの一番上の階層を選択した後、Inspectorの隣のAnimationタブをクリックします。
その後、右の方のCreateボタンを押してから適当な名前を付けて保存をすると、projectの現在選択しているフォルダ内にアニメーションファイルとアニメーションコントローラーファイルが作成されます。これは前回の記事でも解説した通りです。四角が3つと三角が1つ描いてあるアニメーションコントローラーはアニメーションの編集が終わったあとで削除します。
次に、右上の録画ボタンを押すと、録画ボタンが赤くなりこんちゃんがよっこらせっとしゃがみます。このしゃがみはアニメーション編集時にアバターのボーンの回転などがデフォルト値になることで発生するらしいですが、要するに「アニメーションファイルの編集中ですよ」の合図なので気にする必要はありません。逆にこのポーズが直らない間はアニメーションと関係ない値はいじっても反映されません。で、この状態になったら……
先ほど非表示にした立て看板を表示します。すると、チェックボックスが赤くなります。これは「今編集中のアニメーションではこの動作をやるよ」という意味で、これでこのアニメーションは「看板を表示する」指示を出すアニメーションになりました。
アニメーションタブを開いて録画ボタンをもう一度押すと編集終了です。「立て看板」にチェックボックスが入った指示が右上に表示されているのが見えますね。
ここまで終わったら例のアニメーションコントローラーファイルは削除します。しかし、ここまでしてもなおしゃがんだ姿勢は直りません。このままではいけないので……
適当なアニメーションファイル（今作ったのではなくてもいいです）を選択し、Animationタブを開くとこんちゃんのポーズが直ったりします。直らない時は色々なアニメーションファイルを選択してはAnimationタブを開いてみましょう。多分いずれ直ります。確実な方法として本来は、Animationファイルをいじる時はHierarchy上でこんちゃんをCtrl+Dでまるっと複製した後、コピー元を先ほどの看板のように非表示にし、コピー側で上記のアニメーションの編集を行った後コピー後の方のアバターを削除、コピー元を表示、という手順を踏むのが確実なのですがわたくしは面倒なので最近はそこまでしてません。
ここでアニメーションを複製してちょっと編集します。project上のkanbanアニメーションファイルを選択しCtrl+D（project上でファイルを複製する際は必ずこのショートカットキーを使用するので覚えておいてください）でコピーします。するとkanban1というアニメーションが出来ます。
今回はファイル名を「non」にリネームし、右上の「立て看板 1」と書いた指示の「1」の部分をクリックします。そしてこの部分を0に書き換えます。
これでこのアニメーションは「看板を非表示にする」アニメーションに書き換わりました。ここまでできたらアニメーションを配置するためFXの編集をしていきます。
アニメーションファイルの設定
Hierarchyのこんちゃんの一番上の階層を選択して画面右上のInspectorタブを開き、下の方にスクロールしていきます。すると、FXという項目が見えますね。これをダブルクリックします。
するとこのような画面が開かれます。こちらは前回の記事で表情のためのハンドサイン設定などをいじった場所で、おさらいをするとこのような構造になっています。
AllParts
何も入れません。ここにアニメーションを設定してしまうとアバター切り替え時にチラ見えしたりします。
New Layer
これは表情用に新規に作成したレイヤーです。中には「表情に使うブレンドシェイプを全て0にする」アニメーションだけが突っ込んであります。
Left Hand
左手のハンドサイン用のレイヤーです。
Right Hand
右手のハンドサイン用のレイヤーです。
これが基本構造になります。物の出し入れをするにあたってはこの4つは一切いじらず新しいレイヤーを作って行います。これを間違えて変なところにアニメーションを入れてしまうと面倒なことになります（わたくしはAllPartsのところによく入れてしまい仕込んだ小物がアバター切り替え時にチラ見えしてしまうなどしていました）
レイヤーの右上の+ボタンを押すと新規レイヤーが作成されます。
新しくできたレイヤーの右のギアボタンを押すと、このような画面が出ます。このWeightというところが最初0になっているのですが、スライドを動かして1にします。これを忘れるとアニメーションが動いてくれないので忘れず行いましょう。
次にLayersの右のParametersをクリックし、また右上の+ボタンを押します。するといくつかわけわからん名前が出てくると思いますが今回は「int」を選択します。これで新しい変数が作成されました。リネームして「kanban」にしておきます。
次にレイヤータブに戻って先ほど新しく作ったレイヤーを選択します。今回はkanban animとリネームしてあります。そこに、project上から先ほど作成した「non」アニメーションをドラッグアンドドロップします。するとこのような感じになります。ここで一度、配置した「non」をクリックしてWrite Defaultsのチェックを外します。
前回の記事でWrite Defaultsをわざわざ使っていましたが、有識者から話を聞けば聞くほど「使わない方が無難」であることが明らかになったので今回からは表情のアニメーションステートマシンも含めてWrite Defaultsは全て外しています。アニメーションの仕組みをある程度理解し、Write Defaultsを有効に利用しつつ不具合の発生を抑える構造を維持できるのなら使ってもよいでしょうが、そうでなければ外しておいた方が間違いありません。
次に「kanban」アニメーションをこの位置に置きます。Write Defaultsがついていたら忘れずに外します。
今度は「Any State」とある水色のボックスを右クリックします。するとMake Transitionという項目が出るので実行します。すると……
矢印を引っ張ることが出来ます。このように「kanban」のボックスに繋ぎます。
同様に「non」の方にも矢印を伸ばしていきます。
今度は「kanban」につながる矢印をクリックしてinspectorを開きます。すると下の方に「Conditions」という項目があるので、その右下の+をクリックします。
すると変数名が表示されたボックスができあがるので、クリックして「kanban」変数を指定します。
その右の「Greater」を「Equal」に変え、さらにその右の0を1に変えます。
はい、するとこうなります。これは「kanban」が1のときはこのステートマシンに飛ぶ（そして看板を表示するアニメーションが再生される）ことを意味します。
同様に「non」に繋がる矢印にも設定を行います。nonの方は値を0にします。「kanban」が0のとき、看板を非表示にするアニメーションを再生する、という仕組みになりました。
またこんちゃんのInspectorを開いて今度は一番下の方のExpressionsのところのCustamizeボタンを押します。これで、Avatars3.0の目玉、Expression Menuの編集に差し掛かることになります。
project上で右クリックしてCreate→VRChat→Avatars→Expression Parametersと作成します。同様にその上にあるExpression Menuも作成します。
作成したExpression Parametersをダブルクリックして新しく変数を登録します。今回は「kanban」変数を作成したのでその名前を入力します。
タイプミスして名前を打ち間違えないように気を付けましょう。ミスがあると動きません。
Expression Menuの方を編集していきます。選択したらAdd Controlをクリックして新しいコントローラを作成します。
するとこのように新しいコントローラが作成されました。Nameをkanbanにして……
TypeはToggleを選択します。これでメニューのボタンを一度押すとオン、もう一度押すとオフにできます。
その下のParameterはkanbanを指定、Valueを1にします。これで、「メニューのkanbanボタンからオンにするとkanban変数が1になってkanbanアニメーションが再生され看板を出す」コントロールができました。
最後に作成したMenuとParametersをそれぞれの場所にドラッグアンドドロップして設定します。これで準備はすべて整いました。あとはアップロードして動作を確認してみましょう。
この明らかに何か楽しそうな人間のマークがExpressionsです。ここを押すと……
kanbanボタンが出来ていますね。そしてこれを押すと……
はいドーン！！完成ー！！！
kanbanボタンをもう一度押すとちゃんと消えるのも確認しましょう。持ってるとこがヘン、とか向きが逆、とか判明したら位置調整しなおしになりますが、上に書いたように階層の外に出してオブジェクトを編集すると出し入れするアニメーションも作り直しになるので注意してくださいね。
以上になります。色々大変かとは思いますが、この理屈を基軸にステートマシンや矢印の行く先をいじり倒してアバターギミックを作っていく……ことになるのでしょうが、大変なのでこれだけできれば大概十分だと思います。それでは、わたくしはキャベツにマヨネーズをかける作業に入りますので、さようなら。次はEXメニューを利用したマテリアル変更あたりについて書こうと思います。