「毎日進捗を出す」VRChatアバター改変【Day4】髪型変更とダイナミックボーン
こんにちは、あわいです。
Vket5、始まりましたね。色々大変でしたが、私も祝祭のマルシェに帽子屋さんを出店しておりますので、もしよろしければお越しください。
Boothにて、Vket5で展示するお帽子4つの販売を開始しました！https://t.co/fRBVBQ1WPq#VRC #Vket5 pic.twitter.com/mqvfrLo79V
— あわい@Vket5祝祭のマルシェDay4城前広場 (@Awai_desu) December 16, 2020
さて、今日は髪型の変更とダイナミックボーン設定について扱いたいと思います。髪型の変更は、アバターの印象をガラッと変えますので、ぜひトライしてみてください。
まずその前に、「ダイナミックボーン」のお話をしましょう。よく聞きますね、ダイナミックボーン。「とりあえず買おう」なんて話もよく出ます。言葉だけ聞いたことがある方も、とりあえず買って突っ込んで動かしている方もいらっしゃると思いますので、基本的なところから始めたいと思います。
ダイナミックボーンとは？
端的に言うと、Unityアセットストアで販売されているUnityアセットです。定価20ドルですが、たまにセールで半額になったり7割引になったりしているので、そのときを狙って買うのもいいでしょう。
では何をしてくれるアセットなのか？というと、「ボーンに重力や慣性や衝突などの物理シミュレーションを付加する」と考えてもらえれば、一番早いと思います。いわゆる「揺れもの」を実現するためのツールです。
もう少し具体的に見ていきましょう。Day0で説明した画像を再掲します。
アバターを動かすための骨がボーン、でしたね。以前も書きましたが、このボーン、人型として動かすためにHumanoidという共通のお約束があります。
これがUnityでのHumanoidのお約束です。よくHumanoidリグと言ったりします。これらのボーンのうち、必須のものが揃っていると、Unityは人型だと認識してくれます。VRにおいては、トラッカーの動きをこのボーンの動きとしてうまく調整してくれているわけです。
さて、ではいつものリュージュちゃんのボーンを見てみましょう。ボーンの中身はBlenderで見るのがシンプルです。
はい、これがリュージュちゃんを丸裸にしたボーン構造です。分かりやすいようにボーンを最前面にし、名前も表示しています。見ると、先ほどの人型以外のボーンもいっぱい入っていますね。特に髪の毛や持っているカバン、スカート、尻尾あたりが目立ちます。
分かりやすいように、尻尾を見てみましょう。このように、入っているボーンとメッシュはスキニングされています（用語が分からなくなったらDay0を読み返してみてください）。
しかし、これだけではこの尻尾は動きません。Humanoidリグのボーンは、人型というお約束に従っているので、トラッカーの動きをうまく反映して自動的に人型としての動きを作ってくれますが、尻尾は単にお尻にくっついた棒上のメッシュに過ぎません。なぜなら、人型には含まれないボーンは、動きが定義されていないからです。
このボーンに、物理的シミュレーションによる動きを定義してあげるのがダイナミックボーンです。中身は、物理シミュレーションを行うスクリプトの塊です。
ここで、「それが出来るならもっと高度なことも出来るのでは？」と思った方、鋭いです。Unityは汎用ゲームエンジンですので、コードを書くことで基本的には何でも実現することができます。例えば、デレステやポケGO、APEXなどもUnityで開発されています。
ですが、残念ながら原則としてVRChatで自作のコードを走らせることはできません。なぜなら、VRChatで使えるUnityの部品（コンポーネントといいます）はホワイトリスト形式で決められているからです。
これがアバターで使えるコンポーネントの一覧です。2020年12月現在、ほとんどがVRChatが提供しているものか、Unityが提供しているもので、最後にわずか2カテゴリだけ、サードパーティ製のものがあります。ここでダイナミックボーンが許可されているので、VRChatに導入できるわけですね。
髪形の導入
さて、本題に戻りましょう。髪型変更ということで、今日はこちらのアセットを使わせて頂きます。
QuQuさんは大人気のかわいいかわいいNecoMaidシリーズや、その他にも素敵なアバター用アセットを多数販売されています。特に特定のアバター専用ではない汎用的な髪型や衣装が多く、専用のものに比べると導入に一手間必要なものの、とてもクオリティが高いのでぜひ一度ご覧ください。
さて、Boothで購入しダウンロードしたunitypackageの中身は以下の通りです。
おっと、fbxとテクスチャファイルのみが同梱されています。推測ですが、QuQuさんはマテリアルやPrefabの配布をせず、アバターのシェーダーやマテリアル設定に合わせて各自好みにセットアップできるようにされているのではないかと思っています。ちょうどよいので、これを機にfbxとテクスチャのみから、アバターにセットアップする手順を確認してみましょう。
まず、unitypackageで固まったものを丸ごとインポートするわけではないので、先にUnity上にフォルダを作っておきます。名前は何でもよいので、今回は「Hair」フォルダにしましょう。Assetsの下で右クリックして、Create→Folderでフォルダを作成し、Hairにリネームします。
そこのフォルダ上で右クリックし、「Import New Asset」を選択し、先ほどダウンロードしたfbxファイルとテクスチャファイルをそれぞれインポートします。すると、下のような状態になるはずです。
さて、では実作業に入りましょう。下の画像は何度でも再掲します。
fbxとテクスチャがあるということは、この画像のうち「ボーン」「メッシュ」「テクスチャ」があるということです。ないのは「マテリアル」でありそのマテリアルに設定する「シェーダー」ですね。
このうち、マテリアルは自分で作る必要があります。先ほど作ったHairフォルダの中で右クリックして、「Create→Material」といきましょう。
すると、「New Material」というファイルが生成されたかと思います。名前は何でもいいので、「Hair_mat」とでもしておきましょう。このファイルを選択した状態で、インスペクターを見ると、このような情報が表示されています。
これがマテリアルの中身です。細かい設定項目がたくさんあって訳がわかりませんが、まず一番上の「Shader」に注目してみると、「Standard」とあります。これが、このマテリアルにセットされているシェーダーです。Standardシェーダーは、Unityのデフォルトシェーダーの一つで、リアリスティックな陰影の表現を得意とします。このままでも構わないのですが、この連載記事でずっと扱っているリュージュちゃんはユニティちゃんトゥーンシェーダー（UTS）を使ったアニメ調の表現になっています。
ですので、ここではStandardシェーダーからUTSに切り替えてみましょう。先ほどの「Standard」をクリックすると、以下のようなメニューが表示されますので、UnityChanToonShader→Toon_DoubleShadeWithFeather（ながい）を選択します。
ここで注意なのは、UTSが選択肢に表示されるのは、予めインポートしてあったリュージュちゃんにUTSが同梱されているからです。UTSを使っていないアバターにセットアップしようとしている場合は当然表示されませんので、必要に応じてarktoonやMtoonなど、お使いのシェーダーに切り替えてください。ここでは、そのままUTSを例として説明します。
これがUTSの設定項目です。Standardシェーダーよりもはるかに設定項目が多く、クラクラします。ここでは、非常にシンプルな使い方だけご紹介します。詳細については、UTSのマニュアルを参照してみてください。
UTSの設定項目のうち、とりあえずはここだけ注目すればOKです。
ここで、「BaseMap」「1st ShadeMap」の左側にある四角形に、先ほどインポートしたテクスチャファイルをD&Dしましょう。UTSはトゥーンシェーダーと呼ばれる、アニメ調の表現を得意とするシェーダーの一種であり、設定の一部はアニメ塗りの名称を使っています。「BaseMap」「1st ShadeMap」「2nd ShadeMap」は、それぞれアニメ塗りで「ベースカラー」「1影」「2影」などと呼ばれるもので、シンプルに使うのであればBaseと1st ShadeMapだけ設定すればOKです。
「Base」「1st ShadeMap」にテクスチャファイルをD&Dしたら、「1st ShadeMap」の右側の白い四角をクリックしてみましょう。下のように、カラーパレットが立ち上がると思います。
これは、1影の色を指定するためのパレットです。3Dにおいては、光源と影があるというお話は以前にしたかと思います。光源に照らされたとき、どのような色の影を、どのように落とすかを設定することができるのです。これは最後のセットアップで使います。
とりあえず、これで「マテリアル」と「シェーダー」の最低限のセットアップが終わりました。あとは、このマテリアルをfbxに適用しましょう。方法はいくつかあるのですが、今回は以下の手順でやってみようと思います。
まず、fbxファイル自体をヒエラルキーにD&Dします。髪型が追従すべきボーンはアバターの「Head」なので、「Head」の中に入れてしまいましょう（この辺りは、Day3の記事を参照してみてください）。
はい、このようになりました。このfbxファイルにはまだ何のマテリアルも設定されていないため、見た目はデフォルトカラーが適用されたただのメッシュです。ここで、D&Dしたfbxファイルをヒエラルキー上で展開してみましょう。
このように、いくつかのオブジェクトに分かれていることが確認できると思います。このそれぞれに対して、マテリアルを設定することができます。
オブジェクトにくっついているコンポーネントとして、「Mesh Renderer」と「Skinned Mesh Renderer」のどちらかがあると思います。非常にざっくり言うと、前者はボーンが入っておらずアニメーションしないもの、後者はボーンが入っていてアニメーションするものにくっついています。今回の髪形は、全てSkinned Mesh Rendererですね。
さて、それぞれのRendererにはマテリアルを入れるスロットがあるので、そこを見てみましょう。以下の例は髪形のメッシュのうち「Front」に設定されているSkinned Mesh Rendererの場合です。
ここの「Element」に、先ほど作ったマテリアルをD&Dします。すると……？
やりました！テクスチャがきちんと反映されています。この作業を、fbxに含まれる全てのオブジェクトにやっていきましょう。
ん……？Mesh RendererもSkinned Mesh Rendererもついていないものがありますね。何でしょうか。実は、これが「ボーン」です。Blenderでボーンを確認してみると、このようになっています。
このボーンと髪型のメッシュがスキニングされているわけですね。こんなところにボーンがあっていいの？と思われるかもしれませんが、ボーンの親子関係がお約束になっているのは、前に説明したHumanoidに従うボーンのみです。その他のボーンは、適当なところにあって構わないのです。
さて、では髪へのテクスチャ適用ができたところで、髪色も変更してしまいましょう。これはDay1の髪色変更を参考にしてくださいね。
いい感じに髪色を変更出来たら、髪形を合わせていきましょう。まず、もともとの髪形を消す必要があります。リュージュちゃんの場合、髪形のメッシュはskinningの中に入っていますので、この二つを非表示にすることで、元の髪形を消すことができます。
とりあえず、これで元々の髪形は消えたと思いますので、導入した髪形の位置・サイズ・回転を合わせてセッティングしましょう。なお、Unity上で「非表示」にするだけでも問題はないのですが、パフォーマンスを考えると「削除」してしまった方がよいです。やり直す必要がないな、と判断したら、その時点で削除した方が他のプレイヤーには優しいので、覚えておいてください。うまく合わせると、このようになります。
いかがでしょうか。ガラッと印象が変わったのが分かると思います。髪形は、簡単にアバターの印象を大きく変えられるアイテムですので、ぜひ活用してみてください。
ダイナミックボーン導入
さて、ではいよいよDynamicBoneの設定に入ります。まず、DynamicBoneをAssetStoreから購入して、プロジェクトにインポートします。購入した後、「Open in Unity」で、Unity上からAssetStoreが開けるはずです。
そして、先ほど確認した髪型ボーンのうち、「揺らしたいものが集まっている親ボーン」（この髪形の場合は髪形の「Armature」→「Head」）を選択して、インスペクタから「Add Component」を押して「dy」と入れれば、候補にDynamicBoneが現れますので、選択しましょう。
すると、DynamicBoneコンポーネントが追加されました。これで終わり！……ではありません。実は、DynamicBoneは、「どこを揺らす基準にするか」というルートのボーンを指定してあげる必要があります。そして、ここで指定したルートのボーンの配下にあるボーンは、全て同じパラメータを使って揺れることになります。
ここが指定箇所です。ここに、髪型ボーンのルート（さっきDynamicBoneをくっつけたHead）を、ヒエラルキーからD&Dしましょう。
これでOKです！早速確認してみましょう。VRCに上げなくても、DynamicBoneが効いているかは確認できます。Unityの上部にある再生ボタンを押して、ヒエラルキーから、アバター自体のHeadを選択した状態で左右に動かしたり、回転させたりしてみましょう。Headに追従して髪型がついてきて、揺れるべき部分が揺れればOKです。なお、再生ボタンを押している間の操作は、再生を停止すればリセットされますのでご心配なく。
……んー……。揺れています。揺れてはいますが……髪っぽくないですね。
これは、DynamicBoneのパラメータによるものです。デフォルトそのままでは、このようにかなり荒ぶる動きをしてしまうので、調整する必要があります。パラメータをいじる必要があるのはこの部分です。
4つのパラメータと、それぞれの傾斜がありますが、一旦パラメータだけ注目しましょう。各パラメータの解説をしようかと思ったのですが、「望ましい揺れ方」は人によって違う上、どっちみち少しずつ動かして試行錯誤が必要になりますので、ざっくりとした感覚の話だけに留めます。
・Damping
「減衰」＝慣性をどれくらい減殺するかです。
小さくするとちょこまか揺れ、大きくするとゆったり揺れます。
・Elasticity
「弾力」＝元に戻ろうとする力です。
小さくするとゆっくり戻り、大きくすると瞬時に戻ります。
・Stiffness
「剛性」＝素材の硬さです。
小さくするとやわらかーくなり、大きくするとかたーくなります。
・Inert
「慣性」＝位置変化による揺れ方の量です。
小さくするとちょっとの移動で揺れ、大きくすると移動量が多いときに揺れます。
はい、ここまで読んでもよく分かりませんよね。正直、それぞれのパラメータは相互に関連しあって「それっぽさ」を演出しているので、こういう動きをさせたいからこうすればいい！という正解は私にも分かりません。試行錯誤した方が早いと思います。
ご参考までに、私がよく使う髪型のDynamicBone設定を乗せておきます。別にこれが正解というわけではないので、色々試してみてください。もちろん、スカートや袖など布のものは、別の設定が望ましいと思います。
・Damping: 0.2～0.3
・Elasticity: 0.05
・Stiffness: 0.05
・Inert: 0.6～0.7
さて、では上記のパラメータにしてみました、どうでしょうか！
かなり「ふんわりした髪の毛」っぽい動きになったのではないでしょうか！
ところで、髪を揺らして初めて気づきましたが、一部のメッシュが灰色に塗りつぶされているように見えますね。これ、実は「カリング」によるものなのです。
カリングとは、見えないメッシュなど、必要のない個所を描画しないようにするための処理です。UTSでは、デフォルトで「バックカリング」されています。つまり、「ポリゴンの裏面は描画されない＝両面を描画したい場合、厚みを作る必要がある」のです。今回の髪形では、どうやら厚みのないポリゴンの部分があり、その裏面が描画されていないようです。
そういうときには、UTSの設定でカリングを切りましょう。設定はここにあります。デフォルトではおそらく閉じていると思いますので、三角形を押して展開してあげてください。
ここで「Culling Off」を選択することで、裏面も含めて全てのメッシュが描画されるはずです。
これで完全体になったでしょうか！？
むむむ……いい感じです。いい感じなのですが……前後に揺らしたとき、前髪が顔にめり込んでいますね。
実は、これを解消するための設定もあるのですが、noteの画像数制限リミットに到達して、記事自体も長くなってきましたので、Day4.5として次回に回させて頂こうと思います。
次回はDay4.5として、UTSの影設定とダイナミックボーンコライダーの使い方について取り上げたいと思います。長い記事をお読みいただきありがとうございました！
この記事が気に入ったらサポートをしてみませんか？