Slide 1
Slide 1 text
takabrz1 大阪駆動開発 Takahiro Miyaura
Unreal Engine でアプリ開発
～ MRTK UXTools for Unreal V0.9.0 ～
Slide 2
Slide 2 text
宮浦 恭弘 (Miyaura Takahiro)
◼ 大阪駆動開発コミュニティに生息
◼ HoloLens日本販売してからXR系技術に取組む
◼ 普段はよくMixed Reality Toolkitに関する調査している
◼ 新しい技術や、MRに使えそうな技術を調べる
技術Tips : https://qiita.com/miyaura
takabrz1 ※よかったらこれを機にお知り合いになってください
Microsoft MVP for Windows Development 2018-2021
某会社でSE(アプリケーション領域のアーキテクト的なお仕事なはず）＝ XRは趣味です
（貢献領域：Mixed Reality）
✓ リリース機能調べたり・・・
✓ 面白い機能使ってみたり・・・
✓ 新しい実験してフィードバックしたり・・・
最近はこちらが中心
Slide 3
Slide 3 text
本日のお題
Unreal EngineでHoloLens開発
2020/08/19 Copyright © 2020 Takahiro Miyaura
✓Mixed Reality Toolkit UXTools for V0.9.0の話
✓Unreal Engineで開発
✓最小限のプロジェクト構成
✓デプロイに必要な設定 etc…
3
Slide 4
Slide 4 text
Mixed Reality Toolkit UXTools for Unreal V0.9.0
～ Unreal 用MRTK ～
Slide 5
Slide 5 text
Mixed Reality Toolkitに関連するライブラリ
2020/08/19 Copyright © 2020 Takahiro Miyaura
各ゲームエンジン向けにOSSとして提供
◼Mixed Reality Toolkit for Unity(V2.4.0)
✓ButtonやBoundingBox等のUX部品
✓イベント制御系 etc…
◼Mixed Reality Design Labs
◼Unity向けOSSライブラリ
◼UXデザインのサンプル
◼Mixed Reality Toolkit for Unreal（V0.9.0）
◼Unity向けのライブラリと同等を目指す
5
Slide 6
Slide 6 text
Mixed Reality Toolkit UXTools for Unreal
2020/08/19 Copyright © 2020 Takahiro Miyaura
Unity向けMRTKを踏襲しUnreal用に整備
◼Mixed Reality Toolkit for Unreal（V0.9.0）
◼Unity向けのライブラリと同等を目指す
◼V0.9.0でBuilding Blocksの一部が実装
6
Slide 7
Slide 7 text
Mixed Reality Toolkit UXTools for Unreal
～ V0.9.0 リリースノート ～
2020/08/19 Copyright © 2020 Takahiro Miyaura
HoloLens 2 style buttons
◆ https://microsoft.github.io/MixedReality-UXTools-Unreal/version/public/0.9.x/Docs/ReleaseNotes.html#hololens-2-style-buttons
7
◼ MRTKでは定番のHoloLens 2 Style Button
✓ 押ボタン
✓ チェックボックス
✓ トグル
✓ スイッチ
Slide 8
Slide 8 text
Mixed Reality Toolkit UXTools for Unreal
～ V0.9.0 リリースノート ～
2020/08/19 Copyright © 2020 Takahiro Miyaura
Pinch slider
◆ https://microsoft.github.io/MixedReality-UXTools-Unreal/version/public/0.9.x/Docs/ReleaseNotes.html#pinch-slider
8
◼ スライダー操作可能なUX部品
Slide 9
Slide 9 text
Mixed Reality Toolkit UXTools for Unreal
～ V0.9.0 リリースノート ～
2020/08/19 Copyright © 2020 Takahiro Miyaura
Improved far beam visuals
◆ https://microsoft.github.io/MixedReality-UXTools-Unreal/version/public/0.9.x/Docs/ReleaseNotes.html#improved-far-beam-visuals
9
◼ 遠隔操作のためのポインター表現
✓ HoloLens 2標準とほぼ一致
✓ ポインターは点線
✓ 操作時にポインターがしなる等
Slide 10
Slide 10 text
Mixed Reality Toolkit UXTools for Unreal
～ V0.9.0 リリースノート ～
2020/08/19 Copyright © 2020 Takahiro Miyaura
Generic manipulator improvements
◆ https://microsoft.github.io/MixedReality-UXTools-Unreal/version/public/0.9.x/Docs/ReleaseNotes.html#generic-manipulator-improvements
10
◼ 操作対象のScene Componentを任意に変更可能
◼ オブジェクト操作を近距離/遠距離指定可能
◼ Constraint systemの導入
◼ モード変更をBlueprint上で変更可能に
Slide 11
Slide 11 text
Mixed Reality Toolkit UXTools for Unreal
～ V0.9.0 リリースノート ～
2020/08/19 Copyright © 2020 Takahiro Miyaura
Performant shaders and material functions
◆https://microsoft.github.io/MixedReality-UXTools-Unreal/version/public/0.9.x/Docs/ReleaseNotes.html#performant-shaders-and-material-functions
11
◼ Fluent Design Systemに従ったシェーダーや
レンダリングのパフォーマンス
Slide 12
Slide 12 text
Mixed Reality Toolkit UXTools for Unreal
～ V0.9.0 リリースノート ～
2020/08/19 Copyright © 2020 Takahiro Miyaura
New editor utility Blueprints and widgets
12
◼ UXの部品のカスタマイズを容易にす
るために仕組みの提供
Slide 13
Slide 13 text
Mixed Reality Toolkit UXTools for Unreal
～ V0.9.0 リリースノート ～
2020/08/19 Copyright © 2020 Takahiro Miyaura
Configurable front face fraction for buttons
13
◼ 押ボタンの押し込み感を調整する機能
Slide 14
Slide 14 text
Mixed Reality Toolkit UXTools for Unreal
～ V0.9.0 リリースノート ～
2020/08/19 Copyright © 2020 Takahiro Miyaura
Hand constraints
14
◼ アクターが手に追従するコンポーネント
◼ Palm-Up 制約を利用してHand Menuとし
ても利用可能
Slide 15
Slide 15 text
Mixed Reality Toolkit UXTools for Unreal
～ V0.9.0 リリースノート ～
2020/08/19 Copyright © 2020 Takahiro Miyaura
New touchable volume component
15
◼ 任意のタッチ可能なボリュームを利用で
きるコンポーネント
◼ イベントはBlueprintで利用可能
Slide 16
Slide 16 text
Mixed Reality Toolkit UXTools for Unreal
～ V0.9.0 リリースノート ～
2020/08/19 Copyright © 2020 Takahiro Miyaura
Forced grab cancelation
16
◼ オブジェクトをつかんだ状態から強制的にキャンセルするための関数が追加
Slide 17
Slide 17 text
Unreal Engineで開発
～ 最小限の構成 ～
Slide 18
Slide 18 text
2020/08/19 Copyright © 2020 Takahiro Miyaura
Unreal Engineで開発
～ 最小限の構成 ～
大まかな流れ
1. Unreal Engine起動
2. プロジェクト設定 & プラグイン設定
3. MRTK UX-Toolsの導入
4. 空のレベルを作る（シーンみたいなもの）
5. 初期位置と光源の設定
6. ARSessionの開始と終了処理
7. ユーザオブジェクト(装着者に相当)の追加
18
8. ゲームモードの作成(利用オブジェクトの定義等)
9. プロジェクト設定
10. ハンドインタラクションの設定
11. ビルド用の設定
12. ビルド
Slide 19
Slide 19 text
Unreal Engineで開発
～ 最小限の構成 ～
開発環境
2020/08/19
◼ソフトウェア
◼Windows 10 version 1909 or higher.
◼最新の Visual Studio 2019 (試したときは16.5.3)
◼Windows SDK 10.0.18362.0
◼MRTK UX Tools V0.8.X?
◼Unreal Engine 4.25.2
Copyright © 2020 Takahiro Miyaura 19
Slide 20
Slide 20 text
Unreal Engineで開発
～ 最小限の構成 ～
2.プロジェクト設定 & プラグイン設定
2020/08/19
1. 新規プロジェクトを作る
2. カテゴリは[ゲーム]で作成
3. テンプレートは[Blank]で作成
Copyright © 2020 Takahiro Miyaura 20
Slide 21
Slide 21 text
Unreal Engineで開発
～ 最小限の構成 ～
2.プロジェクト設定 & プラグイン設定
2020/08/19 Copyright © 2020 Takahiro Miyaura 21
1. [プロジェクト]は[C++]
2. [パフォーマンス特性]は
[スケーラブルな3D・2D]
3. [コンテンツ]は[スターターコンテンツ無し]
Slide 22
Slide 22 text
Unreal Engineで開発
～ 最小限の構成 ～
2.プロジェクト設定 & プラグイン設定
2020/08/19
1. [編集]-[プラグイン]を選択
2. 以下のプラグインをセットして再起動
• [Augmented Reality]の[HoloLens]
• [Virtual Reality]の[Microsoft Windows Mixed Reality]
Copyright © 2020 Takahiro Miyaura 22
Slide 23
Slide 23 text
Unreal Engineで開発
～ 最小限の構成 ～
3. MRTK UX-Toolsの導入
2020/08/19
1. GithubからUXTools-Unrealを取得
https://github.com/microsoft/MixedReality-UXTools-Unreal
2. public/V0.9.xにブランチを変更
3. UXToolsGame/Pluginsを作ったプロジェク
トの直下にフォルダごとコピー
Copyright © 2020 Takahiro Miyaura 23
https://github.com/microsoft/MixedReality-UXTools-Unreal/releases/tag/v0.9.0
上記のリリースから[UXTools.0.9.0.zip]をダウンロードしてコピーしてもOK
Slide 24
Slide 24 text
Unreal Engineで開発
～ 最小限の構成 ～
4.空のレベルを作る（シーンみたいなもの）
2020/08/19
1. [ファイル] – [新規レベル]を選択
2. [空のレベル]を選択
Copyright © 2020 Takahiro Miyaura 24
Slide 25
Slide 25 text
Unreal Engineで開発
～ 最小限の構成 ～
5.初期位置と光源の設定
2020/08/19
1. [アクタの配置]-[基本]-[プレイヤースタート]
を選択し、エリアにドロップ
2. トランスフォームを下記の通り設定
1. 位置:0,0,0
2. 回転:0,0,0
Copyright © 2020 Takahiro Miyaura 25
Slide 26
Slide 26 text
Unreal Engineで開発
～ 最小限の構成 ～
5.初期位置と光源の設定
2020/08/19 Copyright © 2020 Takahiro Miyaura 26
1. [アクタの配置]-[ライト]-[ディレクションラ
イト]を選択し、エリアにドロップ
2. トランスフォームを下記の通り設定
1. 位置:430,0,430
2. 回転:0,-46.999996,0
Slide 27
Slide 27 text
Unreal Engineで開発
～ 最小限の構成 ～
6.ARSessionの開始と終了処理
2020/08/19
1. [コンテンツブラウザ]-[新規追加]-
[その他]-[データセット]を選択
2. 表示される選択肢の中から
[ARSessionConfig]選択
3. オブジェクト名を
[ARSessionConfig]に変更
Copyright © 2020 Takahiro Miyaura 27
Slide 28
Slide 28 text
Unreal Engineで開発
～ 最小限の構成 ～
6.ARSessionの開始と終了処理
2020/08/19
1. 追加した[ARSessionConfig]を開く
2. 値は変更せずに[保存]を押して閉じる
Copyright © 2020 Takahiro Miyaura 28
Slide 29
Slide 29 text
Unreal Engineで開発
～ 最小限の構成 ～
6.ARSessionの開始と終了処理
2020/08/19
1. メニューの[ブループリント]-[レベルブルー
プリントを開く]を選択
Copyright © 2020 Takahiro Miyaura 29
Slide 30
Slide 30 text
Unreal Engineで開発
～ 最小限の構成 ～
7.ARSessionの開始と終了処理
2020/08/19
1. [イベント BeginPlay]から処理を引出す
2. 実行可能アクションから[StartARSession]を
選択し、パラメータに先ほど作った
[ARSessionConfig]を割り当てる。
Copyright © 2020 Takahiro Miyaura 30
Slide 31
Slide 31 text
Unreal Engineで開発
～ 最小限の構成 ～
6.ARSessionの開始と終了処理
2020/08/19 Copyright © 2020 Takahiro Miyaura 31
1. [イベント EndPlay]から処理を引出す
2. 実行可能アクションから[StopARSession]を
選択する
Slide 32
Slide 32 text
Unreal Engineで開発
～ 最小限の構成 ～
7.ユーザオブジェクト(装着者に相当)の追加
2020/08/19 Copyright © 2020 Takahiro Miyaura 32
1. [コンテンツブラウザ]-[新規追加]-
[ブループリント]-[ブループリント
クラス]を選択
2. [すべてのクラス]の中から
[DefaultPawn]を選択
3. オブジェクト名を[MRPawn]に変
更
Slide 33
Slide 33 text
Unreal Engineで開発
～ 最小限の構成 ～
7.ユーザオブジェクト(装着者に相当)の追加
2020/08/19
1. 追加したMRPawnを選択しコンポーネント
の中からコリジョン関連の設定を探す
2. プリセットを[NoCollision]に設定
Copyright © 2020 Takahiro Miyaura 33
Slide 34
Slide 34 text
Unreal Engineで開発
～ 最小限の構成 ～
8.ゲームモードの作成(利用オブジェクトの定義等)
2020/08/19 Copyright © 2020 Takahiro Miyaura 34
1. [コンテンツブラウザ]-[新規追加]-
[ブループリント]-[ブループリント
クラス]を選択
2. [すべてのクラス]の中から
[GameModeBase]を選択
3. オブジェクト名を[MRGameMode]
に変更
Slide 35
Slide 35 text
Unreal Engineで開発
～ 最小限の構成 ～
8.ゲームモードの作成(利用オブジェクトの定義等)
2020/08/19
1. 追加した[MRGameMode]を開く
2. [Default Pawn Class]を[MRPawn]に変更
Copyright © 2020 Takahiro Miyaura 35
Slide 36
Slide 36 text
Unreal Engineで開発
～ 最小限の構成 ～
9.プロジェクト設定
2020/08/19
1. [編集] – [プロジェクト設定]を
開く
2. [Default Modes]を
[MRGameMode]に変更
3. [Default Maps]を[Main]に変更
Copyright © 2020 Takahiro Miyaura 36
Slide 37
Slide 37 text
Unreal Engineで開発
～ 最小限の構成 ～
10.ハンドインタラクションの設定
2020/08/19
1. [MRPawn]のイベントグラフを開く
2. [イベントBeginPlay]からスタートし左記の
通りイベントを設定
1. SpawnActorFromClass
(クラスからアクタをスポーン)
・Uxt HandInteraction Actorを設定
2. SetHand
・スポーンしたハンドインタラクショ
ンがどちらの手かを設定
Copyright © 2020 Takahiro Miyaura 37
Slide 38
Slide 38 text
Unreal Engineで開発
～ 最小限の構成 ～
11.ビルド用の設定(HoloLens 2デプロイ用モジュール追加)
2020/08/19
1. [Epic Games Launcher]の[ライブラ
リ]から利用しているUnreal Engine
の[オプション]を開く
2. [HoloLens 2]にチェックを入れて
[適用]を押す
Copyright © 2020 Takahiro Miyaura 38
Slide 39
Slide 39 text
Unreal Engineで開発
～ 最小限の構成 ～
11.ビルド用の設定
2020/08/19 Copyright © 2020 Takahiro Miyaura 39
1. [プロジェクト設定]でデプロイ用の設
定を行う
2. [プロジェクト]-[説明]の以下の設定を
行う。
• プロジェクト名 ⇒ 任意
• 企業識別名 ⇒ CN=ほげほげ
※署名に使うコモンネーム
Slide 40
Slide 40 text
Unreal Engineで開発
～ 最小限の構成 ～
11.ビルド用の設定
2020/08/19
1. [プロジェクト設定]でデプロイ用の設
定を行う
2. [プラットフォーム]-[HoloLens]の以下
の設定を行う。
• Build HoloLens Device ⇒ True
• 署名証明書 ⇒ [新規生成]を押す
Copyright © 2020 Takahiro Miyaura 40
Slide 41
Slide 41 text
Unreal Engineで開発
～ 最小限の構成 ～
12.ビルド
2020/08/19
1. [ファイル] – [プロジェクトをパッケージ化]
– [HoloLens]を選択しパッケージ化する
Copyright © 2020 Takahiro Miyaura 41
Slide 42
Slide 42 text
◼Unreal Engine
✓モバイルゲームではおなじみ
✓クロスプラットフォーム開発が可能
✓コーディングの知識がなくてもある程度アプリケーション開発ができる。
まとめ
2020/08/19 Copyright © 2020 Takahiro Miyaura
HoloLens 2から利用できるUnreal EngineにもMRTKが使える
✓ これから整備（ライブラリ等）が充実
42
◼Mixed Reality Toolkit for Unreal（V0.9.0）
◼Unity向けのライブラリの機能が徐々に移植されている
ノンコーディング開発可能1つの方法としてこちらも楽しみ
Slide 43
Slide 43 text
大阪駆動開発
関西を中心に、IT系のおもしろそうなことを楽しんでやるコミュニティ
2020/08/19 Copyright © 2020 Takahiro Miyaura 43