1.PC Holographic Remoting の概要1. Getting started with PC Holographic Remoting

概要Overview

HoloLens 2 のチュートリアルへようこそ。Welcome to the HoloLens 2 tutorials. 2 部構成のこのチュートリアル シリーズでは、Mixed Reality エクスペリエンスのデモンストレーションを作成する方法と、Holographic Remoting 用の PC アプリを作成する方法について説明します。In this two-part tutorial series, you will learn how to create a mixed reality experience demonstration and how to create a PC app for Holographic Remoting.

このチュートリアルでは、Mixed Reality エクスペリエンスの作成方法について説明します。In this tutorial, you'll learn how to create a mixed reality experience. このチュートリアルでは、UI 要素、3D モデルの操作、モデルのクリッピング、および視線追跡機能について説明します。It will demonstrate UI elements, 3D model manipulation, model clipping, and eye-tracking features.

Holographic Remoting アプリケーションの作成に関する 2 番目のチュートリアルでは、Holographic Remoting 用の PC アプリを作成する方法について説明します。In the second tutorial, Create a Holographic Remoting application, you will learn how to create a PC app for Holographic Remoting. また、いつでも HoloLens 2 に接続して、Mixed Reality で 3D コンテンツを視覚化する方法についても説明します。And connect to HoloLens 2 at any point, providing a way to visualize 3D content in mixed reality.

目標Objectives

  • アセットをインポートし、シーンをセットアップするImport assets and set up the scene
  • UI 要素とボタンを使用してホログラムを操作するInteract with holograms using UI elements and buttons
  • クリッピング機能のために 3D オブジェクトを構成するConfigure 3D objects for the clipping feature
  • 視線追跡を使用したヒントのアクティブ化について理解するLearn about activating tooltips with eye-tracking

前提条件Prerequisites

続行する前に、入門チュートリアル シリーズを完了するか、Unity および MRTK の基本操作を経験しておくことを 強くお勧め します。We strongly recommend completing the Getting started tutorials series or some basic prior experience with Unity and MRTK before continuing.

重要

  • このチュートリアル シリーズで推奨されている Unity バージョンは、Unity 2019 LTS です。The recommended Unity version for this tutorial series is Unity 2019 LTS. これは、上でリンクされた前提条件に記載されている Unity のバージョン要件または推奨事項に代わるものです。It supersedes any Unity version requirements or recommendations stated in the prerequisites linked above.
  • MRTK プロジェクトでの Holographic Remoting は、レガシ XR でのみ機能します。Holographic Remoting with MRTK projects will only work with legacy XR. 現時点では、XR SDK はサポートされていません。XR SDK is not supported at this time.

Unity プロジェクトの作成と準備Creating and preparing the Unity project

このセクションでは、新しい Unity プロジェクトを作成し、MRTK 開発用に準備します。In this section, you will create a new Unity project and get it ready for MRTK development.

このためには、まず「プロジェクトと最初のアプリケーションの初期化」に従ってください (「デバイスへのアプリケーションのビルド」の手順は除く)。これには、次の手順が含まれます。For this, first follow the Initializing your project and first application, excluding the Build your application to your device instructions, which includes the following steps:

  1. Unity プロジェクトを作成し、"MRTK チュートリアル" などの適切な名前を付けるCreating the Unity project and give it a suitable name, for example, MRTK Tutorials

  2. ビルド プラットフォームを切り替えるSwitching the build platform

  3. TextMeshPro の重要なリソースをインポートするImporting the TextMeshPro Essential Resources

  4. Mixed Reality Toolkit をインポートするImporting the Mixed Reality Toolkit

  5. Unity プロジェクトを構成するConfiguring the Unity project

  6. シーンを作成して設定し、シーンに PC Holographic Remoting などの適切な名前を付けるCreating and setting the scene and give the scene a suitable name, for example, PC Holographic Remoting

次に、「空間認識表示オプションの変更」の手順に従って、シーンの MRTK 構成プロファイルを DefaultHoloLens2ConfigurationProfile に変更します。Then follow the Changing the Spatial Awareness Display Option instructions to change the MRTK configuration profile for your scene to the DefaultHoloLens2ConfigurationProfile. 空間認識メッシュの表示オプションを [オクルージョン] に変更します。Change the display options for the spatial awareness mesh to Occlusion.

チュートリアルのアセットのインポートImporting the tutorial assets

MRTK.Tutorials.PCHolographicRemoting.unitypackage をダウンロードして インポート します。Download and import the MRTK.Tutorials.PCHolographicRemoting.unitypackage.

ヒント

Unity カスタム パッケージをインポートする方法については、「Mixed Reality Toolkit をインポートする」の手順を参照してください。For a reminder on how to import a Unity custom package, you can refer to the Import the Mixed Reality Toolkit instructions.

チュートリアル アセットをインポートすると、[プロジェクト] ウィンドウは次のようになります。After importing the tutorial assets, your Project window should look similar to this:

チュートリアルのアセットがインポートされた後の Unity の [Hierarchy](階層)、[Scene](シーン)、[Project](プロジェクト) ウィンドウ

シーンの構成と準備Configuring and preparing the scene

このセクションでは、チュートリアルのプレハブをいくつか追加してシーンを準備します。In this section, you will prepare the scene by adding some of the tutorial prefabs.

[プロジェクト] ウィンドウで、 [アセット] > [MRTK.Tutorials.PCHolograhicRemoting] > [Prefabs](プレハブ) フォルダーの順に移動します。In the Project window, navigate to Assets > MRTK.Tutorials.PCHolograhicRemoting > Prefabs folder. CTRL ボタンを押したまま、次の 6 つのプレハブをクリックします。While holding down the CTRL button, click on the below six prefabs.

  • ButtonParentButtonParent
  • ClippingObjectsClippingObjects
  • HandSpatialMapButtonHandSpatialMapButton
  • 手順Instructions
  • ModelParentModelParent
  • プラットフォームPlatform

選択されたシーンに追加されるプレハブが表示されている Unity

これらのモデルを、[Prefabs](プレハブ) フォルダーから [階層] ウィンドウ にドラッグ アンド ドロップします。Drag-and-drop these models from the prefabs folder into the Hierarchy window.

新しく追加されたプレハブがまだ選択されている Unity

シーン内のオブジェクトに焦点を合わせるには、ModelParent オブジェクトをダブルクリックして、もう一度少しズームインします。To focus in on the objects in the scene, you can double-click on the ModelParent object, and then zoom slightly in again:

ModelParent オブジェクトにフォーカスがある Unity

ヒント

シーンに大きいアイコンが表示されている場合 (大きいフレームの 'T' アイコンが邪魔になる場合など)、ギズモをオフに切り替えることによってこれらを非表示にすることができます。If you find the large icons in your scene, such as, the large framed 'T' icons distracting, you can hide these by toggling the Gizmos to the off position.

シーンを操作するためのボタンの構成Configuring the buttons to operate the scene

このセクションでは、シーンにスクリプトを追加して、モデルの切り替えとクリッピング機能の基礎をデモンストレーションするボタン イベントを作成します。In this section, you will add scripts into the scene to create button events demonstrating the fundamentals of model switching and clipping functionality.

1.Interactable (Script) コンポーネントの構成1. Configuring the Interactable (Script) component

[階層] ウィンドウで、ButtonParent オブジェクトを展開し、NextButton を選択します。In the Hierarchy window, expand the ButtonParent object and select the NextButton. [インスペクター] ウィンドウで、Interactable (Script) コンポーネントを見つけて、OnClick () イベントの下にある + アイコンをクリックします。In the Inspector window, locate the Interactable (Script) component and click on + icon under OnClick () event.

NextButton OnClick イベントが追加された Unity

[階層] ウィンドウで NextButton オブジェクトを選択したまま、ButtonParent オブジェクトを [階層] ウィンドウから、先ほど追加した空の [None (Object)](なし(オブジェクト)) フィールドにドラッグして、このボタンをクリックすることによって発生するボタン クリック イベントを ButtonParent オブジェクトがリッスンするようにします。With the NextButton object still selected in the Hierarchy window, click-and-drag the ButtonParent object from the Hierarchy window into the empty None (Object) field of the event you just added to make the ButtonParent object listen for button click event from this button:

NextButton OnClick イベント リスナーが構成された Unity

同じイベントの [No Function](関数なし) ドロップダウンをクリックします。Click the No Function dropdown of the same event. 次に、ViewButtonControl > NextModel () の順に選択して、このボタンを押すことでボタン イベントが発生するときにトリガーされるアクションとして、NextModel () 関数を設定します。Then select ViewButtonControl > NextModel () to set the NextModel () function as the action that is triggered when the button pressed events is fired from this button:

NextButton OnClick イベント アクション選択パスが表示されている Unity

2.残りのボタンの構成2. Configuring the remaining buttons

残りの各ボタンについて、上記の手順を完了して、OnClick () イベントに関数を割り当てます。For each of the remaining buttons, complete the process outlined above to assign functions to the OnClick () events:

  • PreviousButton オブジェクトについては、ViewButtonControl > PreviousModel () 関数の順に割り当てます。For PreviousButton object, assign the ViewButtonContro l > PreviousModel () function.

  • ClippingButton については、ToggleButton > ToggleClipping () 関数の順に選択します。For ClippingButton select ToggleButton > ToggleClipping () function.

3.View Button Control (Script) および Toggle Button (Script) コンポーネントの構成3. Configuring the View Button Control (Script) and Toggle Button (Script) components

これで、モデルの切り替えとクリッピング機能をデモンストレーションできるようにボタンが構成されました。Now your buttons are configured to demonstrate the model switching and clipping functionality. 次に、3D モデルとクリッピング オブジェクトをスクリプトに追加します。It is time to add 3D models and the clipping objects to the script.

デモンストレーション用に 6 つの異なる 3D モデルが用意されています。*ModelParentobject _ を展開して、これらの 3D モデルを表示します。We have provided six different 3D models for demonstration, expand the *ModelParentobject _ to expose these 3D models.

[階層] ウィンドウで ButtonParent オブジェクトを選択したまま、[インスペクター] ウィンドウで、_ View Button Control (Script) * コンポーネントを見つけて、Models 変数を展開します。With the ButtonParent object still selected in the Hierarchy window, in the Inspector window, locate the _ View Button Control (Script)* component and expand the Models variable.

[サイズ] フィールドに、シーンに含める 3D モデルの数を入力します。In the Size field, enter the number of 3D models you would like to have in your scene. この例では、6 を入力します。In this case, it would be six. これで、新しい 3D モデルを追加するためのフィールドが作成されます。It will create fields for adding new 3D models.

ViewButtonControl スクリプト コンポーネントのフィールドが表示されている Unity

ModelParent オブジェクトの子オブジェクトを、これらのフィールドにそれぞれドラッグ アンド ドロップします。Drag and drop each child object of ModelParent Object into these fields.

ViewButtonControl スクリプト コンポーネントのフィールドが構成されている Unity

ClippingObjects オブジェクトを、[階層] ウィンドウから Toggle Button (Script) コンポーネントの [Clipping Object](クリッピング オブジェクト) フィールドにドラッグ アンド ドロップします。Drag and drop the ClippingObjects object from the Hierarchy window to the Toggle Button (Script) component Clipping Object field.

注意

ボタンの親オブジェクトから移動しないようにします。Stay in button parent object only.

ToggleButton スクリプト コンポーネントのフィールドが構成されている Unity

[階層] ウィンドウで ClippingObjects プレハブを選択して、[インスペクター] ウィンドウでそれを有効にし、そのクリッピング オブジェクトをオンにします。In the Hierarchy window, select the ClippingObjects prefab and enable it in the Inspector window to turn on the Clipping objects.

クリッピング機能を有効にするためのクリッピング オブジェクトの構成Configuring the clipping objects to enable clipping feature

このセクションでは、MarsCuriosityRover オブジェクトの子オブジェクト レンダラーを各クリッピング オブジェクトに追加して、MarsCuriosityRover モデルのクリッピングをデモンストレーションします。In this section, you will add MarsCuriosityRover object's child objects renderer into an individual clipping object to demonstrate the clipping of the MarsCuriosityRover model.

[階層] ウィンドウで、ClippingObjects オブジェクトを展開して、このプロジェクトで使用する 3 つの異なるクリッピング オブジェクトを表示します。In the Hierarchy window, expand the ClippingObjects object to expose the three different clipping objects that you will be using in this project.

ClippingSphere オブジェクトを構成するため、このオブジェクトをクリックし、[インスペクター] ウィンドウで Clipping Sphere (Script) コンポーネントを見つけます。To configure the ClippingSphere object, click on it, and in the Inspector window, locate the Clipping Sphere (Script) component. [サイズ] フィールドに、3D モデルに追加する必要があるレンダラーの数を入力します。Enter the number of renderers in the size field that you need to add for your 3D model. この場合は、MarsCuriosityRover 子オブジェクト用に 10 個追加します。In this case, add 10 for MarsCuriosityRover child objects. これで、レンダラーを追加するためのフィールドが作成されます。MarsCuriosityRover オブジェクトの子モデル オブジェクトをこれらのフィールドにドラッグ アンド ドロップします。It will create fields for adding renderers, drag and drop MarsCuriosityRover Object's child model objects into these fields.

ClippingSphere スクリプト コンポーネントのフィールドが構成されている Unity

同じプロセスに従って、MarsCuriosityRover の子オブジェクト レンダラーを ClippingBox および ClippingPlane オブジェクトに追加します。Follow the same process and add MarsCuriosityRover's child objects renderers to the ClippingBox and ClippingPlane objects.

このチュートリアルでは、クリッピング機能のデモンストレーションに MarsCuriosityRover モデルのみを使用します。In this tutorial, only the MarsCuriosityRover model will be used for demonstrating the clipping feature. クリッピング機能を他のモデルに追加し、レンダラーのサイズを大きくし、それぞれのメッシュ レンダラーを追加してきました。They were adding clipping features to more models, increasing the size of the renderer, and adding their individual mesh renderers.

ヒントを強調表示するための視線追跡の構成Configuring eye-tracking to highlight tooltips

このセクションでは、プロジェクトで視線追跡を有効にする方法を学習します。In this section, you will explore how to enable eye tracking in your project. たとえば、MarsCuriosityRover のパーツに関連付けられているヒントを、それらのパーツに視線を向けている時は強調表示し、視線を外すと非表示にする機能を実装できます。For example, you will implement the functionality to highlight tooltips attached to MarsCuriosityRover's parts while looking at them and hiding them, while you are looking away from them.

1.ターゲット オブジェクトおよび関連するヒントを特定する1. Identify target objects and associated tooltips

[階層] ウィンドウで、ModelParent オブジェクトを選択します。In the Hierarchy window, select the ModelParent object. MarsCuriosity -> Rover _ を展開し、MarsCuriosityRover の 5 つの主要なパーツ _ POI-CameraPOI-WheelsPOI-AntennaPOI-SpectrometerPOI-RUHF Antenna を見つけます。Expand the *MarsCuriosity -> Rover_ to find five main parts of the MarsCuriosityRover: _* POI-Camera**, POI-Wheels, POI-Antena, POI-Spectrometer, POI-RUHF Antenna.

  • [階層] ウィンドウで、MarsCuriosityRover パーツに関連付けられている、対応する 5 つのヒント オブジェクトを確認します。Observe five corresponding tooltip objects associated with MarsCuriosityRover parts in the Hierarchy window.
  • これらの MarsCuriosityRover パーツに視線を向けたときにそのエクスペリエンスを強調表示するように、これらのオブジェクトを構成していきます。You will be configuring these objects to highlight the experience when you look at the MarsCuriosityRover parts.

Rover オブジェクトが選択されて展開された Unity

2.While Looking At Target () および On Look Away () イベントを実装する2. Implement While Looking At Target () & On Look Away () events

[階層] ウィンドウで、*POI-Camera _ オブジェクトを選択します。In the Hierarchy window, select the *POI-Camera _ object. [インスペクター] ウィンドウで、_ Eye Tracking Target (Script) * コンポーネントを見つけて、次のように While Looking At Target () & On Look Away () イベントを構成します。In the Inspector window, locate the _ Eye Tracking Target (Script)* component and configure the While Looking At Target () & On Look Away () events as follows:

  • [None (Object)](なし (オブジェクト)) フィールドに、POI-Camera ToolTip オブジェクトを割り当てます。To None (Object) field, assign the POI-Camera ToolTip object
  • While Looking At Target () イベントの [No Function](関数なし) ドロップダウンから、GameObject > SetActive (bool) の順に選択します。From No Function dropdown of While Looking At Target () event, select GameObject > SetActive (bool). その下にある チェックボックス をオンにして、ターゲット オブジェクトに視線を向けたときにトリガーされるアクションとしてそのヒントが強調表示されるようにします。Select the Checkbox under it to highlight the tooltip as the action that is triggered when you look at the target object.

EyeTrackingTarget の WhileLookingAtTarget イベントの構成が進行中の Unity

  • 同じプロセスに従い、On Look Away () イベント リスナーの [No Function](関数なし) ドロップダウンをクリックします。Follow the same process and click on the No Function dropdown of the On Look Away () event listener. 次に、GameObject > SetActive (bool) の順に選択し、チェックボックス はオフのままにしておいて、ターゲット オブジェクトから視線を外したときにトリガーされるアクションとしてそのヒントが非表示になるようにします。Then select GameObject > SetActive (bool) and leave the Checkbox empty to hide the tooltip as the action that is triggered when you look away from the target object.

EyeTrackingTarget の OnLookAway イベントが構成された Unity

同じプロセスに従い、同じ MarsCuriosityRover パーツの While Looking At Target () & On Look Away () イベントに、それぞれのヒント オブジェクトを割り当てます。Follow the same process and assign respective tooltip objects to their same MarsCuriosityRover parts While Looking At Target () & On Look Away () events.

視線追跡を有効にするには、こちらのガイドラインに従ってください。To enable eye tracking, please follow these guidelines.

結論Congratulations

このチュートリアルでは、UI 要素、3D モデルの操作、モデルのクリッピング、および視線追跡機能をデモンストレーションする Mixed Reality エクスペリエンスを構築する方法を学習しました。In this tutorial, you learned to build a mixed reality experience demonstrating UI elements, 3D model manipulation, model clipping, and eye-tracking features. このチュートリアルで説明した NextButton および PreviousButton で、3D モデルのビューアー エクスペリエンスを実際に試しました。The tutorial provided you with NextButton and PreviousButton that let you explore the 3D model viewer experience. ClippingObjectButton を使用して、クリッピング オブジェクトをオンにし、クリッピング機能を体験しました。The ClippingObjectButton made you turn on clipping objects and experience clipping feature. このチュートリアルでは、エクスペリエンスでのヒントの強調表示を可能にする視線追跡要素についても説明しました。The tutorial also provided you with an eye-tracking element to enable highlighting the tooltips in the experience.

次のレッスンでは、いつでも HoloLens 2 に接続できる PC 用の Holographic Remoting アプリケーションを作成し、Mixed Reality で 3D コンテンツを視覚化する方法について説明します。In the next lesson, you will learn how to create a Holographic Remoting application for PC to connect HoloLens 2 at any point, providing a way to Visualize 3D content in mixed reality.