Unityで汎用スマホ向けVRアプリを作る(2) 視線入力を実現する

【連載】

VRコンテンツの作り方

【第13回】Unityで汎用スマホ向けVRアプリを作る(2) 視線入力を実現する

[2017/02/08 08:30] ブックマーク ブックマーク

開発ソフトウェア

連載目次

前回に引き続き、Google VR SDKを利用したVRアプリの実装を進めていきます。今回は入力部分を実装します。

視線ターゲットを表示

まず、視点となる位置に点(Reticle)を描画します。

Assets内にある「GoogleVR/Prefabs/UI/GvrReticle」をシーンにある「Main Camera」の直下にドロップして追加します。

これだけで、視線ターゲット(点)が表示されるようになります。

UGUIのボタンを配置

以下の手順でUGUIのボタンを含むUIを設定します。

Hierarchyの「Create > UI > Button」を選択します。シーン内に、ボタンを含むCanvas、UGUIの管理のためのEventSystemも自動的に作成されます。

<Canvasの設定>

  • 名前 : UICanvas
  • Canvas - Render Mode:Word Space
  • 「Pos X:0, Pos Y:2, Pos Z:3」
  • 「Width:10, Height:4」

<Buttonの設定>

  • 「Pos X:0, Pos Y:0, Pos Z:0」
  • 「Width:100, Height:30」
  • 「Scale X:0.01, Y:0.01, Z:1」

これで下図のようなボタンが配置されます。

UGUIのボタンに反応させる

前もって作成した視線ターゲット(点)を、このUGUIのボタンに反応させるのはGoogle VR SDKに含まれる機能で簡単に実現できます。

UGUIを作成したときに作られたEventSystemに、Assets内にある「GoogleVR/Scripts/GazeInputModule」をアタッチします。

次に、上記EventSystemにアタッチされているStandard Input Moduleのチェックを外して無効化します。

これだけで、視線がボタンに重なったときに丸くなり、画面タッチをすることで、ボタン押下イベントが発生します。

ボタン押下イベントの処理内容も、通常のUGUIのボタン用のOnClickイベントが発動しますので、既にUGUIを使っていた方には問題なく使えるはずです。

OnClickイベントの使い方が分からない方は、本連載の第8回内の「ボタン押下時の処理と数字の処理」という項目を参照して下さい。

特定のキューブに反応させる

次に、シーン内に配置してある特定GameObjectに視線が反応するようにさせます。

シーン内のオブジェクトを直接選択できるようになるので、各種コンテンツで使える技術です。

これから作業するにあたって、シーン内にあるGameObject(キューブ)のうち対象としたいGameObjectを選び、名前を「ReactiveCube」としておきます。

このReactiveCubeに、EventTriggerコンポーネントを追加します。

これだけで、視線がそのキューブにヒットしたときに拡大されるようになります。

次にReactiveCubeにスクリプトを追加し、視線がヒットしているとき、視線がヒットした状態でクリック(タッチ)されたときの処理を実装していきます。

Assets内に「Scripts」というフォルダを作成し、その中に「ReactiveCube」というスクリプトを作成します。内容は次のようにします。

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

public class ReactiveCube : MonoBehaviour {

  // ----- Gaze Input

  public void pointerEnter(){
    Debug.Log ("pointer Enter");
    GetComponent ().material.color = Color.red;
  }

  public void pointerExit(){
    Debug.Log ("pointer Exit");
    GetComponent ().material.color = Color.white;
  }

  public void pointerClick(){
    Debug.Log ("pointer Click");
    GetComponent ().material.color = Color.yellow;
  }
}

ReactiveCubeのEventTriggerコンポーネントに各イベントの対応を設定していきます。「Pointer Enter」について具体的な手順を説明します。

まず、「Add New Event Type」ボタンを押して「PointerEnter」を選びます。

続いて、「List is Empty」と表示されていますので、右下の「+」ボタンを押し、イベントに対応する項目を一つ追加します。

次に、「None(Object)」とある項目の右側の◎をクリックして、Scene内にあるReactiveCubeオブジェクトを選択します。

その後、「No Function」のプルダウンを選び、「ReactiveCube」内の「pointerEnter ()」を選びます。

この手順を、「Pointer Exit」、「Pointer Click」についても同様に繰り返します。

設定完了後、実行すると、指定したキューブに視線がヒットしたとき、タッチしたときにキューブの色が変わるようになります。

Google VR SDKの機能テスト : 1眼表示とのトグル

Google VR SDKの基本的な機能をいくつか試すために、最初に表示させたUGUIボタンのアクションを実装します。

Assets内の「Scripts」フォルダ内に「TestSystem」というスクリプトを作成します。内容は次のようにします。

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

public class TestSystem : MonoBehaviour {

  public void testButtonPressed(){
    toggleVRMode ();
  }

  public void toggleVRMode() {
    GvrViewer.Instance.VRModeEnabled = !GvrViewer.Instance.VRModeEnabled;
  }
}

Buttonの機能のOnClickにこのtestButtonPressed() を呼び出すように、下図のように設定します。

これでボタンを押す度に、VRModeをトグルさせることができます。

VRModeがtrueになっていると2眼タイプ、falseでは1眼タイプですので、それを切り替える事ができます。

Google VR SDKの機能テスト : 歪み補正の設定

レンズ補正のための樽型の設定は、下記のようにして変更できます。

public void toggleVRDistortion() {
  // GVR 1.0.3
  GvrViewer.Instance.DistortionCorrectionEnabled = !GvrViewer.Instance.DistortionCorrectionEnabled;
}

このソースは、今回使用しているGoogle VR SDK 1.0.3用のものですが、1.10.0になると変わるので利用には注意して下さい。

事例紹介

UEIソリューションズとヒューマンデザインが協力し、VRとミュージカルを融合させた「リトルプリンスVR supported by VIVE」というエンターテイメントを発表するようです。

VR機材にはViveを使用し、実写ミュージカルとCG演出の合成を楽しめるようです。中でも一番気になるのは「10人同時のVR映像同期」です。VRコンテンツの問題の一つ「コンテンツの共有感」をどのように解決しているか是非体験してみたいです。

しかし、残念ながら、当面はプレス関係者向けで一般公開は未定とのこと。

今後、どのようなコンテンツに昇華されるのか楽しみです!

著者紹介


山田宏道 (YAMADA Hiromichi) - 株式会社トルクス 代表取締役

千葉大学工学部卒業。ゲームプログラマーを経て、2005年よりフリーランス、2012年 株式会社トルクスを設立し、コンシューマ用途、ビジネス用途等、様々なiOSアプリ、ARアプリ等を受託開発。

2016年4月より島根県奥出雲町在住。現在、VR関連技術に注力しており、2016年10月に「地域おこしVR研究会」を立ち上げ、観光向けVRコンテンツなどを企画、開発中。

連載目次

※ 本記事は掲載時点の情報であり、最新のものとは異なる場合がございます。予めご了承ください。

関連リンク

この記事に興味を持ったら"いいね!"を Click
Facebook で IT Search+ の人気記事をお届けします
2410
2
【連載】VRコンテンツの作り方 [13] Unityで汎用スマホ向けVRアプリを作る(2) 視線入力を実現する
前回に引き続き、Google VR SDKを利用したVRアプリの実装を進めていきます。今回は入力部分を実装します。
https://news.mynavi.jp/itsearch/2017/02/03/vr/rec_vr.jpg
前回に引き続き、Google VR SDKを利用したVRアプリの実装を進めていきます。今回は入力部分を実装します。

会員登録(無料)

一覧はこちら

今注目のIT用語の意味を事典でチェック!

一覧はこちら

ページの先頭に戻る