【完全版】BlenderやFBXのモデルをVRChatで使おう！

:warning: 注意事項
==================
- Quest用のモデルは非常に制限が厳しいため、この記事では解説していません。
- モデルによっては、VRChatに対応したボーン構造になっていないなどの理由で、この記事の手順ではアップロードが出来ない場合もあります。
- VRChatは修正不能な脆弱性により、モデルのデータを第三者が盗める状態になっています。もちろんそのような行為は規約により禁止されていますが、モデルデータをアップロードする際はその問題を認識したうえで行ってください。
- VRChatへのアップロードは、データの転載に当たります。あらかじめデータの権利関係・ライセンスをご確認ください。

VRChat側の操作
==============
VRChatのインストール
--------------------
もしまだVRChatをインストールしていなければ、以下のページにある「**ゲームをプレイ**」(緑色の) ボタンを押して、インストールしておきます。

Steam：VRChat
https://store.steampowered.com/app/438100

VRChatのアカウントを作成
------------------------
VRChatのアカウントには、まぎらわしいですが **「VRChatアカウント」** 以外に、初めてSteamなどのアカウントでログインしたときに自動作成されるアカウント (以下、「Steamアカウント」) が存在します。

アバターをアップロードするには、 **「VRChatアカウント」** をWebページから作成する必要があります。手順については以下の記事をご参照ください。

https://www.proustite.com/archives/4374

セキュリティを強化するため、「Steamアカウント」の作成と統合も推奨します。

:::note alert
統合後も「Steamアカウント」自体は残り続けて検索などでヒットし、VRChatのシステムの都合上削除もできないのでご注意ください。

初めてSteamでログインする前にSteam自体のプロフィール名をランダムな文字列にしておくことで対策は可能です。
https://twitter.com/esperecyan/status/1218387883326767104
※すでに「Steamアカウント」が自動作成されてしまっている場合は検索で引っかかる問題への対策は不可能
:::

アカウントの信用ランクを上げる
------------------------------
VRChatでは、アカウントごとに5段階の **Trust Rank** (信用ランク) が設定されています。これが **Visitor** の場合、アバターのアップロードができません。

自分のランクは次の手順で確認できます。

1. メニューを出します。
2. 右上のメインメニューボタンを押します。  
   ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30177/788323e1-f1d2-635f-b081-1e945941c5ac.png) 
3. 下の左から3番目のProfileタブを開きます。
4. 右上の **TRUST LEVEL** という項目がランクを表しています。   
   ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30177/f788b0f6-9a98-de44-2b87-1062af683452.png)

このランクは、VRChatをプレイしていくうちに変わっていきますが、単純にプレイ時間が増えると変わるものではなく、さまざまな条件 (※具体的な内容は非公開) で変わります。

たとえば初心者向けのVRChatツアーのように、いくつかのワールドをめぐるようなツアーに参加し、最初に何人かとフレンドになってもらえれば、ツアーが終わる頃には **New User** になるでしょう。

VRChat Creator Companionのインストール
===========================
VRChatへのモデルデータ (以下、アバター) のアップロードは、Unityエディタを使って行うことになっています。VRChat Creator Companionは、VRChatに関するUnity補助ツールです。

1. 以下のページを開き、「**Download the Creator Companion**」ボタンを押してVRChat Creator Companionを入手します。
   https://vrchat.com/home/download/
1. ダウンロードしたインストーラーを実行します。
1. VRChat Creator Companionを起動します。
1. Unity Hub、VRChat SDKが対応したUnityがインストールされていなければ、インストールするためのボタンが表示されるので、インストールします。

VRChat SDKの導入
================
1. VRChat Creator Companionで、左側メニューの「**New**」をクリックします。
1. 「**Avatar**」をクリックします。  
   ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30177/464ad9f7-e5d4-0488-ca1c-586ffd862a20.png)
1. 右下の「**Create**」ボタンを押します。  
   ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30177/60d414e6-eb3c-aa30-ba9f-0f616c6b8c87.png)
1. 「**Open Project**」で作成されたUnityプロジェクトを開きます。

※再度開くときは、左側メニューの緑色の「**Projects**」をクリックし、プロジェクト名をクリックすることで、「Open Project」ボタンがある画面を開くことができます。  
![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30177/65627455-af33-eeed-c282-82aceec033d1.png)

アバターのVRM化
===============
これ以降は、schwarz式かばん (※「かばん」はけものフレンズのキャラクター) を例として使わせていただきながら、解説を進めます。

VRM Converter for VRChatの導入
------------------------------
『VRM Converter for VRChat』は、VRMとVRChatに適したオブジェクトとを相互変換するUnityエディタ拡張です。

1. 以下のURLから「インストーラー」を入手します。  
   https://pokemori.booth.pm/items/1025226
2. ダウンロードしたファイルを展開 (解凍) します。
3. 展開した「VRM Converter for VRChat Installer.unitypackage」を、**Assets** にドラッグ&ドロップし、「Import」します。  
   ![](https://qiita-image-store.s3.amazonaws.com/0/30177/0feb2fbc-7110-3aab-2a3a-4b5220720fd5.png)
4. **ウィンドウ上部のメニューに「VRM0」が表示されない場合は、いったんUnityを最小化、または再起動してみてください。**
5. 「Importing a scoped registry」というダイアログ (レジストリが追加されたことの通知) が開いた場合、ダイアログの「Close」ボタンを押して閉じます。  
   ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30177/73880b80-f731-dbe9-3080-2c619dcd1697.png)
6. 「Recommended project settings for UniGLTF/UniVRM」(UniGLTF/UniVRMが推奨するプロジェクト設定) と書かれたウィンドウが開いた場合は、ウィンドウの一番下の「Accept All」というボタンを押します。ウィンドウの表示が「Thank you!」に変わるので、「Close」ボタンを押します。  
   ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30177/02f49c81-3938-b1eb-5938-3a5358807568.png)
7. Package Settingsウィンドウが開いている場合は、「×」で閉じます。

アバターの正規化
----------------
1. テクスチャをAssets内の好きなフォルダにドラッグ&ドロップします。  
   ![](https://qiita-image-store.s3.amazonaws.com/0/30177/5cc02341-cd11-3c2d-acef-33912cc8776b.png)
2. blendファイル、もしくはfbxファイルなどをAssets内にドラッグ&ドロップして、インポートが完了するのを待ちます。  
   ![](https://qiita-image-store.s3.amazonaws.com/0/30177/b3c5bd74-c266-8678-dcf3-c6ad100489ee.png)
3. Assets内のblendファイルを選択し、右のInspectorの __Rig__ タブを選びます。
4. __Animation Type__ で **Humanoid** を選択し、すぐ右下の **Apply** ボタンを押してしばらく待ちます。  
   ![](https://qiita-image-store.s3.amazonaws.com/0/30177/96ea805b-b461-005a-a6ab-7b67493382f0.png)
5. すぐ上の **Configure** ボタンを押すと、シーンを保存するかどうか聞かれるので、適当な名前を付けて保存します。  
   ![](https://qiita-image-store.s3.amazonaws.com/0/30177/56309c27-685b-8028-0d3b-ab215a1bbb70.png)
6. ヒト形アバターのボーンとして、誤った関連付けが行われていれば修正します。
   特に「Head」の「Jaw」(あご) は、ほとんどの場合前髪などに関連付けられてしまっているので、「None」にしておきます。
7. **Done** ボタンを押してもとに画面に戻ります。ボーンの関連付けを修正していた場合、適用するか聞かれるので、**Apply** ボタンを押します。  
   ![](https://qiita-image-store.s3.amazonaws.com/0/30177/48b73086-8704-5476-b6ce-2a2b876a3d2f.png)
8. Assets内のblendファイルを、ウィンドウ左上のHierarchyにドラッグ&ドロップすると、ウィンドウ真ん中のSceneにアバターが配置されます。
9. Hierarchyのコンテキストメニュー (右クリックメニュー) から、 **3D Object** → **Cube** と選択すると、1Unit (1m) 四方の立方体が出てくるので、こういったものを参考にアバターの **Scale** を調整します。  
   ![](https://qiita-image-store.s3.amazonaws.com/0/30177/5c51e388-2cc6-d9fe-4eec-957f12715f8d.png)
10. Hierarchyのアバターを選択した状態で、上の __VRM__ メニューから、**UniVRM** → **Export humanoid** を選択します。  
   ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30177/6bc6fc19-adcd-45df-fbc6-37b0a63b5275.png)
11. 「VRM Exporter」というダイアログが開くので、 __Settings__ を展開し、 **Author** を入力します。
12. **Export** ボタンを押して、Assetsフォルダ内に保存しすると、同時にインポートが始まるのでしばらく待ちます。  
   ![](https://qiita-image-store.s3.amazonaws.com/0/30177/3dde0e32-dba6-8a2b-b13e-aa675f2be2e2.png)

シェーダーの設定
----------------
1. Hierarchy上にあるものを片づけて、インポートで生成されたAssets内のプレハブ (○○○○.vrmの隣の○○○○.prefab) をHierarchyへドラッグ&ドロップします。
2. 「○○○○○.Materials」というフォルダを開くとマテリアルが展開されているので、Ctrl+Aですべて選択し、右のInspectorの __Shader__ を **VRM/UnlitTexture** に切り替えます。  
   ![](https://qiita-image-store.s3.amazonaws.com/0/30177/ae2fb09f-1610-b167-39b0-182a8a57d24c.png)
3. 見た目がおかしいときは、他の __VRM__ や __UniGLTF__ のシェーダーも試してみます。  
   ![](https://qiita-image-store.s3.amazonaws.com/0/30177/fa8f5d24-c75f-a2ec-da3d-5c27ab0cabc6.png)

※ここで紹介している設定は、多くのモデルで破綻しづらいと考えられる一例です。

表情の設定
----------
1. Assetsのプレハブを選択した状態で、Inspectorをスクロールしていくと、「VRM Blend Shape Proxy」というのが出て来るので、そこの「Blend Shape Avatar」の右のところをダブルクリックします。  
   ![](https://qiita-image-store.s3.amazonaws.com/0/30177/67c97dfc-a7f8-f381-b512-5840e70a6380.png)
2. BlendShapeの設定画面が表示されるので、下の方に表示されているシェイプキーを調整して、次のように設定していきます。

| プリセット | 選択するもの           |
|------------|------------------------|
| A          | リップシンク用の「あ」 |
| I          | リップシンク用の「い」 |
| U          | リップシンク用の「う」 |
| E          | リップシンク用の「え」 |
| O          | リップシンク用の「お」 |
| BLINK      | まばたき               |
| JOY        | 喜                     |
| ANGRY      | 怒                     |
| SORROW     | 哀                     |
| FUN        | 楽                     |

![](https://qiita-image-store.s3.amazonaws.com/0/30177/b9ba7038-bbeb-aa18-6037-c61cb603d19d.gif)

視点の設定
----------
1. Hierarchyでアバター選択すると、視点の位置を変更するための、根元に「FirstPersonOffset」と書かれた3本矢印が頭のところに表示されます。
2. 矢印をドラッグして、3本矢印の根元がちょうど目と目のあいだに来るように、上下の位置と前後の位置を調整します。
3. Inspectorの右上にあるプルダウンメニュー「Overrides」 をクリックして、「Apply All」ボタンを押します。
  ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30177/da51caf4-2509-9b56-25b7-d558ed8d48c2.png)

VRChatへアップロード
====================
VRChat用に変換
--------------
1. Assetsのプレハブを選択した状態で、上の __VRM__ メニューから、 **Duplicate and Convert for VRChat** を選択します。  
   ![](https://qiita-image-store.s3.amazonaws.com/0/30177/3a153ef0-87fc-96a1-921b-7b8a109b5978.png)
2. 「VRM Converter for VRChat」というダイアログが開くので、右下の **複製して変換** ボタンを押します。
   ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30177/498970bc-6a04-326f-9aae-99191bdef696.png)
3. 保存先をたずねるダイアログが開きますが、そのまま **保存** ボタンを押してしばらく待ちます。  
4. 正常に変換が完了すると、「変換が完了しました。」というメッセージを含むダイアログが表示されます。  
   ![](https://qiita-image-store.s3.amazonaws.com/0/30177/f53d4b4f-0743-2011-686c-9047167590de.png)

VRChat SDKへログイン
--------------------
1. 上の __VRChat SDK__ メニューから、 **Show Control Panel** を選択します。
2. 「VRChat SDK」というウィンドウが開くので、「Authentication」タブでUsername、またはメールアドレスとパスワードを入力して **Sign In**  
   ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30177/8a084528-5a56-50bc-d622-10841cde626c.png)
3. 「Avatar Creator Status: Allowed to publish avatars」と表示されているのを確認します。  
   ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30177/ff442562-b122-ffba-831b-23a39df59154.png)

アップロード
------------
1. 上記ウィンドウで、「Builder」タブを開き、右下の「**Build & Publish**」をクリックしてしばらく待ちます。
2. 中央の「Game」ウィンドウにアップロード画面が表示されるので、画面上で指示されている手順に従ってアップロードします。  
   ![](https://qiita-image-store.s3.amazonaws.com/0/30177/db2557b9-adf5-4122-8eab-1ca4bb0ac2e1.png)
3. 正常にアップロードが完了すると、「Upload Comlete! Launch VRChat to see your uploaded content.」というダイアログが表示されます。  
   ![](https://qiita-image-store.s3.amazonaws.com/0/30177/47aa247e-6da7-e5ff-8425-88d8853b803f.png)

フィードバックサイトへ投票のお願い
==============================
VRChat SDKが対応しているUnity 2019.4は、すでにUnity Technologiesのサポートが終了しており、同バージョンはUniVRMでサポートされていません。
VRChatはCannyというサービスを利用してフィードバックサイトを開設しており、Unity 2021.3へのアップグレード要望が投稿されています。

https://twitter.com/esperecyan/status/1596684695026421760

また、VRM対応の要望も投稿されています。

https://twitter.com/butadiene121/status/1033392342806364160

ぜひ各投稿へ vote (投票) をお願いいたします。

投票の仕方
--------
1. 上のツイート内のCannyへのリンクを開きます。
1. **LOG IN TO VRCHAT** ボタンを押します。  
   ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30177/3153537c-6e84-e0a5-bebd-100d6abdf155.png)
1. VRChatのログインページが出てきたらログインします。
1. 「Canny Would Like to Connect to Your VRChat Account」という、Cannyからの連携を許可するか確認するページが表示されるので、**Yes!** ボタンを押して連携を許可します。  
   ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30177/6357f7b9-fc9e-e9b4-2c0b-677963d2c878.png)
1. 数字が書かれたボタンを押してvote (投票) します。数字の上の △ が青色になればvote完了です。  
   ![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/30177/838429fc-0018-3cb2-aa39-cdafd7a1f3f8.png)