HoloLens 2が破壊するMixed RealityのUI/UX ~HoloLens 2が体現する次世代のUI/UXとは?~

HoloLens 2が破壊するMixed RealityのUI/UX ~HoloLens 2が体現する次世代のUI/UXとは?~

2019/07/27(土)
Kobe HoloLens ミートアップ vol.1
@神戸デジタル・ラボ 登壇資料です!

Transcript

  1. 1.

    © 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 .
  2. 2.

    ・ 堀 尾 風 仁 ・ @ 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
  3. 3.

    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 @ 台 北 , 台 湾
  4. 4.

    K D L が A R に 取 り 組

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

    © 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 開 発 事 例 ( 概 要 )
  6. 6.

    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社のパートナーが存在
  7. 7.

    本 日 の お 話 す る こ と /

    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
  8. 8.

    本 日 の お 話 す る こ と /

    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
  9. 9.
  10. 10.
  11. 11.

    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/
  12. 12.

    M R D e v D a y s ー

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

    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 実 物 は 非 常 に 、 い や と て も 、 、 、 本 当 に 最 高 で し た 。
  14. 14.
  15. 16.
  16. 17.
  17. 18.
  18. 19.

    E y e T r a c k i n

    g / 視 線 追 跡 で 可 能 に な る 操 作 圧倒的未来、、だが、現代人は慣れるのに時間が必要
  19. 20.

    E y e T a r g e t i

    n g / 視 線 の 向 き で オ ブ ジ ェ ク ト を 指 定 頭を振らずオブジェクトを選択することが可能に (Eye-gaze != Head Gaze)
  20. 21.
  21. 22.
  22. 23.
  23. 24.

    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 さん による 講演
  24. 25.

    M R T K v 2 ー イ ン タ

    ラ ク シ ョ ン 部 分 で の 取 り 組 み 約3年前から新たな [ Hand Interaction ] のカタチを模索してきた
  25. 26.

    M R T K v 2 ー 新 し い

    U I / U X と は ? ユーザーが自然なカタチで仮想オブジェクトとインタラクション可能に
  26. 27.

    M R T K v 2 ー 3 つ の

    コ ン ポ ー ネ ン ト MRTKv2 / HoloLens 2 では 3つの操作方法が存在
  27. 28.

    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 (近接光)
  28. 29.

    M R T K v 2 ー ど の よ

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

    M R T K v 2 ー ど の よ

    う に 没 入 感 の 高 い U I / U X を 実 現 し た の か ? https://blogos.com/article/31798/ yより画像を引用。
  30. 31.

    M R T K v 2 ー ど の よ

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

    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 閾値 – 腕の長さ基準 )
  32. 33.

    M R T K v 2 ー ど の よ

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

    M R T K v 2 ー ど の よ

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

    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
  35. 36.

    M R T K v 2 ー ど の よ

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

    M R T K v 2 ー ど の よ

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

    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 左手 / 右手 を裏返すとハンドメニューを表示することが可能
  38. 39.

    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] 下回転
  39. 40.

    M i x e d R e a l i

    t y グ ロ ー バ ル 市 場 動 向 に つ い て 全世界におけるMR市場動向、地域の市場特性等を解説
  40. 41.

    M i x e d R e a l i

    t y グ ロ ー バ ル 市 場 動 向 に つ い て 2020年から2023年にかけて、市場規模が約8倍に伸びるとの予測
  41. 42.

    M a q u t t e – M R

    プ ロ ト タ イ ピ ン グ ツ ー ル VR空間の中でMRアプリケーションのデザインが可能 / 社内ツールとして開発された
  42. 43.

    M a q u t t e – サ ー

    ビ ス ロ ゴ の 検 討 サービスロゴは約30種類作った / プロダクト愛が凄い
  43. 44.

    M a q u t t e – ラ イ

    ブ デ ザ イ ン プレゼン中にいきなりライブデザイン始まる / 絵になるデザイン姿
  44. 45.

    M a q u t t e – P R

    動 画 帰ったら宣伝してとのことなので、PRします!
  45. 46.

    本 日 の お 話 す る こ と /

    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
  46. 47.

    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アプリケーションの開発を 加速させるコンポーネント群 &サンプルが無償で公開されています
  47. 48.

    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
  48. 49.

    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にも対応 )
  49. 50.

    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
  50. 51.

    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 はそのまま。
  51. 52.

    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 となっている。)
  52. 53.

    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
  53. 54.

    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に保存
  54. 55.

    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 で 表 現 )
  55. 56.

    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 ) の 精 度 が 低 く 描 画 時 に チ ラ つ き が 発 生 す る 現 象
  56. 57.

    M R T K v 2 / U n i

    t y E d i t o r ヒ エ ラ ル キ ー 構 成 旧 : HTK ( HoloToolkit ) 新 : MRTK ( Mixed Reality Toolkit ) バージョンアップで、シンプルで分かりやすいヒエラルキー構成に
  57. 58.

    M R T K v 2 / 3 D ア

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

    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 ) インタフェース &イベントマッピングの変更 → 既存のスクリプトへの変更対応が必要
  59. 60.

    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つのプロファイルが存在
  60. 61.

    D i a g n o s t i c

    s / ア プ リ ケ ー シ ョ ン 診 断 メモリ使用率 ( CPU ) や、FPSなどを簡単に計測することが可能
  61. 62.

    ハ ン ド ト ラ ッ キ ン グ の

    可 視 化 / 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 上 で は 動 作 せ ず )
  62. 63.

    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 …
  63. 64.

    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”と表示されて 正常に動作しているので、 アウトプット先のフォルダを 確認してみてください。
  64. 65.

    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 設定を追加する
  65. 66.

    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
  66. 67.

    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 (ホバー) した際にライトを当てる設定 ポ イ ン タ ー : 衝 突 な し 光 無 し ポ イ ン タ ー : 衝 突 あ り 光 有 り
  67. 68.

    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 手 が 近 い 時 : 光 有 り
  68. 69.

    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
  69. 70.

    本 日 の お 話 す る こ と /

    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
  70. 71.

    破 壊 さ れ た 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 推 奨 ※ こ れ ま で 近 く の オ ブ ジ ェ ク ト は 描 画 せ ず 、 視 野 角 に よ る 見 切 れ 等 に 対 応 し て い た 仮想オブジェクトを表現できる範囲が広がった ( 視野角向上 + ハンドトラッキング )
  71. 72.

    破 壊 さ れ た 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 ) ボ タ ン 配 置 ( 位 置 )
  72. 73.

    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 の 共 通 使 用 は 難 し そ う
  73. 74.

    Thanks. 関 西 ( 神 戸 ) で H o

    l o L e n s 開 発 を 盛 り 上 げ る べ く 一 緒 に 頑 張 り ま し ょ う !