【Unity】GLBファイルを取り込んで簡易Viewerっぽいものを作ってみる

スポンサーリンク

最近、Vtampというサービスで推しのVtuberが3Dメダルやアクスタデータの販売を始めました。
このサービス上で3Dデータを見る事はできるのですが……
折角なら、自分で自由に配置して見れるようにしたいですよね？
そんな訳で、取得した3Dデータを自由に見ることができるViewerを作ってみたいと思います。

スポンサーリンク

まずはGLBの3Dデータを用意

Viewerを作るに当たって、Vtampのデータでサンプルを作るには著作権とか何かあると面倒なので、代わりのデータを用意します。
Vtampで取得できるデータはGLB形式ですので、同じ形式の無料データを用意しましょう。
とりあえず、ここでは無料で取得できる 3DEXPORT – 無料 3Dモデル – House 001 を使ってみることにします。
Googleアカウントがあれば無料で取得出来ますので、各自取得してみて下さい。
他にGLB形式のデータを持っている方はそのデータを使っても大丈夫です。
Vtampサービス内にも自己紹介メダルとかは無料で取得できたりするので、気になる方は探してみて下さい。

Unityの3Dプロジェクトを作成

次に、Unityのプロジェクトを作成します。
当然、今回は3Dを扱うことになりますので、3Dプロジェクトで作成して下さい。
Unity Hub から、「NewProject」-> 「3D (Build-In …)」と進んで、プロジェクト名を適当に入れて（今回は"3DViewer"としました）、「Create project」で作成します。

GLBファイルをUnityに取り込む

続いて、用意したGLB形式の3DデータをUnityに取り込みます。

Assetsに取り込む

早速データをUnityに取り込みます。
「Project」の「Assets」に取得したGLBデータをドラッグ＆ドロップしましょう。
本来なら、管理しやすくするために、Modelsとかのフォルダーを作ってその中に入れる方が良いのですけど…今回は１ファイルだけなので、Assets直下に置いちゃいました。

これで、データは取り込めましたが、この状態ではGLB形式をUnityが処理出来ないので、シーンに追加する事はできません。
試しに、ドラッグ＆ドロップでシーンに配置しようとしても、置く事が出来ないと思います。

glTFastをインストール

このままではGLB形式を扱えないので、扱えるようにします。
メニューの「Windows」->「Package Manager」をクリックして、Package Managerダイアログを表示させ、
ダイアログの「+」ボタンから「Add package by name…」を選択します。
パッケージ名にcom.unity.cloud.gltfastと入力して「Add」をクリックします。
クリック後に少し処理が走って…….
ダイアログに「Unity glTFast」が追加されていたら成功です。

オブジェクトを配置

glTFastがインストールされたら、Assetsに追加していたファイルのアイコンが変わっているのがわかると思います。

明らかに、データを認識できていそうなアイコンですね。
それでは、このファイルをシーンにドラッグ＆ドロップして配置してみましょう。
ちゃんと配置できましたね。
一応、配置座標を（0,0,0）に設定しておくことにします。

床を配置

このままでも良いのですけど、床を配置して、地面の場所を分かりやすくしておきましょう。
「Hierarchy」上の「＋」かマウスの右クリックをして、「3D Object」-> 「Plane」を選択します。
あとは、座標を(0,0,0)、スケールを(5,1,5)くらいに設定しましょう。

これで地面の上に家が立っているようなワールドが完成です。

空間を自由に動けるようにする

ここまでで簡単なワールドを作ることができましたので、次に空間を動き回るプレイヤーを作って行きます。

ダミープレイヤーを配置

まずは、ワールドを動き回るプレイヤー（操作キャラ）を配置します。
（究極的には、カメラを直接操作することで、プレイヤーを不要にもできるのですが、今回はプレイヤーを作ることにします。）
「Hierarchy」上の「＋」かマウスの右クリックをして、「3D Object」-> 「Cube」を選択します。
分かりやすくする為に、オブジェクト名を"Player"に変更して、座標を(15, 1, 0)くらいに設定します。
座標は適当なので、好きな場所に配置しても大丈夫です。
今回は、配置した3Dオブジェクトから少し離れた場所になるように設定しました。

カメラをプレイヤーに追従させる

次にカメラをプレイヤーに追従させます。
これをしないと、定点カメラとなって、プレイヤーが動き回るのを眺めるだけになってしまいます。（それはそれで面白いですけどね）
やることは単純で、「Hierarchy」にある「Main Camera」を先ほど作成した「Player」にドラッグ&ドロップするだけです。
これで、カメラとプレイヤーは親子関係になって、一緒に動くようになります。
ですが、おそらく、ドラッグ＆ドロップした状態だと、プレイヤーとカメラの位置が離れていると思いますので、カメラの座標を (0, 0, 0) に設定しましょう。
これで、プレイヤーとカメラの座標が全く同じになります。

スクリプトを作成してプレイヤーにアタッチ

続いて、プレイヤー（カメラ）を動かすためのスクリプトを作成します。
「Project」の「Assets」で「＋」かマウスの右クリックメニューの「Create」から、「C# Script」を選択します。
スクリプトの名前は “Player" としましょう。
そして、忘れないうちに、PlayerスクリプトをPlayerオブジェクトにドラッグ&ドロップして、作成したスクリプトをPlayerオブジェクトにアタッチしちゃいましょう。

Playerオブジェクトの「Inspector」に「Player (Script)」が追加されていればOKです。

最後に作成したPlayerスクリプトに、下記コードを記述すれば完成です。

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class Player : MonoBehaviour
{
  private const float FORWARD_SPEED = 0.05f;
  private const float ROTATE_SPEED = 0.5f;

  void Start()
  {
  } 

  void Update()
  {
    transform.Rotate(0f, Input.GetAxis("Horizontal") * ROTATE_SPEED, 0f);
    transform.position += transform.forward * Input.GetAxis("Vertical") * FORWARD_SPEED;
  }
}

スクリプトの簡単な説明

スクリプトでは難しいことは何もしていないです。
Update内の１行目でスティックの水平入力量に応じて向いている方向を変更し、２行目でスティックの垂直入力量に応じて前後移動をしています。
最大移動スピードは定数のFORWARD_SPEED、最大回転スピードはROTATE_SPEEDで決めています。

実際に動かす

実際に動かすと、キーボードのWASDやPADのスティック入力で、前後移動や左右回転ができると思います。
（コード上はスティックしか扱っていない様に見えますが、Unity内で上手くキーボードも処理してくれているみたいですね。）
上下移動は行っていないので、自由自在に動くことはできませんが、簡易Viewerとしては及第点ではないでしょうか？
もし、回転速度が早く感じる場合は、コードのROTATE_SPEEDの値を小さくして調整して下さい。

（おまけ）実際にVtampのデータを使った動画

おまけとして、実際に私がVtampで購入したデータで動かしてみた動画を貼っておきます。

最後に

Unityもあまり慣れていない上に3Dはほぼ手探り状態だったので、動かせるまでに時間がかかりそうに思っていましたが、実際に手を動かしてみたらだいたい1-2時間くらいで作れてしまいました。
それだけ、簡単に作れるようになっているUnityは凄いですね。（たぶんUEでも同じように簡単に作れそう）
今回は、平面上を動くだけですが、上下移動させたり、マウスやもう１軸のスティックで視線を動かせるようにしたりとか、拡張余地はまだまだあると思いますので、挑戦してみてはどうでしょうか？
私ももっと自由に動かしたくなったら挑戦してみようと思います。

参考

UnityでUnity glTFastを使ってGLBファイルを取り込む
3DEXPORT – 無料 3Dモデル – House 001

スポンサーリンク

ゲーム開発3D,Unity

Posted by しむてる