皆さんは、アバター改変楽しんでいますか？
楽しんでいるけども、やっぱりやるのは面倒と思う人は多くいると思います。
本記事では、なるべく簡単に、そして軽量なアバターになるようなアバター改変を紹介します。そして今回紹介するツールはいずれもVCC経由でインポートできるので、どのプロジェクトでもすぐに環境が整えられるようになります。
VCCそのものの解説や導入方法については、下記の記事をご確認ください。
特大ボリュームの記事のため、ブックマークをして目次から気になるツールにアクセスする形で、この記事を活用してください！
- 1 アバター改変のインフラ的存在 「ModularAvatar」
- 2 非対応アバターの調整は「キセテネ for MA」で済ませよう！
- 3 アバターのシェーダーといえばこれ！「lilToon」 「Poiyomi Toon Shader」
- 4 ドラッグアンドドロップでアバターを最適化！ 「Avatar Optimizer」
- 5 ツールで最適化した結果を「Actual Performance Window」で試そう！
- 6 「lilycalInventory」でオブジェクトの出し入れ、明るさ調整など一気に済ませよう！
- 7 テクスチャやマテリアル、ライティングの確認はこれ！「lilAvatarUtils」
- 8 デカールや髪色にグラデーションができるように「TexTransTool」
- 9 Quest対応をやってみよう！ 「VRCQuestTools」
- 10 ポリゴン数をもっと削りたい？「lilNDMFMeshSimplifier」
- 11 自動で表情のExpressionMenuを作ってくれる！ 「FaceEmo」
- 12 Unityを見やすくしよう！ 「lilEditorToolbox」
- 13 ExpressionMenuの確認はこれを使え！ 「Gesture Manager」
アバター改変のインフラ的存在 「ModularAvatar」
「ModularAvatar」とは、非破壊でアバターに衣装やギミックを導入できるツールです。非破壊なので、後戻りがつかない事態を避けられ、更新しやすい状況で管理できます。
今回は、アバターの着せ替えを導入するときのやり方を紹介します。
まず、「ModularAvatar」を導入していない人は、こちらのリンクからVCC経由で導入を行ってください。画像のようになったら、「I Understamd, Add Repository」を押して追加してください。
次にプロジェクトを制作してください。すでに制作している場合は、そちらを使ってください。「ModularAvatar」を追加したいので、「Manege Packages」から「Modular Avatar」の＋ボタンを押しましょう。
プロジェクトを開いたら、アバターをHierarchyに置きましょう。その後、衣装をドラッグアンドドロップしてください。
衣装に右クリックを押し、「Modular Avatar」にカーソルを合わせて「Setup Outfit」を押してください。あとはアップロードをするだけで完了です。お疲れ様でした。
「Modular Avatar」は衣装以外にもギミックもドラッグアンドドロップだけで導入できます。ギミックの導入に必要なアニメーションもアップロード時に自動で設定されるので、簡単にできるのです。
BOOTHで「Modular Avatar対応」と書かれている商品は、簡単にできるので、商品を見るときはチェックしてみてはいかがでしょうか？
また、ModularAvatarの活用方法は着せ替えにも多くあります。もっと知りたい人は下記の記事をご覧ください。
非対応アバターの調整は「キセテネ for MA」で済ませよう！
対応しているアバターは、「ModularAvatar」を使えばそのまま服を着せられますが、非対応アバターとなるとそうはいきません。
非対応アバターに服を着せたいときは、「キセテネ for MA」を使いましょう。ご存知の方はいるかもしれませんが、アバターの着せ替えツール「キセテネ」をPrefab状態でも使えるようにしたツールになります。
こちらのサイトから「Add to VCC」を押すことで、インポートが行なえます。
インポートが行えたら、プロジェクトを開き、「Tools」、「KiseteNe For MA」を選択しましょう。次に着せたい服をセットしましょう。画像のような画面が出れば成功です。
「Scene」を見ながらパラメーターを調節しましょう。調整したら完了です。「Modular Avatar」の「Setup Outfit」を押していない人は押すことを忘れずに。
アバターのシェーダーといえばこれ！「lilToon」 「Poiyomi Toon Shader」
執筆現在のアバターのシェーダーは、「lilToon」と「Poiyomi Toon Shader」が主流です。どちらもVCC経由でインポートできるので、ぜひともしましょう。
とくに「lilToon」は、同作者から他にも便利なツールを配布しているため1個追加するだけで便利になります。
こちらのサイトから「VRChat Creator Companion」のボタンを押してインポートを行ってください。
Poiyomi Toon Shaderはこちらのリンクから「Add to VCC」をクリックしてインポートを行ってください。
アクセサリー類のシェーダーはこれ！ 「UnlitWF Shader」
アバター以外にもアクセサリー類などには「UnlitWF Shader」が使われることがあります。現在VCC経由でのインポートが行えるのでこちらも行いましょう。
こちらのサイトから案内に従ってインポートを行ってください。
ドラッグアンドドロップでアバターを最適化！ 「Avatar Optimizer」
「Avatar Optimizer」では、非破壊でアバターの軽量化できるツールです。「Modular Avatar」同様、非破壊なので、後戻りがつかない事態を避けられ、更新しやすい状況で管理できます。
本記事では、Skinned Meshを結合をしてMesh Renderersを減らす作業とBlendShapeを固定する作業を行います。
ModularAvatarと同様にこちらのリンクからVCC経由でインポートを行ってください。
とりあえず付けておけばOK 「Trace And Optimize」
プロジェクトを開き、アバターを選択。「Add Component」から「Trace And Optimize」を追加しましょう。検索するときは「AAO」と入力すると、ある程度絞り込めます。
各種設定にチェックマークが入っていれば、あとはアップロードするだけで、自動で軽量化処理が行われます。
コンポーネントを付けるだけで画像のように変化します。Skinned MeshesやMaterial Slotsなどが減っています。
画像のはデフォルトの「桔梗」を付けているだけのため、最適化の余地がより生まれるアバター改変後はより効果が発揮されるかと思われます。
見えない部分のポリゴン数を減らして最適化！ 「AAO Remove Mesh By BlendShape」
さらに最適化させたい人は、「AAO Remove Mesh By BlendShape」というComponentを使いましょう。ブレンドシェイプを基準に、ポリゴン数をさらに減らすことができます。
最初に、アバターの身体にComponent「AAO Remove Mesh By BlendShape」を追加します。
「AAO Remove Mesh By BlendShape」は、ブレンドシェイプによって動かされる頂点とポリゴンを削除するComponentです。
服によって見えない部分に該当するブレンドシェイプにチェックマークを押しましょう。
例えば、「shrink_Hip」と書かれているブレンドシェイプにチェックマークを押すとお尻周りのポリゴンが減らせます。「Preview」のボタンを活用すれば、挙動を確認しながら設定できるので活用してみましょう。
ポリゴン数を減らすコンポーネントはこの他にもあるため、詳細を知りたい方はドキュメントでご確認ください。
tips VRM変換にも「ModularAvatar」や「AvatarOptimizer」は使える
clusterやVARK SHORTSのようなサービスでは、VRM規格を使う場合があります。今回紹介した「ModularAvatar」や「AvatarOptimizer」はVRMに変換するときにも使えるのをご存知ですか？
本来、アップロード時に「ModularAvatar」や「AvatarOptimizer」といったツールは機能するのですが、手動で処理を行うことで、VRMに変換した際にも使えるようになります。
手動で変換するのは簡単。「Manual bake avatar」を押すと処理を行ったアバターが複製されます。「Modular Avatar」と「AvatarOptimizer」の処理が同時に行われます。
以前のバージョンでは「Modular Avatar」と「AvatarOptimizer」は別々で処理する必要がありましたが、現在は必要ありません。
VRM変換のやり方は下記の記事でまとめてあるので、気になる方はやってみてください。
ツールで最適化した結果を「Actual Performance Window」で試そう！
「ModularAvatar」や「AvatarOptimizer」のような非破壊系ツールを使うと、VRCSDKの画面では本当のパフォーマンスが分からず、VRChatにアップロードするまで分からない状態になります。
「Actual Performance Window」は、VRChatを起動せずともUnity上で「ModularAvatar」や「AvatarOptimizer」の非破壊系ツールを適用した状態のパフォーマンスを確認できるツールとなります。
Manage Packagesから「anatawa12’s gist pack for Unity」をインポートしてください。「AvatarOptimizer」をVCC経由で追加した際に、「anatawa12’s gist pack for Unity」も合わせて追加されます。
そのため、「Manege Packages」の中から「anatawa12’s gist pack for Unity」を探して追加してください。
プロジェクトを開いて、「Tools」から「anatawa12’s gist selector」を開いてください。ウィンドウが開かれるので、「Actual Performance Window」にチェックマークを押して、「Apply Changes」を押してください。
つぎにプロジェクトの画面にある再生マークを押して、Playモードに移行しましょう。Playモードになれば自動で「Actual Performance Window」が機能し、ツールによって最適化された状態でのパフォーマンスが分かるようになります。
「lilycalInventory」でオブジェクトの出し入れ、明るさ調整など一気に済ませよう！
「lilycalInventory」では、便利な機能を搭載したコンポーネントがまとまっているツールです。
「lilToon」を追加すれば合わせて追加されるので、Manage Packagesからインポートしましょう。
機能が多数搭載されているため、この記事では、オブジェクトの出し入れなどの操作とアバターの明るさの2つを紹介。
アバターの小物の出し入れなどに使える、LI Propの使い方解説
まずはオブジェクトの出し入れなどの操作について紹介。まずは出し入れをしたいオブジェクトを選択しましょう。帽子やメガネなどのモデルを選択すればOKです。オブジェクトを選択したら「Add Component」を選択し「LI Prop」を選択しましょう。
LI Propではオブジェクトの出し入れ以外にBlendShapeの調整、マテリアルの切り替えなどができます。まずはオブジェクトの出し入れから見ていきましょう。
オブジェクトの出し入れは「オブジェクトのオンオフ」で設定できます。「追加」を押して、出てきた選択を出し入れしたいオブジェクトをドラッグアンドドロップ。横にある「オフにする」でメニューを選択したときにオブジェクトを出すのか、出さないのかを選択できます。
設定が上手くできているか確認するときは、「アニメーションのプレビュー」で「プレビュー」を使いましょう。
オブジェクトの出し入れをしたい数を含めて、同時に操作したいものがあれば同じ項目で設定しましょう。別の操作で出し入れしたい場合は、また別オブジェクトに「LI Prop」を選択してください。
「BlendShapeの切り替え」ではアバターの体型などを調整するBlendShapeの数値を調整できます。オブジェクトの出し入れに伴って、BlendShapeを調整したいときに使いましょう。
追加を押して、調整したいオブジェクトをメッシュの項目にドラッグアンドドロップ。「切り替えるBlendShapeと値」の「追加」を押すときに切り替えたいBlendShapeを選択します。その後、ボタンを押した後に設定したい値を入力します。今回のような「Shrink〇〇」のような名称は100を設定すると絞り込まれて表示されなくなるといった感じです。
「マテリアルの置き換え」では、そのオブジェクトの見た目などの設定を担っているマテリアルを変更します。使用用途としては、髪などの色を変えるといった「色変え」などが簡単なところでしょう。
追加を押して、マテリアルを差し替えたいオブジェクトをドラッグアンドドロップで選択。置き換え先にある選択も変更したいマテリアルをドラッグアンドドロップで完了です。
色変えなどの場合は、変更したいマテリアルを選択してShift+Dで複製。その後色を変えたあとのテクスチャに差し替えて、先程の置き換え先に入れるといいでしょう。色の変え方は、いろいろありますがUnity内で完結させたいのであればlilToonの「メインカラー/透過設定（色替え）」から色を変えて、下にある色調補正にある「焼き込み」を選択するのがオススメです。
アバターの体型調整に使える！BlendShapeの無調整段階
BlendShapeの無調整段階をする場合は、「LI SmoothChanger」を使います。
「LI Prop」と同じように、変更したいオブジェクトに「LI SmoothChanger」のコンポーネントを付けます。
パペット設定値の折りたたみを開き、「BlendShapeの切り替え」の項目も開いてください。「追加」を押した後は、BlendShapeを制御したいオブジェクトをドラッグアンドドロップしてください。
今回は胸の大きさのBlendShapeを0から100まで設定できるようにします。なので、パペット初期値を０とし、フレームはBlendShape最小値の0と最大値の100の2つを設定します。
フレームの追加をするときはパペット初期値下にある「フレーム」横の「追加」を押してください。
BlendShape最大値の100を設定するほうのフレームはパペット設定値を100にしました。
設定したのが以下の画像です。参考にしてみてください。
動作チェックをしたい場合は、「アニメーションのプレビュー」を「プレビュー」にし、「プレビューするパペット値（%）」のメーターをいじってみましょう。
ドラッグアンドドロップで簡単設定。アバターの明るさ設定を追加しよう
「lilycalInventory」では、明るさ調整メニューの追加もできます。lilToonの場合は、ドラッグアンドドロップだけで簡単に追加できます。
まず「Project」にある「Packages」から「lilycalInventory」を選択。
「Prefabs」フォルダを選択してください。
「LightChanger」をアバターにドラッグアンドドロップすれば設定完了です。
その他のシェーダーに設定したい場合は、公式ドキュメントをご確認ください。
追加される明るさ調整メニューでできることは以下の通りです。
- Brightness（輝度）
- Temperature（色温度）
- Monochrome（グレースケール）
- Saturation（彩度）
テクスチャやマテリアル、ライティングの確認はこれ！「lilAvatarUtils」
最近のアップデートで、テクスチャ容量もパフォーマンスランクに影響を与えるようになりました。そのため、自分のアバターの容量も気になる人はいるはず。でも、1つずつ確認するのは大変です。
そこで使いたいのが「lilAvatarUtils」です。「lilAvatarUtils」は、アバターに使われているテクスチャの容量を一覧で確認でき、テクスチャサイズも容易に変更できます。さらに、マテリアルのRender Queue、ライティングの確認もできます。
「lilToon」をVCC経由でインポートすると、「lilAvatarUtils」もManage Packages追加されます。他のツールと同様にインポートを行ってください。
インポートした後にプロジェクトを開き、「Window」から「lil」「AvatarUtils」を選択してください。
1番上のオブジェクトを選択する所に、アバターのPrefabをドラッグアンドドロップしてください。ドラッグアンドドロップをすると、アバターに使用されているテクスチャが確認できるようになります。
Materialsでは、ShaderやRender Queueの確認ができます。
Lightingsでは、さまざまな場面でのライティングの当たり具合が確認できます。また、Safetyが掛かっている状態でのアバターの姿も確認できます。Safetyが掛かっていると、例えば頬の表示がおかしくなるといったことが起きるので、確認しておきましょう。
ライティングそのものの設定をしたい場合は、先述した「lilycalInventory」がオススメです。「lilycalInventory」の項目で導入や機能をご確認ください。
デカールや髪色にグラデーションができるように「TexTransTool」
髪に色を足してグラデーションのようにしたい場合や、複数の衣装を使っているときにマテリアル数を減らしたい場合など、テクスチャ周りの編集・最適化をしたい場合は「TexTransTool」を使いましょう。
パッケージに追加するためには、公式サイトの「Download-VPM」を押してください。また、前提としてNDMFが必要のため、事前に「Modular Avatar」もしくは「Avatar Optimizer」の追加を推奨します。
この記事では、主要な機能を2つ紹介。
髪のグラデーションやロゴを入れるときに活躍！ 「SimpleDecal」
まずは、髪にグラデーションをしたい場合やアバターにタトゥー、衣装にロゴを入れたい場合などに使える「SimpleDecal」をご紹介。アバターを選択して右クリックし、「TexTransTool」→「TTT SimpleDecal」を選択。
追加を行うとHierarchy内に新しく「SimpleDecal」が追加されます。「ターゲットレンダラー」にテクスチャを入れたい箇所を選択しましょう。髪にグラデーションを入れる場合は、髪のモデルに、身体に入れたい場合は身体のモデルを入れる形です。
「デカールテクスチャー」には入れたいテクスチャを選択してください。髪に単色のグラデーションを入れたい場合は、白色にするとツールの機能を使って色を調整できます。
スケール設定でテクスチャの選択範囲を指定ながら、プレビューで調整してください。初期のスケール設定だと、基本的にアバター全体を選択する程度の範囲になっているため、Sceneの左上にあるボタンを活用して、移動、大きさを変更してみてください。
設定完了した後は、アップロード時に自動で処理してくれます。
改変に使えるテクスチャ編集ではこの他にも、グラデーションの画像をツール側で設定してそのまま改変できる「SingleGradationDecalやPhotoshopなどのソフトをなしにPSD形式を開いて編集、色改変できる「TTT PSD Importer」があります。
ただし実験的な機能のため、詳細は公式ドキュメントをご覧ください。
テクスチャのアトラス化でアバターを最適化！ 「AtlasTexture」
もう1つはテクスチャのアトラス化を起こって、マテリアル圧縮を行う「AtlasTexture」を紹介。こちらは、複数の衣装を組み合わせて使うなどしてマテリアルの一部分を組み合わせて使用する場合やmobile対応（Quest対応）する場合などに有効です。
アバターを選択して右クリックし、「TexTransTool」→「TTT AtlasTexture」を選択。
アバター内のマテリアル一覧が表示されます。今回は桔梗のデフォルト衣装と着せ替えた衣装のマテリアルを選択しました。基本的には組み合わせた衣装のマテリアル同士を選択するのがいいでしょう。
正しく動作しているかを確認したい場合は、画面上部の再生ボタンを押してPlayModeにしましょう。表示が正しければ成功です。もっと詳しく見たい場合は、衣装のモデルを選択して適用されているマテリアルとテクスチャを確認しましょう。
Quest対応をやってみよう！ 「VRCQuestTools」
「VRCQuestTools」とは、ワンボタンで簡単にmobile対応（Quest対応）できるツールです。ただし、パフォーマンスランクは最適化されないので、「Avatar Optimizer」と併用しましょう。
BOOTHの配布ページよりリンクが置かれているので、VCC経由でインポートしてください。
プロジェクトを開いて、「VRCQuestTools」から「Convert Avatar for Quest」を押してください。
「変換」ボタンを押して、Quest対応をしたアバターを作りましょう。Phys BoneのComponent数が多い場合、削除する必要があります。調整したい人は調整してください。
あとは、アップロード時に「Switch Build Target」を押して、Androidビルドでアップロードしましょう。
またアップデートによってPC版と同一アバターで、PC版とAndroid版両方を管理できるようになりました。より詳細を知りたい場合は下記の記事をご参考ください。
ポリゴン数をもっと削りたい？「lilNDMFMeshSimplifier」
mobile対応をはじめ、パフォーマンスランクにはポリゴン数が左右されます。見た目とのトレードオフにはなりますが、ポリゴン数を減らすデシメートを行ってくれるツール「lilNDMFMeshSimplifier」を紹介。
「lilToon」をVCC経由でインポートすると、「lilNDMFMeshSimplifier」も合わせて追加されます。インポートしましょう。
プロジェクトを開き、ポリゴン数を減らしたいオブジェクトに「Add Component」から「lil」を検索し、「NDMF Mesh Simplifier」コンポーネントを追加してください。
コンポーネントを追加したら、品質のパラメーターを調整して、どの程度までポリゴン数を減らすか決めてください。ポリゴン数の削減はアップロード時に行われます。
自動で表情のExpressionMenuを作ってくれる！ 「FaceEmo」
「FaceEmo」では、表情の作成、表情とジェスチャーの紐付け、Expression Menuでの表情の変更などができます。
「FaceEmo」でも、VCC経由でインポートできます。こちらのリンクよりインポートを行ってください。
Unity上に「FaceEmo」をインポートすると、ヒエラルキー上のアバターに「Emo」のマークが現れるようになります。アイコンをクリックすると「FaceEmo」のツール画面が表示されます。
初回起動時には、アバターに元々設定されている表情設定がそのまま読み込まれます。
表情パターンの1番左のボタンを押すと、表情パターンが追加されます。表情パターンを複数用意すると、Expression Menu を使用した表情パターン切り替えも容易にできます。かっこいい顔つきとかわいい顔つきようなパターン分けが簡単に設定可能です。
表情パターンに追加を行うと「表情」ビューに表情を追加できるようになります。ハンドジェスチャーの条件を設定していきましょう。ハンドジェスチャーの条件は片手のみや両手とパターンを細かく設定できます。
表情アニメーションは表情サムネイルにマウスカーソルを合わせると表示されます。左上のボタンを押して、エディタ画面を表示させましょう。
エディタ画面では、追加したいシェイプキーを押すことで追加できます。シェイプキーの数値を変化させたいときは、スライダーを動かすか、テキストボックスに数値を入力します。顔を見ながら調整できるのは便利ですね。
デフォルトで設定されている表情は、干渉防止のため無効化されています。手間がかかるかもしれませんが、改めて設定し直しましょう。
表情の設定を済ませたら「FaceEmo」のツール画面にあるアバターに適用を押しましょう。あとは、アップロードを行えばModular Avatarによって表情メニューが作られます。
「FaceEmo」を適用して制作したアバターには自動でExpressionMenuが制作されます。自動で生成されたExpressionMenuでは、表情の固定ができます。もちろん、表情のサムネイル画像も自動で設定されます。
その他にも表情の上書き有効やまばたきOFFなど便利機能も自動で設定されます。アバターによってはデフォルトで設定されていますが、あると便利なので嬉しいですね。
Unityを見やすくしよう！ 「lilEditorToolbox」
「lilEditorToolbox」では、Unityを見やすく便利にするツールが多く収録されています。「lilToon」を追加している場合は、すでにパッケージが追加されているので追加しましょう。
今回は機能の一部を紹介。なお事前の説明がない場合は、機能のオンオフはメニューバーの「Edit」にある「Preference」の「lilEditorToolbox」項目で行います。
Inspectorをタブのように扱える！拡張Inspector
拡張Inspectorは、「Preference」の「lilEditorToolbox」項目で「インスペクターのタブ追加ボタン」を押すことで機能が追加されます。機能としては、タブを増やすボタンがUnity上部に用意され、ボタンを押すとそのときに開いていたInspectorがタブとなって追加されます。
主な用途としては、これまでInspectorのロック機能を使っていた複数のオブジェクトをまたがっての操作をするときに使えるでしょう。
オブジェクトのオンオフをボタンで管理
「Preference」の「lilEditorToolbox」項目で「オブジェクトのオンオフ」にチェックを入れると、Hierarchyにオブジェクトのオンオフを設定できるチェックボックスができます。
この他にもコンポーネントのアイコン表示などの機能もあるので、自分の好きなように設定してみてください。
オブジェクトの整理に使える 「ObjectMaker」
「ObjectMaker」は、Hierarchy上に色を付けて視覚的に見やすくする機能です。
「Preference」の「lilEditorToolbox」項目で「ObjectMarkerの背景色を適用」にチェックを入れたうえで、空のGameObjectに「ObjectMarker」のコンポーネントを付けましょう。
コンポーネントを付けたら完了です。色はコンポーネントから変更できます。
アバター改変の途中経過はこれで見せるといいかも？
Scene Viewの高解像度キャプチャツール
「Scene Viewの高解像度キャプチャツール」では、普段アバターが見えているScene Viewに表示されている画面を高解像度でキャプチャしてくれます。選択中の特定のオブジェクトのみを透過して出力することも可能です。
このツールは、「Tools」の「lilEditorToolbox」から「Scene Capture」を選択することで使えます。
アバター改変の途中経過をはじめ、Unity上で撮影したい場合は気軽に使いましょう。
小回りの効く調整ができる！ PlayModeでの変更を保存
動作確認のためにPlayModeで数値を調整したけども、PlayMode終了後にもう一回設定し直すのが面倒。そんなときは、PlayMode中に該当のコンポーネントにあるハンバーガーメニューにある「Save changes in PlayMode」を押せば保存できます。
それ以外の便利機能についてはドキュメントをご確認ください。
ExpressionMenuの確認はこれを使え！ 「Gesture Manager」
「Gesture Manager」はすでにVCC内に入っているツールです。Manage Packagesから「Gesture Manager」を追加してください。
プロジェクトを開き、Toolsから選択、Prefab からPlay-Modeを選択するとExpressionsメニューのテストができます。
今回紹介したツールはいずれもかなり便利なツールです。また、今回紹介したこと以外にも出来ることが多くあります。気になる人は公式ドキュメントを読んで、もっと使いこなしてみてはいかがでしょうか？
ちなみにVCCを使って導入したツールは、非公式互換ツール「ALCOM」を使うと一括でアップデートができるなど便利です。気になる人は下記の記事から導入してみてください。
●参考リンク
・ModularAvatar
・AvatarMenuCreater for Modular Avatar（BOOTH）
・liltoon
・UnlitWF_Shader
・AvatarOptimizer
・VRCQuestTools（BOOTH）
・FaceEmo（BOOTH）
・lilycalInventory
・TexTransTool
