![見出し画像](https://assets.st-note.com/production/uploads/images/113349850/rectangle_large_type_2_0f1833185e825be785ef797ae32c0485.png?width=800)
VRChatでワールドを作る(3) ワールドを装飾する
はじめに
前回は、最小限の要素で構成されたワールドを作成しました。
今回はそれに装飾を加えて、少しそれっぽくしていきます。
また、オブジェクト(3Dモデル)の基本的な編集方法(移動、拡大縮小、回転)についても学んでいきます。
環境
Windows 11
VRChatのDesktopモードが動く程度のPC
Unity 2019.4.31f1
前回のシンプルなワールド
この記事でやること
Unityエディタ上での基本操作(オブジェクトの変形)についておさらいする
アセットストアからアセットを入手し、ワールドに配置する
Unityツールバーボタンの役割
Unity Editorでは、オブジェクトを操作するためのツールが用意されています。
オブジェクトを動かしたり大きさを変えたい場合、適したツールに切り替えながら操作することが必要です。
![](https://assets.st-note.com/img/1691979536753-h6ypqY3GjX.png)
左から順に見ていきます。
1.ハンドツール
ハンドツールを有効にした状態でシーンを左ドラッグすると、視点の移動ができます。
2.移動ツール
移動ツールを有効にした状態でオブジェクトを選択すると、オブジェクトに矢印型のガイド(このような道具のことを「ギズモ」と呼びます)が表示されます。
![](https://assets.st-note.com/img/1691982375125-PnGIQOD3p2.png)
先端の矢印型をしたギズモをドラッグすることによって、一方向にのみオブジェクトを移動することができます。
![](https://assets.st-note.com/img/1691988585195-VQpvjIM7fr.png)
また、中央の「面」のギズモをドラッグすると、その面に沿ってオブジェクトを移動することができます。
(選択すると、移動できる方向の矢印がアクティブになりますので目安にできます)
3.回転ツール
回転ツールを有効にした状態でオブジェクトを選択すると、オブジェクトに円形のガイド(ギズモ)が表示されます。
![](https://assets.st-note.com/img/1691982495968-l2rG2PG670.png)
ギズモをドラッグすることによって、オブジェクトを軸に対して回転させることができます。
4.スケールツール
スケールツールを有効にした状態でオブジェクトを選択すると、オブジェクトに四角いつまみが付いたガイド(ギズモ)が表示されます。
![](https://assets.st-note.com/img/1691982653703-snOLDvtgNk.png)
ギズモの先端をドラッグすることによって、一方向にのみオブジェクトを拡大・縮小することができます。
![](https://assets.st-note.com/img/1691988671605-YaYM6jU4Gg.png)
中央の四角のギズモをドラッグすることにより、全方向にオブジェクトを拡大・縮小することができます。
5.矩形ツール
矩形(くけい)ツールを有効にした状態でオブジェクトを選択すると、オブジェクトに丸いつまみが付いたガイド(ギズモ)が表示されます。
![](https://assets.st-note.com/img/1691988784756-wvxNEuEvN6.png)
丸いギズモをドラッグすることにより、その平面方向にオブジェクトを拡大・縮小することができます。
これはスケールツールの動きと似ていますが、2つのことを1度にできますので、うまく使えば作業効率の向上になりそうです。
6.トランスフォームツール
トランスフォームツールを有効にした状態でオブジェクトを選択すると、オブジェクトに「移動・回転・スケール」のガイド(ギズモ)が表示されます。
![](https://assets.st-note.com/img/1691989150593-z5Vnccnkjz.png)
わざわざ「移動・回転・スケール」を切り替える手間なく、一度にできる便利ツールです。
ただし、間違えて違うギズモを触ってしまって大惨事になることもありますので、使いどころを見極めた方がよさそうです。
ワールドの改造
前置きが長くなってしまいましたが、ワールドの改造へ取り掛かりたいと思います。
これからやりたいことは以下の通りです。
地面の拡張。
地面を広くして、行動できる場所を広げます。追加オブジェクトの配置。
真っ平で何もないのはさみしいので、なにかしら物体を置いて飾ってみます。
また、アセットストアから既製品の物体を取り込んで配置してみます。
前述のUnityツールの切り替えや、ギズモの操作を行いますので
必要に応じて振り返ってみてください。
地面の拡張(拡大・縮小の操作)
まず、地面を広げて物体を置けるスペースを確保してみましょう。
ツールバーで「スケールツール」に切り替えて、地面であるPlane(平面)オブジェクトを選択します。
![](https://assets.st-note.com/img/1691996170600-L2IOd9DJBK.png?width=800)
続いて、Planeオブジェクトのスケールギズモをドラッグし、ぐいぐいっと引き延ばします。
![](https://assets.st-note.com/img/1691996322088-L18T65KxwF.png?width=800)
面積を広げたら、試しにローカル環境でテストをしてみましょう。
メニューから「VRChat SDK > Show Control Panel」を選択してSDKウィンドウを開き、「Builder > Local Testing > Build & Test」をクリックします。
![](https://assets.st-note.com/img/1691996421107-D2j6mca2hm.png?width=800)
前回に比べて、歩き回れる面積が広くなっているはずです。
![](https://assets.st-note.com/img/1691996658758-zxllhPHOuI.png?width=800)
シンプルなオブジェクトの配置
続いて、シンプルなオブジェクトをいくつか置いてみます。
正方形の配置
基本的な図形として「正方形(Cube)」を置いてみることにします。
「Hierarchyウィンドウ」の空白部分を右クリックし、「3D Object > Cube」を選択します。
![](https://assets.st-note.com/img/1691997165884-cCr23hZDSH.png?width=800)
Sceneウィンドウに新たに正方形(Cube)が現れました。
しかし地面にめり込んでいる状態なので、移動ツールを使って地面の上まで引き上げます。
![](https://assets.st-note.com/img/1691997560177-3EOrQAFvVB.png?width=800)
![](https://assets.st-note.com/img/1691997615903-rBmtkNJRj5.png?width=800)
物体がはっきり見え、地面に影が落ちていることも確認できます。
それでは、もう一度「VRChat SDK Control Panel」を開き、「Builder > Local Testing > Build & Test」をしてみましょう。
![](https://assets.st-note.com/img/1691997797092-nBFPokPdEk.png?width=800)
正方形の召喚に成功しました。
Unity Editor上でいろいろな形のオブジェクトを生成できますので、いろいろ試してみてください。
また、前述のツールバーの各機能を使って、拡大縮小や回転を試してみるのもいいでしょう。
もし、生成したオブジェクトがいらないなと思ったら、それを選択してキーボードの「Delete」ボタンを押すことで消えますので安心してください。
ミラーの配置
続いて、VRChatではおなじみのオブジェクトであるミラーを置いてみましょう。
ミラーは「VRCMirror」という特別なオブジェクトです。
これは今のところ存在しませんので、手動で取り込む必要があります。
まず、下部の「Project」ウィンドウを使って、「VRCMirror」オブジェクトを探します。
「VRCMirror」は、
Packages > VRChat SDK - Worlds > Samples > UdonExampleScene > Prefabs
の下にありますので
「Hierarchyウィンドウ」へドラッグアンドドロップし、取り込みます。
![](https://assets.st-note.com/img/1691999313306-AxKrZgxyDQ.png?width=800)
「Hierarchyウィンドウ」の「VRCMirror」を選択してみます。
![](https://assets.st-note.com/img/1691999406395-OOQfoZFuKA.png?width=800)
「VRCMirror」はシンプルな平面のオブジェクトです。
これも、移動ツールやスケールツール、回転ツールを使って好きなところへ配置してみましょう。
配置が出来たら、また「VRChat SDK Control Panel」を開き、「Builder > Local Testing > Build & Test」をしてみましょう。
![](https://assets.st-note.com/img/1691999758358-DsRDe5I5Rj.png?width=800)
色がないため分かりづらいが、先ほど配置した正方形とアバターが奥のミラーに映り込んでいる。
以上で、ざっくり物体の生成の仕方については終わりです。
お疲れさまでした。
アセットの導入・配置
このままではシンプルすぎてつまらないですよね。
そんなときのために、UnityにはAsset Storeというマーケットプレイスが付いています。
Asset Storeとは、ほかのユーザーや企業が作ったアセット(3Dモデルデータ)を販売しているストアです。
例えるならば、Unity版Pixiv Boothみたいな感じです。
Unityアセットストアへのアクセスと購入
上部のビューのタブから「Asset Store」を選択すると、すぐさまアクセスできます。
![](https://assets.st-note.com/img/1692008834569-GAZP8mgdJj.png?width=800)
さまざまなアセットが販売されていますが、いったん無料のアセットをダウンロードして組み込んでみることにします。
検索欄に「Lite Survival Collection」と入力し、検索結果をクリックします。(おそらく1件しかヒットしないはずです)
![](https://assets.st-note.com/img/1692009490924-RZQww8VpAX.png?width=800)
価格は「FREE」、つまり無料です。
「Download」をクリックします。
![](https://assets.st-note.com/img/1692009603029-8pOwsPqkuf.png?width=800)
ダウンロードが終わると、ボタンが「Import」に変わります。
これもクリックします。
![](https://assets.st-note.com/img/1692009664549-obmwmlStmM.png?width=800)
どのアセットをインポートしますか?と聞いてくるので
とりあえず何も触らずすべてインポートします。
![](https://assets.st-note.com/img/1692009735685-C5VPW8Ucn2.png)
インポートが終わると、下部のProjectウィンドウの「Assets」の下に「Polygon-Lite Survival Collection」のツリーが生まれます。
![](https://assets.st-note.com/img/1692009922573-Y3JhZbPVXs.png)
このアセットのモデルデータは
Assets > Polygon-Lite Survival Collection > Prefabs
に入っています。
アセットの配置
では、実際にアセットを配置してみましょう。
どれでもよいので、モデルデータを「Scene」へドラッグアンドドロップしてみます。
すると、即座にモデルが配置されます。
![](https://assets.st-note.com/img/1692010153248-5fgcseTHuN.png?width=800)
あとは、前述のテクニックを用いて、移動させたり大きさを変えたりして、いい感じに配置します。
![](https://assets.st-note.com/img/1692010552349-EmjkjSeXbw.png?width=800)
配置が出来たら、また「VRChat SDK Control Panel」を開き、「Builder > Local Testing > Build & Test」をしてみましょう。
![](https://assets.st-note.com/img/1692010773680-lvz0H4XX0S.png?width=800)
先ほど設置したアセットがしっかり反映されていることが分かる。
動作テスト
では、実環境でテストしてみます。
「VRChat SDK Control Panel」を開き、「Builder > Local Testing > Build & Publish for Windows」をクリックします。
![](https://assets.st-note.com/img/1692011019060-qommn0qzDY.png)
ビルドが完了すると、自動的にアップロードまで行われます。(同名の場合は上書きされます)
アップロード完了後、実環境からワールドへJoinしてみます。
![](https://assets.st-note.com/img/1692011140229-ZbQrM5aJiN.png?width=800)
![](https://assets.st-note.com/img/1692011288982-UjXBBOI0Qa.png?width=800)
配置したアセットも問題なく表示されています。成功です!
お疲れさまでした
モデルの操作(移動、大きさ変更、回転)を習得することができました。
また、アセットストアからアセットを導入して配置するまでの一連の流れについても確認ができました。
次回は、設置したオブジェクトに干渉する方法について見ていきます。
この記事が気に入ったらサポートをしてみませんか?