6
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

MRTKデモ(Example)まとめ

Last updated at Posted at 2021-10-18

image.png

demoのシーンを自分のシーンに適用する際にどうだったっけな?ということになりがちなので、一覧にまとめました。

はじめに

MRTKのページより、基本となる
Microsoft.MixedReality.Toolkit.Unity.Foundation.2.7.2.unitypackage

Microsoft.MixedReality.Toolkit.Unity.Examples.2.7.2.unitypackage
のパッケージをダウンロードし、Unityにインポートします。

Add to Scene and Configue...で必要な要素を読み込みます。
image.png

MixedRealityToolkitをHoloLens2でCloneして読み込みます。
image.png

demo

demoのシーンファイルは
Assets/MRTK/Examples/Demos/
にあります。


Audio

image.png

AudioLoFiEffectExamples

赤い球をタップすると3種類の音が確認できます。
image.png

オーディオLoFiエフェクトの例

このシーンでは、Low Fidelity(Lo-Fi)オーディオエフェクトを実演します。球体をタップすると、以下のように設定が切り替わります。

ナローバンドテレフォニー(赤い球体)
ナローバンドテレフォニーシステムのオーディオ周波数帯(300Hz〜3.4kHz)を適用します。

AMラジオ(黄色の球体)
AMラジオ放送の音声周波数帯(40Hz~5kHz)を適用します。

Full Frequency Range (青い球)
人間の公称聴力範囲よりも広い音声周波数範囲(10Hz〜22kHz)を適用します。この設定は、Lo-Fi効果をオフにしたのと同じです。

自分のシーンへの適用方法

SoundEmitterをコピーする
必要に応じて音やFilterの値を変更する
image.png

AudioOcclusionExamples

音の遮蔽を確認できる。壁の後ろに行くと音の聞こえ方が変わる。
※Unity上で確認する場合、移動は「W」「A」「S」「D」です。これで壁の後ろに移動します。

image.png

オーディオオクルージョンの例

このシーンでは、密閉された空間の外から音が聞こえてくる効果をシミュレートすることで、オーディオオクルージョンがいかに体験の臨場感を高めるかを示しています。

青い球体が見えていれば、その物体の自然な音を聞くことができます。

水色のパネルの後ろに移動すると、音が遮られます。

自分のシーンへの適用方法

音源としてのSoundEmitter(AudioInfluencerController と Audio Source)を追加する
音源を変える場合はwavファイルなどを読み込み、Audio SourceのAudio Clipに再生したい音源を設定します。
壁のオブジェクトはCollider付きの状態で、AudioOccluderを付与します。
防音効果を高めたい場合はAudioOccluderのVolume Pass Through(音自体が小さくなります) と Cutoff Frequency(ぼやけた聞きにくい音になります)の値を下げます。

TextToSpeechExamples

それぞれの球をクリックするとTextToSpeechSample.csに記述された
「"This is the {0} voice. It should sound like it's coming from the object you clicked. Feel free to walk around and listen from different angles.",」という声がDavid、Mark、Ziraの声で再生されます。

image.png

UnityEditor上では確認できないかもしれません。
image.png

Text To Speechの例

このシーンは、Windowsプラットフォーム上でのText To Speech機能のデモンストレーションです。HoloLens上で、シーン内の3つの赤い球体のいずれかをクリックすると、生成された音声が聞こえてきます。視界に入っている球体の他に、奥の左右にも2つの球体があります。

自分のシーンへの適用方法

TextToSpeechSourceのオブジェクトをコピーします
image.png

WindowsMicrophoneStreamDemo

確認中

image.png

音の大きさのデモ

このシーンでは、WindowsMicrophoneStreamクラスを使用して、ボイスマイクの選択と、声の振幅(音量の指標)の計算を実演しています。

MicrophoneAmplitudeDemo.cs(マイクの振幅のデモ.cs)
この例では、振幅を使って空間認識メッシュのラインを調整します。

  • 大声で話すとメッシュの明るさが増します。
  • 静かに話すとメッシュの明るさが下がります。

Boundary

image.png

BoundaryVisualizationExample

境界を視覚化するサンプル VR向け機能なのでHoloLensでは確認できない?

境界線の可視化

このシーンでは、境界線の形状と、その境界線に内接する長方形のプレイスペースを視覚化しています。

BoundaryVisualizationDemo.cs(境界の可視化デモ.cs)
ユーザーが設定した境界を視覚化し、空間の形状を示す球体などを表示します。

フロア表示
バウンダリシステムに床の表示・非表示を指示します。

プレイエリアを表示
バウンダリシステムに指示して、ユーザーのプレイエリアを長方形で表示/非表示にします。

軌跡エリアの表示
境界線の輪郭を表示するかどうかを設定します。

境界線の壁を表示
境界線の壁の表示/非表示を設定します。

境界線の天井を表示
境界線の上限を表示するかどうかを設定します。

自分のシーンへの適用

BoundaryVisualizationDemoを適用する
image.png


Diagnostics

image.png

DiagnosticsDemo

診断システムを使用して実行時のアプリケーションパフォーマンスを確認するサンプル。

診断デモ

このシーンでは、診断システムを使用して、実行時にアプリケーションのパフォーマンスを判断する方法を紹介します。

DiagnosticDemoControls.cs(診断デモコントロールズ.cs)
以下のキーワードに反応して、診断情報の表示を制御します。

診断の切り替え
現在有効なすべての診断を表示または非表示にします。

Profiler の表示/非表示
ビジュアルプロファイラの表示/非表示を切り替えます。


EyeTracking

image.png

※UnityEditor上では、EyeTrackingの位置はGazeと同じ位置になります。メニューをGazeした状態でエアタップする必要があります。

EyeTrackingDemo-00-RootScene

EyeTrackingDemo-02~05のシーンを起動するメニュー
image.png

EyeTrackingDemo-01-BasicSetup

アイトラッキングを行うための最小設定のシーン
image.png

このシーンはベースとなるシーンに依存しています。ロードしてください
EyeTrackingDemo-00-RootScene.unityをロードしてください。
他のEye Trackingデモシーンは
追加的にロードされます。
image.png

※もともと読み込み用のシーンのためカメラが無いので、単独で見る場合はカメラを追加させて確認します。
※テキストはアプリ再生時には表示されません

詳細はこちらをご覧ください。
https://aka.ms/MRTK-EyeTrackingSamples

・ようこそ
このシーンでは、MRTKでアイトラッキングを始めるために必要な最小限の設定を
MRTKでアイトラッキングを始めるのに必要な最小限の設定を提供します。

・例1:"FollowEyeGaze "スクリプト
ユーザーがどこを見ているかという連続的なデータに簡単に
ユーザーがどこを見ているかという連続的なデータに簡単にアクセスする方法を紹介しています。

・例2:「ColorTap」スクリプトを確認する
キューブに取り付けられた 見ると色が変わります。
見ているときに下をタップすると色が変わります。
色が変わります。

EyeTrackingDemo-02-TargetSelection

image.png

アイトラッキング - ターゲット選択

アイトラッキングを使えば、簡単にオブジェクトをターゲットすることができます。

できるだけ早く宝石を破壊しましょう。
以下のいずれかを行ってください。

  • 見ながらエアタップ
  • 見ながら "Select "または "Explode "と言う

EyeTrackingDemo-03-Navigation

image.png

視線支援型スクロール、パン&ズーム

視線誘導型パン&ズーム
Zoom in:

  • Look + [ Air-tap down and pull toward you ] エアタップして手前に引く
  • Look + [ Say "Zoom in" ] "Zoom in "と言う

Zoom out:

  • Look + [ Air-tap down and push from you ] エアタップして押す
  • Look + [ Say "Zoom out" ]

ズームインした後、周囲を見回すことでパンすることができます。

オートスクロール。
読み続けるだけで、テキストが自動的にスクロールします。

image.png

Eye-supported Target Rotations
image.png

EyeTrackingDemo-04-TargetPositioning

image.png

視線によるターゲットの選択と位置決め

この例では、目線の情報に加えて、手や声による情報を組み合わせて、流暢にターゲットを選択したり、位置を変えたりする方法を紹介します。

目と手

  • 【選択】ターゲットを見る。その後、下をタップしてホールドします。
  • 【位置決め】目的地を見て、エアタップを離す。

目と声

  • 【選択】対象物を見て"put this" "put that"と言う
  • 【位置】目的地を見て "there "と言う

EyeTrackingDemo-05-Visualizer

image.png

アイトラッキングデータの視覚化

ユーザーは何を見ているのか?このシナリオで確認してみましょう。

以下の方法について学びます。

  • ユーザーの入力を記録する
  • ユーザーの入力ログを読み込む
  • アイトラッキングデータの視覚化

GLTF

image.png

Glb-Loading-Demo

https://raw.githubusercontent.com/KhronosGroup/glTF-Sample-Models/master/2.0/BoomBox/glTF-Binary/BoomBox.glb
のGLBファイルを読み込みます
image.png

GLB読み込みデモ

このサンプルシーンでは、GLBアセットをシーンにロードするデモを行います。この例では、glbファイルをダウンロードするために、デバイスがインターネットに接続されている必要があります。

Gltf-Loading-Demo

\Assets\StreamingAssets\GltfModels\Avocado\glTF\Avocado.gltf
にモデルが置かれている必要があります。
image.png

Avocado.gltfのモデルは
https://github.com/KhronosGroup/glTF-Sample-Models/tree/master/2.0/Avocado
から手に入れることができます。

「Copy models to StreamingAssets」ボタンを押すとCubeのglbが追加されます
\Assets\StreamingAssets\GltfModels\Cube\GLB\cube-with-custom-attr.glb

GLTF読み込みデモ

このサンプルシーンでは、glTFアセットをシーンにロードするデモを行います。このためには、glTFファイルがStreaming Assetsフォルダに置かれている必要があります。

自分のシーンへの適用方法

TestGltfLoading.csを適用させる パスはRelativePathに設定します。


HandCoach

image.png

image.png

ハンドコーチの例

このサンプルシーンでは、体験で使用できる様々なハンドコーチの例を示しています。
UnityのEdit > Project Settings > Quality > Other > Blend Weightsで「4 bones」を選択すると、スムーズな関節を見ることができます。

自分のシーンへの適用方法

image.png
SceneContent内で必要なExampleを自分のシーンにコピーする。
※実際には 
StaticHandCoachRoot_R と ボタンなどのオブジェクトを格納したもの
StaticHandCoachRoot_R内の違いはHand Interaction Hint.csのAnimation Stateの状態の違いである。
image.png
状態には
・Animation State:NearSelect_R (Near Select Example)
tap.gif

・Animation State:AirTap_R (Far Select Example)
airtap.gif

・Animation State:Move_R (Move Example)
move.gif

・Animation State:Rotate_R (Rotate Example)
rotate.gif

・Animation State:Move_R (Scale Example)
scale.gif

・Animation State:Scroll_R (Scroll Example)
scroll.gif

・Animation State:HandFlip_R (HandFlip Example)
handflip.gif


HandTracking

image.png

HandInteractionExamples

さまざまなタイプのハンドトラッキングインタラクションを示したサンプル

image.png

ハンドインタラクションの例

このサンプルシーンでは、Press、Touch、Grab、Scroll、Move、Rotate、Scaleといった様々なタイプのハンドトラッキングインタラクションを実演しています。HoloLensシェルの一部である一般的なUIやインタラクションのビルディングブロックをご覧いただけます。

pan&zoom

scroll2.gif

scale2.gif

HoloLensのBoundingBox

image.png

オリジナルの回転を維持する(回転しない)状態で移動 両手でのスケールは可

image.png

つかんだ瞬間に説明を出す

image.png

片手のみ有効

image.png

重力あり

image.png

UIサンプル

image.png

uGUIのものもある

HandInteractionGestureEventsExample

image.png

ジェスチャーイベントの例

このシーンでは、IMixedRealityGestureHandlerを使って、様々なタイプのジェスチャーイベント(選択、ホールド、操作、ナビゲーション)を実演しています。

HandInteractionRecordArticulatedHandPose

image.png

アーティキュレーテッド・ハンド・ポーズの記録例

このサンプルシーンでは、MRTKを使って多関節の手のポーズを記録する方法を紹介します。「record left hand」「record right hand」と言うと、それぞれ球体や立方体の色が変わり、キャプチャー可能な状態になるのがわかる。現在の手のポーズを記録/キャプチャーするには、「stop」と言うと、現在の手のポーズがHoloLens 2デバイスに保存されます。

保存されたハンドポーズは、デバイスポータルのユーザーフォルダ/LocalAppData/[APP_NAME]/LocalState/にアクセスできます。
ArticulatedHandPose-yyyyMMdd-hhmmss.jsonにアクセスできます。

HandInteractionTouchablesExample

image.png

ハンドインタラクション タッチアブル

このシーンでは、MRTKのさまざまなタッチ可能なコンポーネントと、それらがさまざまなコライダとどのように相互作用するかを示しています。

手前には、異なるタッチ可能な設定の3つのオブジェクトがあります。これらのオブジェクトはタッチすると回転するので、フィンガーカーソルとタッチのインタラクションがどのように機能するかを様々な角度から見ることができます。これらのオブジェクトには、それぞれタッチ可能なボリュームのビジュアライゼーションが添付されています。

HandMenuExamples

image.png

ハンドメニューの例

このシーンでは、MRTKのさまざまなタッチ可能なコンポーネントと、それらがさまざまなコライダとどのように相互作用するかを示しています。

手前には、異なるタッチ可能な設定の3つのオブジェクトがあります。これらのオブジェクトはタッチすると回転し、フィンガーハンド メニューの例を見ることができます。

このシーンでは、HandConstraint を使用しています。HandConstraint とは、トラッキングされたオブジェクトを、手の制約を受けたコンテンツにとって安全な領域に制約するソルバーです。(安全な領域とは、手と交差しない領域と考えられます。

HandConstraintPalmUp というHandConstraintの派生クラスも含まれており、手のひらがユーザーの方を向いていて、ユーザーがUIがテザードされているセーフゾーンを見ているときに、ソルバーの追跡オブジェクトをアクティブにするという一般的な動作を示しています。

Unity エディタで「Require Flat Hand」オプションを使用したハンドメニューのテストをサポートするために、このサンプルシーンでは修正された MRTK プロファイル「HandMenuExampleMixedRealityToolkit」を使用しています。
ConfigurationProfile'を使用しています。このプロファイルは、Input > Input Data Providers > Input Simulation Service > Hand Gesture Settings > Default Hand Gesture > 'Flat' (デフォルトは「Open」)で、デフォルトのハンドジェスチャーを変更しています。

デザインガイドラインの詳細については、http://aka.ms/MRDocs > Design > UX Elements をご覧ください。カーソルとタッチのインタラクションは、さまざまな角度から動作します。これらのオブジェクトには、それぞれタッチ可能なボリュームのビジュアライゼーションが添付されています。

show handmenu
image.png

手のメニューを表示するには、手を上げて平らな手のひらを見てください。

切り替えられたメニューを表示するには、手をいったん視界から外し、再び視界に入れる必要があるかもしれません。誤作動を防ぐために、これらの例では、「Require Flat Hand(平らな手を求める)」と「Gaze Activation(視線で見る)」のオプションを使用しています。

アクセシビリティを考慮した音声コマンド

ユーザーが両手を使えない場合を想定して、ハンドメニューの例では音声コマンドを用意しています。メニューを表示するには、「Show hand menu」と言います。メニューはタグアロング動作でFOV内に留まります。選択」キーワードを使って、ボタンの操作を続けることができます。

メニューを使い終わったら、「Hide hand menu」と言ってメニューを閉じることができます。

*音声コマンドのキーワードはMRTKのSpeech Input Profileで定義されています。

LeapMotionHandTrackingExample

省略

LeapMotionOrientationExample

省略

NearMenuExamples

image.png

ニアメニュー例

このシーンでは、以下のような機能を持つ、さまざまなタイプのニア・インタラクション・メニューを紹介します。

  • Tag-along動作のためのToggle Pinボタン
  • 近接していることを示す視覚的な合図でプレートをつかむことができる
  • 掴んだ時の自動ピン

Input

image.png

DictationExample

音声を録音し、音声のテキスト化を行う

image.png

ディクテーションの例

ディクテーションとは、音声クリップを録音し、その音声を文字に起こしたものを入手する機能です。ディクテーションを使用するには、ディクテーションデータプロバイダがInput System Profileに登録されている必要があります。Windows Dictation Input Providerは、標準で提供されているディクテーションシステムです。

この例では、DictationPanelのDictation Handlerスクリプトを使用して、TranscribedTextのテキストに口述録音サービスで作成されたトランスクリプションを設定しています。Dictation Handlerの機能以上の制御が必要な場合は、スクリプトにIMixedRealityDictationHandlerを実装することで、独自のディクテーションハンドラを実装することができます。

DisablePointersExample

ポインターが非表示に
image.png

ポインタの無効化の例

このシーンでは、PointerUtils を使用して、ハンドレイ、視線、グラブ、ポークなどのポインターをコードからオン/オフする方法を紹介しています。

使用方法
Toggle Pointers」の下にあるトグルボタンをクリックすると、さまざまな光線のオン/オフができます。また、HoloLens 1(GGVポインターのみ)、HoloLens 2(Grab、Poke、Lineポインター)、VR(Line、teleportポインターのみ)で使用される特定の共通モードにUIを設定することができます。 行き詰まったら「reset example」と言ってください。

セットアップ
この例では、HoloLens 1 - style GGV pointerとHoloLens 2 - style Line Pointerの両方を有効にするカスタムプロファイルを使用しています。HoloLens 1 と 2 のスタイルのインタラクションを切り替えるには、あなたのプロファイルがこの例のポインターのプロファイルをコピーしていることを確認してください。

PointerUtilsを呼び出して、入力システムの様々なポインターを有効/無効にする方法については、TurnPointersOnOffControllerをご覧ください。

InputActionsExample

image.png

入力アクションの例

このシーンでは、さまざまなソースからの入力をユーザー定義の入力アクションにマッピングし、1つのリスナーで処理する方法を紹介します。

回転可能なオブジェクトにフォーカスがある状態で、次のいずれかのアクションを試してみてください。

  • Xbox コントローラのボタン B を押す。
  • Rotate」と言います。
  • Hold」のジェスチャーを行います。エディタで、スペースバーを押しながらマウスの左ボタンを押すと、この操作ができます。

これらはすべて、オブジェクトの回転を引き起こすはずです。

これを実現するために、カスタムの「Rotate」入力アクションを作成し、それを各入力にマッピングし、アクションを処理してオブジェクトを回転させるInputActionHandlerスクリプトを追加しました。詳細は、右のパネルをご覧ください。

入力アクションの作成

Mixed Reality Toolkit Configuration」、「Input System」、「Input Actions」の各プロファイルを、デフォルトのものをクローンしてカスタム作成しました。入力アクションのプロファイルには、「Rotate」という名前の新しい入力アクションを追加しました。タイプは「Digital」で、オン/オフの入力にマッピングされます。

アクションの入力へのマッピング
Xboxコントローラのボタンについては、デフォルトのコントローラマッピングプロファイルをクローンし、コントローラのエントリを編集して、Bボタンのアクションとして「Rotate」を選択しました。

スピーチコマンドについては、デフォルトのSpeech Commandsプロファイルをクローンし、キーワード「Rotate」をRotateアクションにマッピングした新しいスピーチコマンドを追加しました。

ジェスチャーについては、デフォルトのGesturesプロファイルをクローンし、Holdジェスチャーのアクションを「Rotate」に変更しました。エディター内でジェスチャーシミュレーションを使用するために、デフォルトの入力シミュレーションプロファイルをクローンし、ハンドシミュレーションモードを「Gestures」に設定しました。

アクションの処理
Rotatable オブジェクトに InputActionHandler スクリプトを追加し、処理する入力アクションとして「Rotate」を選択し、Action Ended イベントを Rotator スクリプトの Rotate() メソッドにフックアップしました。

InputDataExample

image.png

入力データの例

このシーンでは、手、頭、目、視線、モーションコントローラの位置、回転などの入力データにアクセスする方法を示しています。

InputUtils の入力データ
※ここに実行中のデータがインタラクティブに表示されます

コントローラからの入力データ

以下のデータは、シーン内のすべてのアクティブなコントローラのController.Interactionsを照会して得られたものです。
詳細はInputDataExample.csを参照してください。

image.png

PointerResultExample

image.png

ポインターの結果の例

このシーンでは、ポインターのヒット位置を利用して、ポインターのクリック時にオブジェクトをスポーンする方法を示しています。

このシーンの再生中にBoard gameオブジェクトを任意のポインタでクリックすると、現在のポインタのヒットポイントにポストイットノートが生成されます。

設定
この動作を実現するために、Board game のオブジェクトに PointerHandler スクリプトを追加し、ポインタのイベントをリッスンするようにしました。次に SpawnOnPointerEvent スクリプトを作成し、ポインターの結果に含まれるヒットポイントでゲームオブジェクトをインスタンス化する Spawn メソッドを作成しました。最後に、PointerHandler の OnPointerClicked イベントに Spawn メソッドを接続しました。

PrimaryPointerExample

image.png

プライマリポインタの例

この例では、primary pointer changed イベントを使って primary pointer を追跡する方法を示します。PrimaryPointerHandlerExample スクリプトは、これらのイベントを使用して、現在のプライマリポインタのカーソルにハイライトを適用します。

プライマリポインタを決定するデフォルトのロジックを知るために、様々なコントローラを使って、チーズを選択して操作したり、コントローラを切断したり、強制的にトラッキングロスを起こしたりしてみることをお勧めします。

プライマリポインターを選択するロジックは、Pointer Profileで設定できます。プライマリ ポインタ セレクタ インターフェースを実装した独自のカスタム ロジックを作成し、プロファイルでプライマリ ポインタ セレクタとして選択することができます。

詳細については、Primary Pointerのドキュメントを参照してください。

SpeechInputExamples

image.png

音声入力の例

このシーンでは、音声コマンドの設定と使用方法を紹介します。

Mixed Reality ToolkitコンポーネントのInput Systemプロファイルの下にあるSpeech Commandsプロファイルには、open、close、selectの3種類のコマンドが設定されています。

Global Speech Handler」ゲームオブジェクトは、「Is Focus Required」が設定されていない「Speech Input Handler」コンポーネントを使用して、フォーカスに関係なくスピーチコマンドイベントをリッスンします。「open」「close」コマンドに応じて、メニューオブジェクトをアクティブにしたり、非アクティブにしたりします。

ローカルスピーチハンドラは、フォーカスされているときに音声コマンドを聞き取り、'select'が使用されるとテキストの状態を変更します。

スピーチ確認用ラベル(オプション

SpeechInputHandler.csには、SpeechConfirmationTooltipプレハブのフィールドがあります。このプレハブを割り当てると、音声認識時にアニメーションのテキストラベルが表示されます。

HandJointChaserExample

image.png

ハンドジョイントチェイサー

このサンプルシーンでは、Solverを使って手の関節を追跡する方法を説明します。
ソルバーハンドラーで、「参照する追跡オブジェクト」を「手の関節の左右」に選択し、特定の関節に対して「追跡された手の関節」を選択します。


PulseShader

image.png

PulseShaderHandMeshExample

handmesh.gif

パルスシェーダ - ハンドメッシュ

このシーンでは、ハンドメッシュの視覚化にパルスシェーダを使用することを示しています。MRTK Profilesの「Hand Mesh Visualization Mode」がオンになっていることを確認してください。PulseControlScripts_HandMesh オブジェクトには、パルスのスクリプトが含まれています。

PulseShaderSpatialMeshExample

spacemesh.gif

パルスシェーダ - 空間メッシュ

このシーンでは、パルスシェーダを空間メッシュの可視化に使用することを示しています。MRTK Profiles の「Spatial Awareness」がオンになっていることを確認してください。 PulseShaderSpatialMeshHandler スクリプトは、PulseShaderSpatialMeshParent プレハブに添付されます。 このプレハブは、HoloLens デバイスの使用中にインスタンス化され、ランタイムの空間メッシュ階層に追加されます。 このプレハブは、Spatial Awareness Profile に含まれる Runtime Spatial Mesh Prefab プロパティで参照されます。


ReadingMode

image.png

image.png

ReadingModeDemo

このシーンでは、視界を変えるためのオプションを紹介します。

Reading Mode

リーディングモードは、システムの視野を変更します。 これを有効にすると、視野が狭くなりますが、細部がシャープになる可能性があります。 有効にした後にホログラムの安定性が失われた場合は、Stereo Rendering ModeをMulti Passに設定してください。 これはバグを回避するものです。 リーディングモードは没入型ヘッドセットでも機能しますが、主にHoloLens 2ハードウェアで有用です。

Render Viewport Scale

このスライダの位置を変更すると、アプリケーションによってレンダリングされるピクセル数が減少します。これにより、レンダリングが複雑になって60FPSを下回るような場面でも、60FPSを維持できる場合があります。


ScrollingObjectCollection

ScrollingObjectCollection

image.png

スクロールオブジェクトコレクション

このサンプルシーンでは、ScrolingObjectCollectionコンポーネントを使って、さまざまなタイプのスクロール操作を実演しています。

このコントロールは、3Dコンテンツを表示領域内でスクロールさせることができます。フレームの移動は、コントローラを使ったクリック&ドラッグや、個別のページネーションによってトリガすることができます。

scr0.gif
scr1.gif
scr2.gif

Solvers

image.png

DirectionalIndicatorSolverExample

coffee.gif

方向指示器の例

このシーンは、実験的なソルバーである「方向指示器」の使用例です。このソルバーは、ユーザーがシーンの中の希望のポイントに向かって振り向くように指示するUXに適用できます。

使用方法
方向指示器を使って、シーンの中のコーヒーカップを探します。コーヒーカップが視界に入るとシェブロンは消えます。

一般的に、インジケータの参照フレームはカメラですが、手やシーン内の他のトランスフォームに取り付けることもできます。

SolverHandler Tracked Target Typeを変更して、基準となるフレームとして何を使うかを決定します。

Directional Indicatorコンポーネントの "DirectionTarget "プロパティで、シーン内で発見されるべきポイントを決定します。

FollowSolverExample

followmenu.gif

Follow Solver Example

ソルバーは、ユーザーが定義した特定の境界内に参照オブジェクトを保持します。

  • カメラを起点とした四角錐の範囲内にオブジェクトを維持する角度境界を指定することができます。
  • ユーザーはこの角度境界を無効にすることができ、オブジェクトはカメラから一定の角度で維持されます。
  • 距離境界を指定して、オブジェクトをカメラからの最小および最大距離内に保つことができます。
  • 参照オブジェクトの向きを変えるタイミングと方法を指定するためのオプションが多数用意されています。
  • ユーザー定義の追加トランスフォームに対応する機能を追加しました。

SolverExamples

image.png

ソルバーの例

ソルバーとは、あらかじめ定義されたアルゴリズムに従って、オブジェクトの位置と向きを計算する手段を容易にするコンポーネントです。例えば、ユーザーの視線のレイキャストが当たっている面に、オブジェクトを配置することができます。

さらに、コンポーネントの更新順序をUnityに指定する信頼できる方法がないため、ソルバーシステムは、これらの変換計算のための操作順序を決定論的に定義します。

使用方法
このシーンを使用するには、下のボタンを使用して、コーヒーカップに取り付けられているソルバーの種類を設定します。 さらに、左には、InBetweenソルバーの例があります。手前のサーフェスは、SurfaceMagnetismソルバーの探索に便利です。

SurfaceMagnetismSpatialAwarenessExample

mag.gif

表面磁力 / TapToPlace + 空間認識の例

このシーンでは、表面磁界ソルバーと空間認識能力を組み合わせて使用しています。この2つを使うことで、オブジェクトを表面にスナップさせたり、ポインタに追従させたりすることができます。この例のシーンでは、平面は、サーフェイスの法線に合わせながら、ハンドレイの終点を追いかけています。

TapToPlaceExample

movebox.gif

タップトゥプレイスの例

タップトゥプレイスは、オブジェクトをサーフェスに配置します。 サーフェスが検出されない場合、オブジェクトは、ソルバーハンドラ内にあるTrackedTargetType(Head、Controller Ray、Hand Joint)に対してデフォルトの距離で配置されます。 これは、遠距離のインタラクションコンポーネントです。

使用方法
このシーンを使用するには、動かしたいオベージョントにフォーカスし、エアタップ/ピンチのジェスチャーで選択します。 頭を動かしてオブジェクトを動かします。 配置するには、もう一度エアータップ/ピンチします。 2回目のエアタップでは、対象物にピントが合っている必要はありません。


SpatialAwareness

image.png

SpatialAwarenessMeshDemo

image.png

Spatial Awareness Mesh(空間認識メッシュ

このシーンは、Spatial Awareness Meshシステムのデモンストレーションです。このシーンでは、あなたの環境がワイヤーフレームのメッシュとして表示されます。

空間を移動すると、メッシュデータが表示されます。

自分の動きに合わせて、メッシュが前に現れたり、後ろに消えたりします。

観測データの消去
球体をクリックすると、観測者が中断され、すべての観測データが消去されます。

観測の再開
観測データを消去した後に球体をクリックすると、観測者が再開され、空間認識メッシュの表示が再開されます。


StandardShader

image.png

ClippingExamples

slice.gif

クリッピングの例

このシーンでは、MRTK/Standardシェーダとクリッピングプリミティブ(ClippingPlane、ClippingSphere、ClippingBox)を組み合わせて、メッシュ上のピクセルを動的に切り取る方法を紹介しています。

使い方
平面、球体、箱形のプリミティブを、近距離または遠距離の相互作用で掴んでみてください。その後、プリミティブをハートと交差するまで移動させます。プリミティブと交差するハートの部分は、レンダリングされないことがわかります。

その他の機能

  • ハートをつかんで移動させることもできます。
  • また、両手で操作することで、プリミティブとハートを拡大縮小することができます。

ClippingInstancedExamples

clipins.gif

インスタンスクリッピングの例

このシーンでは、MRTK/Standardシェーダとクリッピングプリミティブ(ClippingPlane、ClippingSphere、ClippingBox)を組み合わせて、GPU上にインスタンス化されたメッシュ上のピクセルを動的にクリップする方法を紹介しています。この方法では、同じマテリアルを共有するすべてのレンダラーが異なるクリッピングプリミティブを使用していても、自動的にバッチ処理を行うことができるため、非常に多くのクリッピングされたメッシュを作成することができます。

HoverLightExamples

light.gif

ホバーライトの例

このシーンでは、MRTK/StandardシェーダとHoverLightsを組み合わせて、メッシュをダイナミックに照明する方法を紹介しています。

MRTK標準シェーダはデフォルトで2つのホバーライトをサポートしていますが、シーンにライトが追加されると4つ、10つとスケールアップしていきます。
シーンにライトが追加されると、4個、10個と増えていきます。多くのホバーライトでマテリアルを照らすと、ピクセルシェーダの命令が増え、パフォーマンスに影響します。
が増え、パフォーマンスに影響します。

ライトの変更は、プロジェクト内でプロファイルしてください。

MaterialGallery

image.png

マテリアルギャラリー

このシーンでは、MixedRealityToolkit/Standardシェーダーで可能なマテリアルとシェーディングのテクニックの例を示しています。このシェーダーの目的は、UnityのStandard Shaderに似たビジュアルを実現すること、Fluent Design Systemの原則を実装すること、そしてMRデバイスでのパフォーマンスを維持することです。
MixedRealityStandard.shader
前半の2列は、プログラムによるFluent Design Systemのボーダー、ホバーライティング、インナーグローの例を示しています。後列は標準的なシェーディングの例です。

HoverLight.cs
MixedRealityToolkit/Standardで使用可能な光をシミュレートして視覚化するユーティリティーコンポーネント。
MixedRealityToolkit/Standard シェーダーの「_HoverLight」機能で使用できるライトをシミュレートして視覚化するユーティリティーコンポーネントです。このシーンのゲームオブジェクト "CursorVisual "の使用例を参照してください。

ClipPlane.cs
MixedRealityToolkit/Standardシェーダーで使用できるクリッピングプレーンをアニメーション化して視覚化するユーティリティーコンポーネントです。
MixedRealityToolkit/Standardシェーダーの「_ClippingPlane」機能で使用できるクリッピング・プレーンをアニメーション化し、視覚化するユーティリティー・コンポーネントです。シェーダーボールの「Clipping Plane」と「Clipping Plane Soft」を参照してください。

OutlineExamples

image.png

アウトラインの例

このシーンでは、MRTK/StandardシェーダとMeshOutline、MeshOutlineHierarchy、MeshSmootherコンポーネントを組み合わせて、様々なテクニックを使ってメッシュレンダラをアウトライン化する方法を紹介します。

使い方
シーンを再生すると、立方体と球体の周りにアウトラインがレンダリングされます。ランダーやトーラスにアウトラインを表示するには、そのオブジェクトを見たり、操作したりします。

その他の情報
アウトライン化は、より大きなサイズに押し出されたメッシュを2回目にレンダリングすることで行われます。安価ではありませんが、この手法はアウトラインのポストプロセス効果よりもモバイルデバイスでのパフォーマンスが高くなります。一部のメッシュのトポロジーにより、押し出しが正しく拡大されない場合があります。この問題を解決するには、MeshSmootherコンポーネントを使用して、メッシュの法線をスムーズにすることができます。MeshSmootherは、MeshOutlineまたはMeshOutlineHierarchyコンポーネントを使用し、アウトラインマテリアルでスムース法線の使用が指定されている場合に自動的に行われます。

StandardMaterialComparison

image.png

標準マテリアルの比較

このシーンでは、Unity/StandardシェーダとMRTK/Standardシェーダを比較しています。従来のPBRスタイルのマテリアルマトリックスが、メタリックとスムースネスのプロパティを変えて表示されています。比較の統計データは以下の通りです。

Unity/Standard Shader

バーテックスシェーダの統計。
D3D11:32平均演算(22...55)

フラグメントシェーダの統計。
d3d11:平均演算数135(94...176)、平均テクスチャ数5(3...7)、平均ブランチ数5(2...8)

MRTK/Standard Shader

バーテックスシェーダの統計
d3d11:21個の平均演算(8...56)

フラグメントシェーダの統計
d3d11:平均演算数47 (1..89)、平均テクスチャ数0 (0..1)

StandardMaterials

image.png

MRTK標準素材

このシーンでは、Mixed Reality Toolkitで提供されている標準的な素材を紹介します。これらの素材は、MixedRealityToolkit-SDK\Resources\Materialsフォルダに入っています。

素材リスト

MRTK_Standard_Blue.mat
MRTK_Standard_Charcoal.mat
MRTK_Standard_Cyan.mat
MRTK_Standard_Emerald.mat
MRTK_Standard_Gray.mat
MRTK_Standard_Green.mat
MRTK_Standard_Lime.mat
MRTK_Standard_Magenta.mat
MRTK_Standard_Orange.mat
MRTK_Standard_Pink.mat
MRTK_Standard_Purple.mat
MRTK_Standard_Red.mat
MRTK_Standard_White.mat
MRTK_Standard_Yellow.mat

Utilities

image.png

MixedRealityCapabilityDemo

image.png

このシーンでは、基礎となるプラットフォームと、少なくとも1つの登録済みのシステムまたはデータ・プロバイダーがサポートする複合現実感機能を照会して表示します。

このシステムでは、以下のケイパビリティ・サポートが報告されています。
※環境により変化


UX

image.png

BoundingBox

BoundingBoxExamples

image.png

バウンディングボックスの例

バウンディングボックスは、複合現実感の中でオブジェクトを操作するための標準的なUIです。このサンプルシーンでは、バウンディングボックスの様々なタイプの視覚化と起動オプションを実演しています。

BoundingBoxRuntimeExample

image.png

バウンディングボックスの実行例

この例題では、ランタイムにバウンディングボックスを作成し、さまざまなバウンディングボックスのプロパティを変更する方法を示します。

次の例に進むには、「select」と言うか「1」を押してください。

BoundsControlExamples

image.png

バウンディングコントロールの例

バウンディングボックスは、複合現実感の中でオブジェクトを操作するための標準的なUIです。BoundsControl.csスクリプトでは、様々なタイプのバウンディングボックスの視覚化と起動オプションを提供します。

BoundsControlRuntimeExample

image.png

バウンズコントロールのランタイム例

この例では、ランタイムにバウンズコントロールを作成し、様々なバウンズコントロールのプロパティを変更する方法を示します。

次の例に進むには、「select」と言うか、「1」を押してください。

Collections

ObjectCollectionExamples

image.png

オブジェクトコレクションの例

Mixed Reality ToolkitのObject Collectionは、オブジェクトの配列をあらかじめ定義された3次元形状にレイアウトすることができるレイアウトコントロールです。オブジェクトの半径やサイズ、オブジェクト間のスペースを調整することができます。オブジェクトコレクションは、2D、3Dを問わず、Unityのあらゆるオブジェクトに対応しています。現在、5つのサーフェスがサポートされています。

  • Plane - X Y座標の平らなグリッド
  • Cylinder - 列は円柱の高さを表し、半径は各列にあるオブジェクトの数を定義します。
  • Sphere - 標準的な球形に沿ってマッピングされます。行の数によって、球体のどの部分がマッピングされるかが決まります。
  • Radial - アングルクランプを持つ単一のリングで、列は同心円状に表示されます。
  • Scatter - 定義された半径内でのランダムなレイアウトです。

Dialog

DialogExample

image.png

image.png

ダイアログの例

このシーンでは、Dialogコントロールの使い方を説明しています。DialogExampleController.csは、コードでDialogコントロールを開く方法を示しています。タイトル、説明文、配置場所(近くか遠くか)を指定できます。HoloLens 2 では near 配置オプションを使用します。

ダイアログのプレハブ

  • DialogLarge_192x192.prefab
  • DialogMedium_192x128
  • DialogSmall_192x96.prefab

ダイアログ例
これらのボタンを使って、ダイアログの例を開きます。詳細は DialogExampleController.cs を参照してください。

Dwell

DwellExample

image.png

ドウェルの例

このシーンでは、注視と滞留の動作を示しています。このシーンで視線ベースのドエル動作を表示するために、MRTKプロファイルがHoloLens 1スタイルのプロファイルに変更されており、そこではヘッドゲイズポインターが使用されています。シーンでドウェルを使用するには、入力プロファイル/アクティブポインターが、DwellHandlerスクリプトコンポーネントのドウェルトリガーポインタータイプと正しく一致していることを確認する必要があります。

Interactables

InteractablesExamples

image.png

Interactableの例

インタラクテブルは、ボタンや UI コントロールなどのインタラクティブ コンテンツを構築するための基本コンポーネントで、インタラクティブな状態に基づいてフィードバックを行います。インタラクテブルには、音声コマンドを追加することができ、あらゆる種類の感覚的なフィードバックのための深いテーマ設定システムを提供します。

詳細な機能、オプション、使用方法については、ドキュメントを参照してください。

LineExamples

image.png

ラインの例

Mixed Reality Toolkitに搭載されているラインは、2つのコンポーネントに分かれています。データとレンダラーです。

ライン データ プロバイダ
そのラインのすべての特性と、それに関連するすべてのデータを定義するラインコンポーネントです。これは、シーン内でのラインのレンダリングに関する一切の処理を行わず、パスや補間などに使用します。

  • Simple Line - 2つの点を持つ線
  • Parabola - 2点間の放物線状の弧
  • Rectange - 4つの角を持つループ状の線。
  • Ellipse - コーナーのないループ状の線。
  • Spline - ベジェ補間された多点の直線。

ラインレンダラー
コンポーネントは、ラインデータを受け取り、それをシーンにレンダリングします。

  • MixedRealityLineRenderer - Unityの内蔵ラインレンダラーコンポーネントをインプリメントし、ラインデータを適用します。
  • ParticleSystemLineRenderer - ラインの長さに沿って、パーティクルシステムのセットを取り付けます。
  • MeshLineRenderer - メッシュのインスタンスを作成して、ラインの長さに沿って配置します。
  • StripMeshLineRenderer - ラインの長さに沿ってポリゴンのストリップを描画します。

ManipulationHandler

ManipulationHandlerExample

image.png

Manipulation Handlerの例

この例では、球体を操作することができます。球体が壁にぶつかると、相互作用は止まります。

ObjectManipulatorExample

image.png

オブジェクトマニピュレータの例

この例では、球体を操作することができます。球体が壁にぶつかると、相互作用は止まります。

ObjectManipulatorExamplePhysics

image.png

ObjectManipulator物理プレイグラウンド

これは、ObjectManipulatorの物理機能をテストするためのシーンです。
立方体には重力がかかっています。
球体には重力がかかっていません。
八面体は静的なコリダーです。
ラインの例

Mixed Reality Toolkitに搭載されているラインは、2つのコンポーネントに分かれています。データとレンダラーです。

ライン データ プロバイダ
そのラインのすべての特性と、それに関連するすべてのデータを定義するラインコンポーネントです。これは、シーン内でのラインのレンダリングに関する一切の処理を行わず、パスや補間などに使用します。

  • Simple Line - 2つの点を持つ線
  • Parabola - 2点間の放物線状の弧
  • Rectange - 4つの角を持つループ状の線。
  • Ellipse - コーナーのないループ状の線。
  • Spline - ベジェ補間された多点の直線。

PressableButton

PressableButtonExample

image.png

Pressable Buttonの例

このサンプルシーンでは、HoloLens 2のシェル型ボタンをはじめ、Pressable Buttonsの様々なカスタマイズ例を紹介しています。

自分のシーンへの適用方法

Assets\MRTK\SDK\Features\UX\Interactable\Prefabs
などからPrefabを適用する 

ProgressIndicator

ProgressIndicatorExamples

image.png

プログレスインジケータの例

ProgressIndicatorDemo.cs スクリプトを開いて、プログレス・インジケータの開閉や切り替えの方法を確認できます。

自分のシーンへの適用方法

Assets/MRTK/SDK/Features/UX/Prefabs/ProgressIndicators
からPrefabを適用する

Slate

SlateExample

image.png

スレートの例

このサンプルシーンでは、HandInteractionPanZoomスクリプトをSlateプレハブで使用しています。「ContentQuad」では、パンやズームのインタラクションに関するさまざまな設定オプションを確認できます。

自分のシーンへの適用方法

Assets/MRTK/SDK/Features/UX/Prefabs/Slate
からPrefabを適用する

Slider

SliderExample

image.png

スライダーの例

ピンチスライダーコントロールの使用例をご紹介します。OnSliderUpdatedのSliderEventDataの値(eventData.NewValue)を使って、他のアクションを行うことができます。

自分のシーンへの適用方法

Assets/MRTK/SDK/Features/UX/Prefabs/Sliders
からPrefabを適用する

Text

TextPrefabExamples

image.png

テキストプレハブの例

これらのテキストプレハブは、Text3DShaderを使って適切なスケーリング値とオクルージョンをサポートし、品質を最適化しています。通常のUnityシェーダーと比較して、品質とオクルージョンを比較してみてください。

*高品質なテキストレンダリングや詳細なテキストオプションをご希望の場合は、TextMesh Proの使用をお勧めします。

Tooltips

TooltipExamples

image.png

ツールチップの例

ツールチップは、通常、オブジェクトをよく見たときにヒントや追加情報を伝えるために使用されます。Tooltipは、物理的な環境にあるオブジェクトに注釈を付けるために使用できます。

ツールチップはLineDataProviderの概念を利用しており、直線、放物線、スプライン線を利用できます。直線には様々な色を使用することができます。

技術的な詳細については、MRTKのドキュメントを参照してください。

自分のシーンへの適用方法

Assets/MRTK/SDK/Features/UX/Prefabs/Tooltips
からPrefabを適用する


おわりに

サンプルをすべて実行させるだけでも結構大変です。
この記事が時短のきっかけになれば幸いです。

2.5.0のときのものはHiromuさんがまとめられています。参考にさせてもらいました。
https://www.hiromukato.com/entry/2020/10/04/172441
https://www.hiromukato.com/entry/2020/10/04/172633

以上

6
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
6
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?