VRChatやるならUnityが出来ると楽しそう: アバター改変編

## 読み飛ばす場所

どうも、限界派遣SESのnikawamikanです。

ひとりアドカレ6日目この後書こうと思っている事は決まっているけど今日書くことが思いつかない。
実際、余計な情報を増やす事は検索する側を考えると良い記事が埋もれてしまうのでは？と思う事もありますが、記事を書かなくてはQiitaの運営はQiitanのぬいぐるみをくれません。悲しいね。

なので最近はじめようかなーと思ったVRCでちょこっと触ったUnityについて書いていこうと思います。


## VRChatとは？

まず、VRChatというのはバーチャルリアリティな世界でいろんなコミュニケーションをとりながら遊べるゲームです。

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

自由度が高く、ユーザー投稿されたワールドで遊んだりできるというのが面白くて、自分が作成したワールドで集まったり遊んだりすることができるそうです。

なので、クリエイターにとっては良いユーザーのレスポンスが得られる良い空間だといえます。


そんなVRChatですが、遊ぶためには一定のハードルがあります。

## VRChatを遊ぶための環境

VRCを遊ぶための環境は概ね3パターンに分けられます。

- VR機器 + PC
- PCのみ
- VR機器のみ

### VR機器 + PC

最もきれいな映像でプレイできる構成です。

VRでプレイする場合はハイスペックなPCが求められる傾向にあります。

私の家の環境ですが、

- PC
    - Intel I7 13600KF
    - Nvidia RTX4070Ti
    - メモリ 64GB
- VR機器
    - Quest2

というそれなりに強めなPCなのですが、VRでプレイする場合にはたまーに重くなる場所もあるという話でした[^1]。

[^1]: これはうちに居候している私の同居人が私のPCを借りて実際にプレイした感想

金額的に考えてもPCのみでも30万円で、最低限のVR機器でも8万円程度するイメージなので、ハードルが高いように見えます。

### PCのみ

PC単体で遊ぶ場合はCPU内臓グラフィックで遊ぶこともできます。

居候のPCですが、

- AMD Ryzen5 5600
- Nvidia GTX660
- メモリ 32GB

という構成ですが、わりと快適そうに遊んでいるのでPCだけで遊ぶのであればかなりハードルは低いですね。

また、スペック的にはMacでも参加できそうですが、残念ながら未対応です。マルチプラットフォームに対応できるはずのUnityで対応してくれないのが悲しいですね。

### VR機器のみ

VR機器単体でも遊ぶことができるそうです。

Quest2などは決してハイスぺではないため、かなり重めになるそうです。
また、単体で動作させる際は負荷の低いアバターを表示したりするそうなのですが、アバターが対応していないとそれが表示されないそうです。

## VRChatに対してUnityでやれること

VRCでやれる事は様々ですが、具体的なゲーム内容にはあまり触れません。

主にUnityを使って何ができる？という点に絞って書いていきます。


### Unityで何かするにあたっての制限

VRChatにはトラストランクというものがあり、ゲームを始めて間もなくはフレンドを作らなくてはならないというコミュ障にはつらいハードルがあります。
私はたまたま、VRChat関連をやっているフレンドが多かったので、ほとんどやっていないですが、`New User`になっていました。

詳しくは以下のWikiで書いてくれていますが、最初は`Visitor`というランクから始まるので、Unityでいろいろするためにはフレンドを作って遊ぶハードルがあります。

https://wiki.vrchat.com/wiki/Trust_Rank/ja

### VRChatのSDKの導入

基本的に以下の通り導入をします。

https://creators.vrchat.com/sdk/

**VRChat Creator Companion**(以下VCC)を導入すると、必要なものをインストールしてなど、詳しく教えてくれるのでいわれるがままに導入するのが間違いないです。

上記をインストールして、手順通りに進めると以下の3点がインストールされていると思います。

- VRChat Creator Companion
- Unity Hub
- VisualStudio

### Unityでのアバターをヨシヨシする

私自身エアプなので、同居人がちょうどアバター改変を行うところなので、いろいろ教えてもらいました。

#### プロジェクト作成

まずはVCCから新規プロジェクトでAvatarsを選択してプロジェクトを作成します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/cc284c48-37ab-97d1-8fa8-e5243d4cebe8.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/9b86a58c-b544-ad28-becc-c958471b5398.png)

するとUnityが自動的に立ち上がるので、立ち上がるまで待ちましょう。

#### アバターを追加していく

今回はもち山金魚さんのキプフェルの髪型改変を行っていくそうです。
かわいいね。

https://mukumi.booth.pm/items/5813187

また、今回導入するもち山さんのアバターは基本的に`lilToon`というシェーダーが使われているそうで、キプフェルをアバターを扱う際にも必要なのでダウンロードしておく必要があります。

https://lilxyzw.booth.pm/items/3087170

ダウンロードして解凍すると`jp.lilxyzw.liltoon-1.x.x-installer.unitypackage`というファイルが存在するので、これをダブルクリックすると自動でUnity側のインポートのプロンプトが表示されます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/943b68bb-3277-eff9-79ee-69def337e4b4.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/68515814-5d7a-1a03-4801-0514da6c3fb3.png)

同様に、キプフェルと髪型にも`unitypackage`の拡張子のファイルがあるので、インポートしていきましょう。

インポートが完了したら、下の`Project`タブから`Assets > MOCHIYAMA > Kipfel > Prefab`の順でフォルダを開いていき、`Kipfel`を上の画面の`Hierarchy`にドロップします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/263f7866-3a5f-5699-6252-0016fbb8bd8d.png)

そうするとキプフェルちゃんが表示されます。

まず最初にこのままアップロードしていきましょう。
VRChat SDK 画面を開いてサインインします。見つからない人はUnityの上部の方にある`VRChat SDK`から`Show Control Panel`を押してみてください。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/439480e9-4079-8381-48d1-4da02405fd7e.png)

ログインできたら、`Builder`タブから`Name`を設定します。
`Description`, `Content Warnings`, `Visibility`の設定は今回そのままで大丈夫です。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/87fb1ea9-9b88-54cf-9c29-62b5438eda50.png)

サムネイルを設定します。
`Capture From Scene`を選択すると`Capture`というボタンが出てきて、押すと現在のモデルから直接サムネイルが作成できます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/04119bc6-895e-0647-07b7-e54504e17617.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/1c69b1c3-03ea-47f6-1cca-054124c3870a.png)

`Validations`の項目はめちゃくちゃたくさんエラーのようなものが出てきますが、触らなくても大丈夫だそうです。（めっちゃきになる）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/0a4510af-afdf-c20f-b472-3ce8e5799fc4.png)

`Online Publishing`の下のチェックボックスにチェックを入れて、`Build & Publish`を押すことでVRCにアバターをアップロードすることができます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/58143d05-4171-536d-1d6f-ccef9f87406c.png)

これでキプフェルちゃんが使えるようになります！やったね！

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/1e066c87-c16a-2728-523c-e543e06395ed.png)


#### アバター改変

キプフェルちゃんはこのままでもかわいいのですが、キプフェルちゃんを使ってるユーザーもたくさんいます。なので、アバター改変を行っていって自分のオリジナリティを出していくという事ができます。

今回は髪型を変更するので、現在の髪型を非表示にしていきます。

非表示にしたいものを選択して右の画面から四角形の右にあるチェックボックスをオフにして、`Tag`のドロップボックスより、`EditorOnly`を選択します。
こうすることで、ビルド時に標準の髪型が表示されなくなります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/3cc9f762-b7bd-1859-4893-e71c2f76b2ac.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/f7bd20b9-9546-d804-1a55-079d386b6545.png)

次に追加したい髪型をインポートして、髪型を追加していきます。
今回はこちらの髪型を購入したそうなので、ダウンロードしていきます。

https://yamasakatofu.booth.pm/items/6359671

ダウンロードすると`README`ファイルが存在するので、そこで導入方法を確認して追加していきましょう。


うまく追加できるとこんな感じになります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/fff2c4bf-7f9a-1fd8-0c89-cb71b58f8727.png)

先ほどのアップロード手順を再度行って、キプフェルちゃんをVRCにアップロードすると、髪型が改変されたキプフェルちゃんで遊ぶことができます！かわいいね！

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1239781/b06e2845-87cf-0660-e064-0adf311e964d.png)


## まとめ

本当はワールド作成なども含めていろいろ書いていこうと思ったのですが、長くなりそうなので今回はアバター改変までについて書かせていただきました。
協力してくれた同居人に感謝です。（記事の内容思いつかなくて手伝ってもらいました）

なんとなく中途半端になってしまったので、次回ワールド作成などについても記事にできたらなーと思います。

つづく。