VRChat開発メモ（ワールド編、Unity 2018.4.20f1、VRCSDK3）

# はじめに
Udon機能が楽しそうなので再開。メモしながらやっていきます。

# [SDKについて](https://docs.vrchat.com/docs/choosing-your-sdk)
SDKはVRCSDK2とVRCSDK3の二種類あり、最新のVRCSDK3はUdon機能が追加されています。アバターはまだ対応していないみたいです。今回はワールドを作るのでVRCSDK3を用います。また2つのSDKは混ぜるな危険。Unityのバージョンは[2018.4.20f1](https://unity3d.com/jp/get-unity/download/archive)です。

# 開発環境
- Windows10
- Unity 2018.4.20f1
- VRCSDK3（VRCSDK3-UDON-2020.04.25.13.00.unitypackage）
- VRChat
- Steam

# 

# VRCSDK3でワールドを作成

[VRCSDK3](https://vrchat.com/home/download)をダウンロードします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/f302f0b9-c05e-5456-19fd-69e8a24d32b0.png)

Unityを開き、プロジェクトを作成します。

Assets -> Import Packages -> Custom PackagesからダウンロードしたVRCSDK3-UDON-2020.04.25.13.00.unitypackageをインポートします。

<!--
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/d9120b05-bd13-131d-4f25-119b4fe28241.png)
-->

ワールドとなる3Dモデル(.obj)とテクスチャ(.png)をProjectビューのAssetsへD&Dします。
Lanovo Phab2ProのTango Constructorで3Dスキャンしたモデルを使用しています。2018年に作成した古い資料は[こちら](https://www.slideshare.net/satoshibfujimoto/20180516-97289929)です。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/f4a8c812-8c7f-adf8-8988-6a07d9a08444.png)

3DモデルのMaterials->LocationをUse External Materials(Legacy)に変更し、Applyします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/3a688953-bba6-a36c-ae0f-318402c56b14.png)

生成されたMaterials->defaultMatのInspectorビューからAlbedoにテクスチャファイルをD&Dします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/613eb495-98d5-8a23-5f44-1eed236a1f2d.png)

えきまえスペースをHierarchyビューにD&Dして、InspectorビューのTransformを調整します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/470210db-a8db-ae5a-34fe-7b0080cf6205.png)

Model->Generate Collidersにチェックを入れるか、床にPlaneを置きます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/69c72567-0a5e-e7ad-f4ed-8e03ff9c6236.png)

透明のマテリアル（Materials->Transparent）を作成し、PlaneのMaterialに適用します。※Render ModeをFadeにしてAlbedoの右側のColorを選択すると、RGBAの設定ウィンドウが開くのでA（アルファ値）を0にします。下記の画像はミス。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/82fa5418-0f9a-2f64-de98-373634579fbb.png)

Planeからはみ出すと落ちますｗ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/bae15b19-a94e-a1fa-acf1-cba92eacfcaf.png)

ProjectビューからVRCWorldを検索し、Hierarchyビューに置きます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/51c3fbb2-72b9-19b2-34c8-de44220accb4.png)

上のメニューからVRChat SDK -> Show Control Panelを開き、VRChatアカウントでログインします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/8658676d-ee58-eb2d-f9ed-b5e85f98c0f1.png)

StatusがAllowedになっていたら、ワールドやアバターをアップロードできます。Allowedになるためには、VRChatで遊ぶ必要があります。（友達作るといける）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/a6a682b7-5ff1-5b4f-55dd-0787f478f7b6.png)

Builderを開き、Setup Layers for VRChatをクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/e4e810bc-2e5c-08f9-905a-41e26a21ce9e.png)

Do it!をクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/4219708a-0419-8b4a-0dd9-7713190d5a65.png)

Set Collision Matrixをクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/aa05c6bc-4aab-73fa-e109-b335b1b24a72.png)

同様にDo it!をクリックします。

lightmapをAuto Fixします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/9c41d6d5-3940-478b-235a-81472e5843de.png)

Generate Lightingをクリックすると、警告が出なくなりました。（よくわかってない
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/b29fdd92-0867-04d6-4d37-6a4085963dae.png)

Build&Testをクリックし、ローカルでチェックしましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/984b3e31-d04d-e530-24e2-d8ba032e0040.png)

できました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/e1da411e-fb76-5fa3-2445-6420558d029d.png)

Escキーでメニューを開き、下にあるEXIT VRChatで終了できます。

Build&PublishからVRChatへアップロードしましょう！
Community Labsにアップロードすると公開されて誰でもアクセスできるようになります。
ワールドのプレビュー画像を変更するには、HierarchyにあるVRCCamの位置を調整してください。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/e84d03de-fffd-8ebd-8fc4-c7b4765fdce0.png)

アップロードできたようです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/e58b95a0-0b9c-b356-f019-1b7e41944373.png)


Manage World in Browser をクリックすると、ワールドの情報が見れます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/f82aa7a2-4f41-657b-49c1-a7d325631e38.png)

Community Labsに表示された！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/cf75c1b4-f78a-489a-3d5e-f4e89b7042de.png)

わーい！

VRCCamの位置を修正しました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/bfc96c97-db1c-39f4-3c95-302d67d7912c.png)

Uploadしたら、Community Labsもすぐ更新されるようです！今のところ週に1回しか新しいワールドをアップロードできないので注意。

# 鏡を設置する
ワールドで最初に欲しいのが鏡です。自分のアバターを確認したいから。
ProjectビューでVRCMirrorを検索し、HierarchyビューにD&Dし、好きなところに配置します。
以前は、紫色が見える面が鏡だったのですが、すでにSceneビューに反映されてました。感動！

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/ebc7ad31-4534-245c-465d-5940c787bcaf.png)

# 椅子を設置する
ProjectビューでVRCChair3を検索し、HierarchyビューにD&Dし、配置します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/f333696a-e1e7-63e9-88d3-99dfa90425e0.png)

VRCChair3のマテリアルをTransparentにします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/6d99bf28-f09b-a577-4f40-77da01345189.png)

Ctrl+Dで複製し、3つ配置しました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/63863/30ee31de-7c40-1277-b44d-4f174dc0d8a8.png)


# まとめ
VRCSDK3を用いて、VRChatに自分のワールドを作成しました！
リアルバーチャルえきまえスペースに遊びに来てくださいね！

<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">とりあえずリアルバーチャルえきまえスペースを公開した！<br>Planeを敷いただけの初期バージョンwww 遊びに来てね～<a href="https://twitter.com/hashtag/VRChat%E3%81%AF%E3%81%98%E3%82%81%E3%81%BE%E3%81%97%E3%81%9F?src=hash&amp;ref_src=twsrc%5Etfw">#VRChatはじめました</a> <a href="https://twitter.com/hashtag/VRCSDK3?src=hash&amp;ref_src=twsrc%5Etfw">#VRCSDK3</a> <a href="https://twitter.com/hashtag/VRChat?src=hash&amp;ref_src=twsrc%5Etfw">#VRChat</a> <a href="https://twitter.com/hashtag/%E3%83%95%E3%82%A9%E3%83%88%E3%82%B0%E3%83%A9%E3%83%A1%E3%83%88%E3%83%AA?src=hash&amp;ref_src=twsrc%5Etfw">#フォトグラメトリ</a> <a href="https://twitter.com/hashtag/3D?src=hash&amp;ref_src=twsrc%5Etfw">#3D</a> <a href="https://twitter.com/hashtag/Reconstruction?src=hash&amp;ref_src=twsrc%5Etfw">#Reconstruction</a> <a href="https://twitter.com/hashtag/MadeWithVRChat?src=hash&amp;ref_src=twsrc%5Etfw">#MadeWithVRChat</a> <a href="https://t.co/3myQ8cGSUC">https://t.co/3myQ8cGSUC</a></p>&mdash; 藤本賢志(ガチ本)@pixivFANBOXはじめました (@sotongshi) <a href="https://twitter.com/sotongshi/status/1256254030587674625?ref_src=twsrc%5Etfw">May 1, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>


# 参考文献
https://docs.vrchat.com/docs/worlds