簡単なパズルができるワールドを作ってみよう（１）(ある程度設定済みのUnityPackage配布あり)

# 早く作りたい方へ

### [UnityPacakgeダウンロード先](https://www.dropbox.com/scl/fi/ey9x20xtlxxm4wy2ivzdv/_01a_PuzzleBase.unitypackage?rlkey=odx2fiwh5bq871hbhu22c4djb&dl=0)

1. VCCからUnity 2019 World Projectを選択して新規プロジェクトを作成
1. 上記でダウンロードしたUnityPackageをimport
1. Prefab◯◯をHierarchy上にドラッグ＆ドロップ
1. Packages→VRChat SDK- World →Samples→UdonExampleScene→PrefabsからVRCWorldという名前のPrefabをHierarchy上にドラッグ＆ドロップ
1. ログインしてワールド名、ワールド画像を設定してアップロード

以上です。
文章にするとわかりにくいので、スクリーンショットを交えて書いていきます。
<b>上記の説明で分かった方は、多分下の説明は必要ないんじゃないかなと思います。</b>

# 以下、ちゃんとした説明

今回作るワールドは「<b>エリアにオブジェクトを入れたらテキストが変わる</b>」ワールドです。

頻繁に使用するギミックで、「テキストが変わる」の部分を修正すれば
色々なギミックに応用できますね。

では、順番にやっていきましょう。

## 1.プロジェクトの作成
![00_VCC.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/031947fb-05a0-1dec-6366-3d21e9e31722.png)
1.右上のCreate new projectをクリックしてください。
***
![01_VCC.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/308b03ae-3401-cfd2-9571-97a0d017cdcf.png)
今回は2019を使用するので、Unity 2019 world projectを選択してください。
青色の枠の内部は、プロジェクトの名前とフォルダの場所なので、自身の好きな場所に作成してください。
***
![03_VCC.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/44af80d8-bfc5-a7f3-3538-dc7c25454ab7.png)
2.プロジェクトの作成が終わったら、赤枠のOpen projectでプロジェクトを開いてください。

***
![04_Unity.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/d53b4d6d-4170-b2fd-964d-9b8c4a6047da.png)
【確認】こんな感じの画面になります。(下の部分は気にしないでください)
***
![05_import.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/f4fcb35a-44d8-e9ae-198b-463e630b27b8.png)
3.上の部分のAssetメニューからimport package→Custom packageを選択します。
記事一番上でダウンロードしたUnitypackageを選択して、importを行ってください。
***
![06_import.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/b42f902f-a93d-6929-e9ca-f44bb5eafd8b.png)
4.なんかこんな感じの画面になると思います。赤枠の部分をクリックでimportできます。
***
![07_project.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/01921711-a2b8-9fb2-8ad5-11f94736f90a.png)
【確認】importに成功すると、赤枠のフォルダが追加されます。
***
![07_01_project.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/0e316d75-312e-bc1f-bbd4-586454d76432.png)
5.赤枠の位置あたりで右クリック→Create Emptyを選択してください。
***
![07_011_project.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/2d428ec6-881a-07dc-7948-35b0f7c060a2.png)
【確認】GameObjectというものができたと思います。
***
![07_011_project.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/d549cc7a-9c18-7f4d-7a89-903a31a5f681.png)
6.オレンジ色の枠の部分()クリックして選択状態にしたあと、右上の赤枠の位置の文字を編集して、名前を変更します。今回は「Base」としておきます。
名前は何でも問題ありませんが、全角の名前をつけるのは避けたほうがいいかもしれません。
***
![07_02_project.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/b0923652-bae7-8257-2dc5-c0ed028cf873.png)
【確認】編集が終わると、名前が変わります。
***
![08_01_prefab.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/0d8a7269-1d5d-294e-2b31-3f4ccbda43e5.png)
7.オレンジ色のオブジェクトを選択し、赤色の枠内(position)を編集します。
***
![09_pos.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/23854e96-f737-348c-781e-e8439736484d.png)
8.x,y,zすべてを0にしてください。
***
![11_prefabSet.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/c4f16356-db1e-a67c-2a33-29177e2b9154.png)
9.先程importしたPrefabを、作成したBaseの上にドラッグ＆ドロップしてください。
***
![12_unpack.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/ef1b4bb1-27ad-040f-c8b1-b5936e251d01.png)
10.ドロップしたPrefabの上で右クリックし、「Unpack prefab completely」を選択してください。
***
![13_unpackFinish.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/a3a3f204-f4c6-04c2-c195-f272512d608f.png)
【確認】Hierarchy上のアイコンが図のように変わればOKです。
***
![14_VRCWorld.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/ebbb1ca2-49a2-3053-e6da-f4f5fde63df2.png)
【確認】オレンジ色のPath(フォルダの位置)の、赤枠がワールドアップロードに必要なオブジェクトとなります。(VRCWorldといいます)
この場所にあると思いますが、なかった場合は黄色の検索ウィンドウに【VRCWorld】と打ち込めば表示されると思います。
***
![14_VRCWorld.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/1715f156-eab9-bc75-6479-296ba0719eee.png)
11.【VRCWorld】をHierarchyの【Base】にドラッグ＆ドロップします。
<b>ワールドのセットアップは以上です。</b>
***
## 2.ワールドのアップロード(要　UserランクNew User以上)
![15_login.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/d5c3de9c-0489-93ca-c8ec-9c1340c5d92c.png)
恐らく最初から緑色のタブ(VRChat SDKタブ)が表示されていると思います。
無ければ上のメニューからVRChat SDK→Show Control panelの順に開くと表示されます。
1.<b>Authenticationから、User nameとPasswordを入力してください。</b>
これはSteamやWeb上でVRChatにログインするものと同じです。
ワンタイムパスワードを設定している方はこのあとに表示されるのでそれも入力してください。
![16_login.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/17fcefe4-bd6b-de68-fe48-07e7cb8898f0.png)
【確認】ログインに成功するとこんな感じの画面になります。
![16_login.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/bc459abc-6156-ebde-54ef-a1914ccb42db.png)
2.この状態で赤枠のタブをクリックしてください。
![17_upload.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/f6e74745-55ed-2e5f-c1c6-74c2970b58cf.png)
こんな感じの画面になります。
***
![17_upload.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/7bcd6132-4884-4353-e4af-aff088791a33.png)
3.赤枠にワールド名を入れてください。好きな名前でいいですが、全角文字は直接入力できないようなので、全角文字で入力する場合は一旦コピーしてからペーストしてください。
***
![18_upload.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/58b6fb55-d005-feb4-4912-d1259854e871.png)
4.サムネイルの設定をします。赤枠の位置をクリックしてください。
(オレンジ色の枠をクリックした場合は、自分の保存している画像からサムネイルを選択できます)
***
![19_upload.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/cbdbd0e4-fbec-166b-bc13-9975a4caad89.png)
オレンジ色の枠内にサムネイル画像がキャプチャされます。
5.今回はサムネイルは重視しないので、赤枠をクリックして確定してください。
***
![20_upload.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/17b8ecca-08a0-fbd2-2d22-cf4e03f09ef4.png)
6.赤枠の位置をクリックしてください。
***
![21_finish.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/f8ff22a7-d59d-4712-83b8-0c14fd853c8c.png)
7.赤枠の位置をクリックすると、アップロードが開始します。
***
![22_uploaded.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/0abd76fb-5e52-e342-8681-4e7c1df5cd3d.png)
【確認】右下に図のような表示が出ていて、左下にエラーメッセージが出ていなければ、アップロード完了です。
お疲れ様でした！

※後日追記しますが、ここまででもワールドのアップロードは可能なので、一旦公開します。

## 3 ギミックの初期設定などを自分でやる場合

多分上の説明である程度はやり方などがわかったと思いますので、説明を簡略化していきます。今回は一部のオブジェクトが初期状態のままにしてあるので、その設定と、設定済みの部分はその確認をしていきます。
事前に以下のファイルをダウンロードしてください。先程のUnityPackageからギミックを取り去ったものになります。
### [UnityPacakge2ダウンロード先](https://www.dropbox.com/scl/fi/8i5g99lfgou7l16gf1pm8/_01x_PuzzleBase_nogimic.unitypackage?rlkey=ph433qjobrz9k3y9k2wqgl9df&dl=0)
![001_hide.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/59533b11-764b-deb0-8393-ecb7da120b5b.png)
1.<b>この記事で使用したプロジェクトをそのまま使用します。</b>
オレンジ色の枠のオブジェクトをクリックで選択して、赤枠のチェックボックスをクリックしてチェックを外してください。
***
2.【3】で記載した手順に従って、ダウンロードしたUnityPackageをimportしてください。
***
 ![002_prefab.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/76368189-96c6-b62e-d196-131eb1af3581.png)
3. 【Base】に、先程importした【_01x_base_nogimic】をドラッグ＆ドロップしてください。
***
![003_unpack.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/ecc595f9-1e9b-c64b-09a6-3b508593ff18.png)
4. オブジェクトの上で右クリックして【Unpack prefab completely】を選択してください。
***
![004_addcomponent.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/106c00f0-e2c5-1d0f-4cf0-640e0d6c25cc.png)
5. 左側のCubesというオブジェクトを選択して、Inspector(右側)の赤枠【Add Component】をクリックしてください。
***
![005_addcomponent.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/bdb89910-38f7-6b0c-d4f8-3226b3cdcaca.png)
6. 出てきた検索ウィンドウに【VRC pickup】と入力すると、赤枠のような候補が出てくるので、クリックしてください。
***
![006_pickup.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/868c2475-9788-6149-a32f-67b4be67a3fe.png)
【確認】この2つが追加されます。
***
![007_collider.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/d1c6e809-551a-eeb8-16a8-2146b54acd26.png)
7. 同様に【Add Component】→検索ボックスに【Box collider】と入力し、出てきた候補の中から赤枠と同じものを選択してください。
***
![008_collider.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/46064493-92af-0667-0797-e231e3620d55.png)
【確認】右側のInspectorウィンドウにオレンジ色の枠の部分が追加されます。
また、Scene上のCubeに緑色の枠線のようなものが表示されます。
***
![010_trigger.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/161e709b-6b82-f02d-c313-684e3d50cda4.png)
8. 【Area】オブジェクトを選択し、赤枠のチェックボックスにチェックを入れてください。
***
![011_udon.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/8280b380-705f-7939-0448-a8780dd3b97e.png)
9. 【Add component】→検索ボックスに【Udon Behaviour】と入力し、候補の中から【Udon Behaviour】をクリックしてください。
***
![012_udonbehaviour.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/a4701531-8cd3-b47c-62b1-5613cb555050.png)
10. 【_01_JudgeArea.asset】を図の赤枠の位置にドラッグ＆ドロップします。
***
![013_settings.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/87163d80-3d2b-aeb8-3b80-056e2f40ed52.png)
11. 赤枠のオブジェクトを図の赤枠の位置にドラッグ＆ドロップしてください。

オレンジ色の枠は、Cubeをエリアに入れたときに表示されるメッセージ(Clear Mes)と、最初に表示されているメッセージ(Default Mes)です。好きな文字を入れてください。
***
![014_upload.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2708808/dea0d708-2db4-f3b7-fa26-670d3e30ba36.png)
12. 赤枠にチェックを入れて右下のBuild and Uploadボタンをクリックしたらアップロード完了です。