Unity VR-AR-MR-XR

Unityで、ゲーム用の大画面があるVR部屋の作り方!

8月 9, 2020

皆さんはどれくらいの大きさのモニターでゲームをしていますか?

テレビを使ってゲームをしているなら30インチくらいが一般的だと思います。

かくいう私もテレビを使ってゲームを遊んでいたのですが、先日まで私の部屋には16インチのテレビしかなく、その小さい画面で満足していました。

その小さい画面でずっとゲームをしてきたため、先日21インチのモニターを買ったとき、あまりの大きさに感動してしまいました。

 例えばこんな感じです。

↓↓↓↓

Acer ゲーミングモニター Nitro 21.5インチ

一度21モニターを知ってしまった私は思いました。もっともっと大きなモニターでゲームがしてみたいと……

現実では予算的にも部屋のスペース的にも無理があります。

しかし、幸か不幸か私はVR部員。そう、VR空間でなら……

物をどこまでも大きくでき、無限のスペースがあるVR空間で大画面のゲーミングルームを作りたいと思います。

 

必要なもの

  • テレビゲーム機
  • キャプチャーボード
  • SteamVRが使えるVR機器

必要なアプリ

  • Unity

※Unityのインストールについては省略させてもらいます。

1.Unityの開発環境のセットアップ

Unityを起動したらまずVRの開発環境を揃えるために『Steam VR Plugin』を導入します。

これははVRゲーム開発で必須ともいえるプラグインで、これを導入するだけでVRの基本のHMDとゲーム内のカメラの同期はもちろんのこと『物をつかむ・投げる、弓矢を打つ、テレポート』などの動作を簡単にゲーム内に実装することができます。

導入するためにまず、UAsset Storeを開き、『Steam VR Plugin』で検索すると上位にValve Corporationの該当プラグインが出てきますのでボタンを押してDownloadし、その後ボタンがImportに変わるので続けてインポートしましょう。

そうするとUnity上にすべてのチェックボックスにチェックが入っていることを確認し、こちらも同様にImportします。

Importが完了すると導入したSteam VR Pluginの設定ウインドウが自動で開きます。

これはオススメの設定にしますか?と聞いてくるものなので特にこだわりがない限りAccept Allを選びましょう。
再度表示されることもありますが、すべてAccept Allで大丈夫です。

(余談ですが設定を変えずそのままAccept Allを選ぶと「You made right choice!」と言われます。)

設定が完了後、SteamVR関連のフォルダが追加されていたら開発環境の導入は完了です。

導入後は元からあるCameraを消し、Asset/SteamVR/Prefabsに入ってるCameraRigというPrefabを置くだけで作ったシーンをVR機器で再生することができます。

2.部屋と大画面モニターの作成

続いてゲーミングルームとその部屋のモニターを作っていきます。

まずはSample Scene(もしくは新しく作ったシーン)のカメラを消し、Asset/SteamVR/Prefabsに入ってるCameraRigを置き、シーンのVR化をします。

モニターについてはシーンに板を設置し、その板のテクスチャにUSBカメラの映像を投影するスクリプトをアタッチするという方式で作っていきます。

まずはシーンに3D ObjectのPlaneを追加し、新しいマテリアルを作り、それをPlaneに割り当てます。

位置を調整して地面にめり込まないように位置とスケールを調整。

サイズ(Scale)はあまり小さすぎでもゲーム画面を映しきれないと思ったのでとりあえず10×1×10にしました。

 

Playすると板をみるVRアプリとして動作します。(HMDにスマホを突っ込み撮影)

次にこの板にキャプチャーボードで取り込んだゲームの映像をリアルタイムで表示させるスクリプトを作ります。

新たにC# scriptを作成した後に名前を『WebCamController』にし、以下のような内容にしてください。

  1. using System.Collections;
  2. using System.Collections.Generic;
  3. using UnityEngine;
  4. public class WebCamController : MonoBehaviour
  5.  {
  6.     int width = 1920;
  7.     int height = 1080;
  8.     int fps = 30;
  9.     WebCamTexture webcamTexture;
  10.     void Start () {
  11.         WebCamDevice[] devices = WebCamTexture.devices;
  12.         webcamTexture = new WebCamTexture(devices[0].name, this.width, this.height, this.fps);
  13.         GetComponent<Renderer> ().material.mainTexture = webcamTexture;
  14.         webcamTexture.Play();
  15.     }
  16. }

ソースコードについては以下のサイトを参考にさせていただきました。

ここでwebカメラ?と思われた方もいるかもしれませんが、キャプチャーボードはゲームをカメラなどと同じ形式でPCに取り込むものなので大丈夫です。

しかし、このままで動けば問題ないのですが一部の人は少しスクリプトを書きかえる必要があります。

14行目の『webcamTexture = new WebCamTexture(devices[0].name, this.width, this.height, this.fps);』という部分、これは0番目のデバイス(カメラ)という指定をしているので、人によっては内蔵カメラなどが0番目になっていてキャプチャーボードにそれ以降の番号か割り当てられていることがあります。

その場合は総当たりで番号を1づつ増やしていく、もしくは以下のようなスクリプトを実行することでキャプチャーボードに割り当てられた番号がわかります。

『ExampleClass』という名前でC# scriptを作成し、以下のような内容を変え、適当なオブジェクトにアタッチすることで使えます。

  1. using UnityEngine;
  2. using System.Collections;
  3. public class ExampleClass : MonoBehaviour
  4. {
  5.     // Gets the list of devices and prints them to the console.
  6.     void Start()
  7.     {
  8.         WebCamDevice[] devices = WebCamTexture.devices;
  9.         for (int i = 0; i < devices.Length; i++)
  10.             Debug.Log(devices[i].name);
  11.     }
  12. }

これはつながれているキャプチャーボードやwebカメラをデバックログに0から順番に表示していくスクリプトです。

私のPCの場合、実行するとこのように表示されたので、
7160 HD Captureを使いたい場合は『devices[0].name』
Acer AH101 を使いたい場合は『devices[1].name』
OBS-Cameraを使いたい場合は『devices[2].name』
と14行目を変更してやる必要があります。

今回使うキャプチャーボードは7160 HD Captureなので変更する必要はありませんでした。

必要な部分を改変したWebCamControllerを先ほど設置した板にアタッチし、Playしてやると……

無事、ゲーム画面をUnity上に表示&VR画面に表示できました。

VR画面でも無事に表示することができました。

稀にゲーム画面が逆さまに表示されてしまうことがあると思いますがこの問題はUnityでPlaneのRotationの値を変え、回してやることで解決します。

モニターが完成したのでさっそくゲームを少し遊んでみました。

やはり大画面でのゲームは爽快で映画館を借りているような気持ちになれました。

あと、キャプチャーボードにもよると思いますがラグが思ったより少なく、タイミングとリズムが重要なゲームも難なく遊ぶことができました。

3.部屋づくり

必要な仕掛けはすべて完成したので次は部屋の壁や装飾を作っていきたいと思います。

どうやら右と下に入る黒い部分はキャプチャーボードの仕様らしく消せないので部屋の壁で隠すことにしました。

部屋を作るにあたってちょうどいいアセットがアセットストアにあったので今回はこれを使わせてもらいます。

元の配置がおしゃれなのでこのまま使わせてもらいます。

手前にソファーがあるので奥の壁にモニターを配置したいと思います。

先ほどの映画館のようなモニターも魅力的なのですが今回はゲーミングルームということで部屋の壁のサイズにとどめておきます。

家具の配置を画面にかぶらないように移動して最終的にはこうなりました。ちょっとしたホームシアターが完成しました。

ちなみにスクリーンを窓の外に設置すると窓の外にゲームの世界が広がっているような不思議な感覚を楽しみながらゲームを遊べます。

まとめ

実のところVRで大画面で映画を観たりゲームをプレイするというアプリは既にあるのですが、VR内にゲーム映像を映すと機能に拡張性を与えるためにUnityで作ってみました。

今のVtuberのゲーム配信の方式のほとんどがゲーム画面とキャラクターを後から合成する方式ですが、この方法を使い、部屋の中でキャラクターがゲーム画面の前に座っている様子を配信するのも面白いと思います。

窓の外にゲーム画面を表示するのもVR内にゲーム映像を映す新しい楽しみ方の一つだと思います。

また、今回はアセットの家具や部屋を使いましたが、好きな家具や自分で作った家具を置くのも個性的な部屋が作れて素敵だと思います。

皆さんもVRをお持ちなら自分だけのゲーミングルームを作ってみてはいかがでしょうか?

以上VR部のとこやまでした。

 

AR, VR. XR の活用やMicrosoft Holo Lensを活用した建築業向けソリューションGyroEyeに関するお問合せはこちら

 

-Unity, VR-AR-MR-XR
-, , ,

© 2020 IoTプロトタイピング・VR・AR・Unity メディアラボ