Slide 1

Slide 1 text

© 2019 Kobe Digital Labo Inc. All Rights Reser ved . K o b e H o l o L e n s ミ ー ト ア ッ プ v o l . 1 セ ッ シ ョ ン 登 壇 資 料 H o l o L e n s 2 が 破 壊 す る M i x e d R e a l i t y の U I / U X ~ H o l o L e n s 2 が 体 現 す る 次 世 代 の U I / U X と は ? ~ F u t o H o r i o / K o b e D i g i t a l L a b o I n c .

Slide 2

Slide 2 text

・ 堀 尾 風 仁 ・ @ F u t o _ H o r i o ・ 神 戸 デ ジ タ ル ・ ラ ボ ・ 新 事 業 創 造 係 M R 班 班 長 ・ デ ベ ロ ッ パ ー ズ サ ミ ッ ト 2 0 1 9 ( 冬 ) 登 壇 ポ ス ト ・ ス マ ホ 時 代 に 向 け た U X 最 適 化 → https://codezine.jp/article/detail/11433 A B O U T M E

Slide 3

Slide 3 text

M i x e d R e a l i t y U I / U X の 研 究 開 発 ( R & D ) 国内最大手フォントメーカーのモリサワ様とMR空間におけるフォントの視認性を共同研究 ( 1 ) フ ォ ン ト の 視 認 性 と デ ザ イ ン 性 ( 2 ) フ ォ ン ト が ユ ー ザ ー に 与 え る 影 響 、 U X ( ユ ー ザ ー 体 験 ) の 違 い に つ い て C o m p u t e x 2 0 1 8 @ 台 北 , 台 湾

Slide 4

Slide 4 text

K D L が A R に 取 り 組 む キ ッ カ ケ と な っ た ス マ ー ト グ ラ ス ( 2 0 1 5 ) ARrowNavi 日 本 製 ス マ ー ト グ ラ ス Te l e p a t hy Wa l ke r を 活 用 し た ナ ビ ア プ リ

Slide 5

Slide 5 text

© 2019 Kobe Digital Labo Inc. All Rights Reserved . D i s p l a y A s s i s t a n t C r e a t i v e D e s i g n X 展 示 会 向 け ア プ リ ケ ー シ ョ ン @ C o m p u t e x 2 0 1 8 デ ザ イ ナ ー 向 け ア プ リ ケ ー シ ョ ン @ I n t e r B E E 2 0 1 8 K D L 開 発 事 例 ( 概 要 )

Slide 6

Slide 6 text

M i c r o s o f t M i x e d R e a l i t y パ ー ト ナ ー プ ロ グ ラ ム ( M R P P ) 認 定 資 格 取 得 ( 2 0 1 8 / 0 7 ) ※ 日本国内に26社のパートナーが存在

Slide 7

Slide 7 text

本 日 の お 話 す る こ と / A g e n d a (1 ) MR Dev Days & Microsoft Build 2 0 1 9 で 体 感 し た Ho lo L en s 2 / 2 5 min (2 ) HT K → MRT Kv 2 へ の ポ ーテ ィ ング Tips / 2 0 min (3 ) Ho lo L en s 2 で ど う 変 わる UI /UX ? / 5 min

Slide 8

Slide 8 text

本 日 の お 話 す る こ と / A g e n d a (1 ) MR Dev Days & Microsoft Build 2019 で 体 感 し た Ho lo L en s 2 / 2 5 min (2 ) HT K → MRT Kv2 へ の ポ ー テ ィン グ Tips / 2 0 min (3 ) Ho lo L en s 2 で ど う 変 わる UI /UX ? / 5 min

Slide 9

Slide 9 text

No content

Slide 10

Slide 10 text

No content

Slide 11

Slide 11 text

M i c r o s o f t B u i l d i n g s 9 2 - ど ん な 場 所 ? https://japan.cnet.com/article/35140105/

Slide 12

Slide 12 text

M R D e v D a y s ー 世 界 か ら 約 4 0 0 名 の エ ン ジ ニ ア が 集 ま る 8時半スタートなのに、8時の時点でこの熱気! 世界が注目する Microsoft HoloLens 2 恐るべし!

Slide 13

Slide 13 text

M i c r o s o f t H o l o L e n s 2 / H a n d s O n 実 物 は 非 常 に 、 い や と て も 、 、 、 本 当 に 最 高 で し た 。

Slide 14

Slide 14 text

No content

Slide 15

Slide 15 text

HoloLens HoloLens 2

Slide 16

Slide 16 text

No content

Slide 17

Slide 17 text

No content

Slide 18

Slide 18 text

No content

Slide 19

Slide 19 text

E y e T r a c k i n g / 視 線 追 跡 で 可 能 に な る 操 作 圧倒的未来、、だが、現代人は慣れるのに時間が必要

Slide 20

Slide 20 text

E y e T a r g e t i n g / 視 線 の 向 き で オ ブ ジ ェ ク ト を 指 定 頭を振らずオブジェクトを選択することが可能に (Eye-gaze != Head Gaze)

Slide 21

Slide 21 text

No content

Slide 22

Slide 22 text

No content

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

M R T K v 2 ー H a n d I n t e r a c t i o n s C r a s h C o u r s e HoloLens 2 発表時にデモをしていた Julia さん による 講演

Slide 25

Slide 25 text

M R T K v 2 ー イ ン タ ラ ク シ ョ ン 部 分 で の 取 り 組 み 約3年前から新たな [ Hand Interaction ] のカタチを模索してきた

Slide 26

Slide 26 text

M R T K v 2 ー 新 し い U I / U X と は ? ユーザーが自然なカタチで仮想オブジェクトとインタラクション可能に

Slide 27

Slide 27 text

M R T K v 2 ー 3 つ の コ ン ポ ー ネ ン ト MRTKv2 / HoloLens 2 では 3つの操作方法が存在

Slide 28

Slide 28 text

M R T K v 2 ー ど の よ う に 没 入 感 の 高 い U I / U X を 実 現 し た の か ? https://docs.microsoft.com/en-us/windows/mixed-reality/direct-manipulation Visual (視覚) と Audio (聴覚) で触覚を補う / Proximity Light (近接光)

Slide 29

Slide 29 text

M R T K v 2 ー ど の よ う に 没 入 感 の 高 い U I / U X を 実 現 し た の か ? https://docs.microsoft.com/en-us/windows/mixed-reality/direct-manipulation 仮想オブジェクトの機能を視覚的に知らせる / Affordance (環境が動物に与える意味)

Slide 30

Slide 30 text

M R T K v 2 ー ど の よ う に 没 入 感 の 高 い U I / U X を 実 現 し た の か ? https://blogos.com/article/31798/ yより画像を引用。

Slide 31

Slide 31 text

M R T K v 2 ー ど の よ う に 没 入 感 の 高 い U I / U X を 実 現 し た の か ? https://docs.microsoft.com/en-us/windows/mixed-reality/direct-manipulation 物理世界と同じ動作で仮想オブジェクトを操作 / Instinctual Gestures (直観的な操作)

Slide 32

Slide 32 text

M R T K v 2 ー ど の よ う に 没 入 感 の 高 い U I / U X を 実 現 し た の か ? https://docs.microsoft.com/en-us/windows/mixed-reality/direct-manipulation 遠くにあるオブジェクトは、Hand Ray にて操作可能 ( CGまでの距離 50cm 閾値 – 腕の長さ基準 )

Slide 33

Slide 33 text

M R T K v 2 ー ど の よ う に 没 入 感 の 高 い U I / U X を 実 現 し た の か ? https://docs.microsoft.com/en-us/windows/mixed-reality/direct-manipulation 2D 画面の操作は、スマートフォンと同等のUXを実現

Slide 34

Slide 34 text

M R T K v 2 ー ど の よ う に 没 入 感 の 高 い U I / U X を 実 現 し た の か ? ※ 注 意 点 https://www.youtube.com/watch?v=c1CZsqwnWtM Julia さん 指5本でピアノ弾いてる!

Slide 35

Slide 35 text

M R T K v 2 ー ど の よ う に 没 入 感 の 高 い U I / U X を 実 現 し た の か ? ※ 注 意 点 あれ 指1本でしか弾けない!? H a n d I n t e r a c t i o n E x a m p l e

Slide 36

Slide 36 text

M R T K v 2 ー ど の よ う に 没 入 感 の 高 い U I / U X を 実 現 し た の か ? ※ 注 意 点 https://docs.microsoft.com/en-us/windows/mixed-reality/direct-manipulation 指の衝突判定は人差し指のみ ( 理由 : 触覚がないため意図しない動作が多発 )

Slide 37

Slide 37 text

M R T K v 2 ー ど の よ う に 没 入 感 の 高 い U I / U X を 実 現 し た の か ? ※ 注 意 点 ただし、指5本認識していない という訳ではない。 理論上、個別に実装は可能! ( 右手、左手、表裏を認識可能 )

Slide 38

Slide 38 text

M R T K v 2 ー ど の よ う に 没 入 感 の 高 い U I / U X を 実 現 し た の か ? ※ 注 意 点 https://twitter.com/tcmicka/status/1149385047624974336 H a n d B a s e d M e n u E x a m p l e 左手 / 右手 を裏返すとハンドメニューを表示することが可能

Slide 39

Slide 39 text

M R T K v 2 ー 実 機 無 い 状 況 で の 検 証 方 法 ( U n i t y E d i t o r ) [W] 前進 [S] 後退 [A] 左に進む [D] 右に進む [ Shift ] 左手表示 [ Space ] 右手表示 & [ 左クリック ] Grasp (掴む) & [Q] 右回転 [E] 左回転 [R] 上回転 [F] 下回転

Slide 40

Slide 40 text

M i x e d R e a l i t y グ ロ ー バ ル 市 場 動 向 に つ い て 全世界におけるMR市場動向、地域の市場特性等を解説

Slide 41

Slide 41 text

M i x e d R e a l i t y グ ロ ー バ ル 市 場 動 向 に つ い て 2020年から2023年にかけて、市場規模が約8倍に伸びるとの予測

Slide 42

Slide 42 text

M a q u t t e – M R プ ロ ト タ イ ピ ン グ ツ ー ル VR空間の中でMRアプリケーションのデザインが可能 / 社内ツールとして開発された

Slide 43

Slide 43 text

M a q u t t e – サ ー ビ ス ロ ゴ の 検 討 サービスロゴは約30種類作った / プロダクト愛が凄い

Slide 44

Slide 44 text

M a q u t t e – ラ イ ブ デ ザ イ ン プレゼン中にいきなりライブデザイン始まる / 絵になるデザイン姿

Slide 45

Slide 45 text

M a q u t t e – P R 動 画 帰ったら宣伝してとのことなので、PRします!

Slide 46

Slide 46 text

本 日 の お 話 す る こ と / A g e n d a (1 ) MR Dev Days & Microsoft Build 2 0 1 9 で 体 感 し た Ho lo L en s 2 / 2 5 min (2 ) HT K → MRTKv 2 へ の ポ ーテ ィ ング Tips / 2 0 min (3 ) Ho lo L en s 2 で ど う 変 わる UI /UX ? / 5 min

Slide 47

Slide 47 text

M R T K v 2 / M i x e d R e a l i t y To o l k i t - U n i t y v 2 . 0 . 0 - R C 2 . 1 https://github.com/microsoft/MixedRealityToolkit-Unity Microsoft が主導する オープンソースプロジェクト。 MRアプリケーションの開発を 加速させるコンポーネント群 &サンプルが無償で公開されています

Slide 48

Slide 48 text

M R T K v 2 / M i x e d R e a l i t y T o o l k i t - U n i t y v 2 . 0 . 0 - R C 2 . 1 開発に有用なビルディングブロックがサンプルとして試せます。 H a n d I n t e r a c t i o n E x a m p l e

Slide 49

Slide 49 text

M R T K v 2 / M i x e d R e a l i t y To o l k i t - U n i t y v 2 . 0 . 0 - R C 2 . 1 https://microsoft.github.io/MixedRealityToolkit-Unity/Documentation/Contributing/Roadmap.html RC ( Release Candidate:リリース候補版 ) / ロードマップでは7月中に正式リリース ( ※OpenVRにも対応 )

Slide 50

Slide 50 text

G e t t i n g y o u r e x i s t i n g a p p l i c a t i o n r e a d y f o r H o l o L e n s 2 https://docs.microsoft.com/en-us/windows/mixed-reality/mrtk-porting-guide

Slide 51

Slide 51 text

U p d a t e / I n s t a l l C h e c k L i s t https://docs.microsoft.com/en-us/windows/mixed-reality/install-the-tools 約1週間前に 公式ドキュメントが 更新されていた Visual Studio 2019 ( 16.1 or higher ) ※ GitHub の Requirement はそのまま。

Slide 52

Slide 52 text

U n i t y 2 0 1 8 . 4 ( L T S ) v s U n i t y 2 0 1 9 https://github.com/MicrosoftDocs/mixed-reality/commit/6865bfba6f67fb292351e6881a9b28304591ff79 基本的には、Unity 2018.4.x ( LTS ) を推奨 / ARM64ビルドを試したい場合は、Unity 2019.1+ を使用 ( ※ GitHub上では、Unity 2018.4.x が Required となっている。)

Slide 53

Slide 53 text

U n i t y : S c r i p t i n g B a c k e n d 設 定 ( . N E T → I L 2 C P P ) Unity 2019.1+ より スクリプティングバックエンド .NET が廃止される ( REMOVE ) → 公式ドキュメントでは、.NET から IL2CPP への変更を推奨。 ※ ただし、IL2CPP にするとUnityからVisual Studioへのビルド時間が長くなる [ Player Settings ] > [ Other Settings ] https://docs.microsoft.com/en-us/windows/mixed-reality/recommended-settings-for-unity

Slide 54

Slide 54 text

U n i t y : S c r i p t i n g B a c k e n d 設 定 ( . N E T → I L 2 C P P ) ビ ル ド 時 間 最 適 化 https://docs.unity3d.com/Manual/IL2CPP-OptimizingBuildTimes.html (1) 差分ビルド ( ビルド時に前回ビルド時と同一フォルダを選択する ) (2) プロジェクトフォルダをウィルス対策ソフト対象から除外する (3) プロジェクトフォルダをSSDに保存

Slide 55

Slide 55 text

U n i t y 設 定 最 適 化 : D e p t h B u f f e r S h a r i n g ( 深 度 バ ッ フ ァ の 共 有 ) https://ja.wikipedia.org/wiki/Z%E3%83%90%E3%83%83%E3%83%95%E3%82%A1 Depth Buffer U n i t y メ イ ン カ メ ラ か ら の 深 度 ( 0 ~ 1 で 表 現 )

Slide 56

Slide 56 text

U n i t y 設 定 最 適 化 : D e p t h B u f f e r S h a r i n g ( 深 度 バ ッ フ ァ の 共 有 ) [ P l a y e r S e t t i n g s ] > [ X R S e t t i n g s ] > [ E n a b l e D e p t h B u f f e r S h a r i n g ] か ら 設 定 可 能 Windows へ Depth Buffer を共有することで、ビジュアル品質を向上させることが可能 (16-bit depth) https://docs.microsoft.com/ja-jp/windows/mixed-reality/mrtk-porting-guide Z フ ァ イ テ ィ ン グ : 深 度 情 報 ( D e p t h B u f f e r ) の 精 度 が 低 く 描 画 時 に チ ラ つ き が 発 生 す る 現 象

Slide 57

Slide 57 text

M R T K v 2 / U n i t y E d i t o r ヒ エ ラ ル キ ー 構 成 旧 : HTK ( HoloToolkit ) 新 : MRTK ( Mixed Reality Toolkit ) バージョンアップで、シンプルで分かりやすいヒエラルキー構成に

Slide 58

Slide 58 text

M R T K v 2 / 3 D ア イ コ ン を 小 さ く す る 方 法 ( 水 色 の 表 示 ) 開発時にオブジェクトが見えない、、という問題もこの設定で一発解消 タブ[Gizmos]を選択 → [3D Icons]を最小設定に 設定変更前 設定変更後

Slide 59

Slide 59 text

M R T K v 2 / H T K 2 0 1 7 → M R T K v 2 https://microsoft.github.io/MixedRealityToolkitUnity/Documentation/HTKToMRTKPortingGuide.html HTK 2017 ( HoloToolkit ) → MRTK v2 ( Mixed Reality Toolkit ) インタフェース &イベントマッピングの変更 → 既存のスクリプトへの変更対応が必要

Slide 60

Slide 60 text

M i x e d R e a l i t y To o l k i t P r o f i l e プロファイルを使って、Mixed Reality アプリケーションの設定が可能に ※ MRTKv2 の中には、8つのプロファイルが存在

Slide 61

Slide 61 text

D i a g n o s t i c s / ア プ リ ケ ー シ ョ ン 診 断 メモリ使用率 ( CPU ) や、FPSなどを簡単に計測することが可能

Slide 62

Slide 62 text

ハ ン ド ト ラ ッ キ ン グ の 可 視 化 / H a n d T r a c k i n g https://microsoft.github.io/MixedRealityToolkitUnity/Documentation/InputSystem/HandTracking.html H a n d J o i n t V i s u a l i z a t i o n を 有 効 化 し た 状 態 ( S h i f t + 左 ク リ ッ ク で ) H a n d M e s h V i s u a l i z a t i o n を 有 効 化 し た 状 態 ( U n i t y E d i t o r 上 で は 動 作 せ ず )

Slide 63

Slide 63 text

U n i t y + M R T K v 2 ビ ル ド し た ら エ ラ ー 出 る 問 題 Unity上でエラーは出ているが、ビルド自体は正常に終了してる模様 【 エラー内容 】 Reference Rewriter found some errors while running with command "--target=Temp¥StagingArea¥Data¥ Managed¥Assembly-CSharp.dll …

Slide 64

Slide 64 text

U n i t y + M R T K v 2 ビ ル ド し た ら エ ラ ー 出 る 問 題 https://stackoverflow.com/questions/55916016/problem-building-unity-project-with-mrtk-v2-rc1 Unity ビルドシステム側のバグ 経験則として、 “Build Succeeded”と表示されて 正常に動作しているので、 アウトプット先のフォルダを 確認してみてください。

Slide 65

Slide 65 text

E y e T r a c k i n g / 視 線 追 跡 を 使 用 す る 場 合 の 留 意 点 https://microsoft.github.io/MixedRealityToolkitUnity/Documentation/EyeTracking/EyeTracking_BasicSetup.html Visual Studio 2017上での作業 Package.appxmanifest 機能タブより「視線入力」 Capability 設定を追加する

Slide 66

Slide 66 text

M R T K v 2 S t a n d a r d S h a d e r MRTKv2 には数多くのShader (描画方法を記述するプログラム) が含まれている https://microsoft.github.io/MixedRealityToolkit-Unity/Documentation/README_MRTKStandardShader.html

Slide 67

Slide 67 text

M R T K v 2 S t a n d a r d S h a d e r / H o v e r L i g h t 仮想オブジェクトに Hover (ホバー) した際にライトを当てる設定 ポ イ ン タ ー : 衝 突 な し 光 無 し ポ イ ン タ ー : 衝 突 あ り 光 有 り

Slide 68

Slide 68 text

M R T K v 2 S t a n d a r d S h a d e r / P r o x i m i t y L i g h t ( 近 接 光 ) 仮想オブジェクトに近づいた際に光を当てる設定 P r o x i m i t y L i g h t 手 が 遠 い 時 : 光 無 し P r o x i m i t y L i g h t 手 が 近 い 時 : 光 有 り

Slide 69

Slide 69 text

M R T K v 2 / T o o l t i p s T o o l t i p P r e f a b I n s p e c t o r 上 か ら To o l t i p の 向 き 、 挙 動 を 設 定 可 能 https://github.com/microsoft/MixedRealityToolkit-Unity/blob/mrtk_release/Documentation/README_Tooltip.md

Slide 70

Slide 70 text

本 日 の お 話 す る こ と / A g e n d a (1 ) MR Dev Days & Microsoft Build 2 0 1 9 で 体 感 し た Ho lo L en s 2 / 2 5 min (2 ) HT K → MRTKv 2 へ の ポ ーテ ィ ング Tips / 2 0 min (3 ) Ho lo L en s 2 で ど う 変 わる UI /UX ? / 5 min

Slide 71

Slide 71 text

破 壊 さ れ た M i x e d R e a l i t y U I / U X ー ユ ー ザ ー と オ ブ ジ ェ ク ト の 距 離 H T K 2 0 1 7 ( H o l o T o o l k i t ) → H o l o L e n s ( 1 s t g e n 向 け ) N e a r C l i p 0 . 8 5 m 推 奨 M R T K v 2 ( M i x e d R e a l i t y To o l k i t ) → H o l o L e n s 2 向 け ( プ ロ フ ァ イ ル 使 用 時 ) N e a r C l i p 0 . 1 0 m 推 奨 ※ こ れ ま で 近 く の オ ブ ジ ェ ク ト は 描 画 せ ず 、 視 野 角 に よ る 見 切 れ 等 に 対 応 し て い た 仮想オブジェクトを表現できる範囲が広がった ( 視野角向上 + ハンドトラッキング )

Slide 72

Slide 72 text

破 壊 さ れ た M i x e d R e a l i t y U I / U X ー ユ ー ザ ー と オ ブ ジ ェ ク ト の 距 離 H o l o L e n s ( 1 s t g e n ) → 近 く に あ る と 操 作 し に く い ( H e a d - G a z e + A i r Ta p ) H o l o L e n s 2 → 近 く に 無 い と 操 作 し に く い ! ? ( To u c h & P r e s s ) ボ タ ン 配 置 ( 位 置 )

Slide 73

Slide 73 text

0 . 7 5 m に 生 ま れ た 大 き な 溝 ( N e a r C l i p ) H o l o L e n s ( 1 s t g e n ) と H o l o L e n s 2 U I / U X の 共 通 使 用 は 難 し そ う

Slide 74

Slide 74 text

Thanks. 関 西 ( 神 戸 ) で H o l o L e n s 開 発 を 盛 り 上 げ る べ く 一 緒 に 頑 張 り ま し ょ う !