$30 off During Our Annual Pro Sale. View Details »

Nreal Light / Air 開発入門ハンズオン

Nreal Light / Air 開発入門ハンズオン

2022/04/29に開催のハンズオン資料

TakashiYoshinaga

April 29, 2022
Tweet

More Decks by TakashiYoshinaga

Other Decks in Technology

Transcript

  1. Nreal Light/Air開発⼊⾨

    View Slide

  2. ⾃⼰紹介
    ⽒名︓吉永崇(Takashi Yoshinaga)
    専⾨︓ARを⽤いた医療⽀援や運動計測
    Volumetric Video (3Dビデオ)
    コミュニティ︓ARコンテンツ作成勉強会 主催

    View Slide

  3. ARコンテンツ作成勉強会の紹介
    p 2013年5⽉に勉強会をスタート。
    p ARコンテンツの作り⽅をハンズオン形式で学ぶ
    p ⼈数は5~10名程度の少⼈数で実施
    p 参加条件はAR/VRに興味がある⼈(知識不要)
    p 各地で開催 (福岡、熊本、宮崎、⻑崎、⼤分、 ⿅児島、⼭⼝、広島、札幌、関東)

    View Slide

  4. Twitterと勉強会ページで情報を発信しています
    @AR_Fukuoka Googleで「AR勉強会」で検索

    View Slide

  5. #AR_Fukuoka
    #nreal
    ハッシュタグ

    View Slide

  6. 今⽇の内容
    Nreal Light / Airのコントローラを使った
    コンテンツ開発の基本⼿順を解説

    View Slide

  7. 今⽇のゴール
    https://youtu.be/uyxVuTEpdJw

    View Slide

  8. 演習⽤素材のダウンロード
    https://github.com/TakashiYoshinaga/AR-
    Fukuoka/raw/main/20220429_Nreal3DoF/Samples.zip

    View Slide

  9. ハンズオン⼿順
    p Unityプロジェクトの作成
    p NRSDKの基礎
    p オブジェクトのクリック検知
    p オブジェクトのマニピュレーション
    p 何もないところでのクリック検知
    p uGUI操作

    View Slide

  10. ハンズオン⼿順
    オブジェクト
    配置
    p Unityプロジェクトの作成
    p NRSDKの基礎
    p オブジェクトのクリック検知
    p オブジェクトのマニピュレーション
    p 何もないところでのクリック検知
    p uGUI操作

    View Slide

  11. ハンズオン⼿順
    エミュレータ
    実機
    p Unityプロジェクトの作成
    p NRSDKの基礎
    p オブジェクトのクリック検知
    p オブジェクトのマニピュレーション
    p 何もないところでのクリック検知
    p uGUI操作

    View Slide

  12. ハンズオン⼿順
    p Unityプロジェクトの作成
    p NRSDKの基礎
    p オブジェクトのクリック検知
    p オブジェクトのマニピュレーション
    p 何もないところでのクリック検知
    p uGUI操作

    View Slide

  13. ハンズオン⼿順
    p Unityプロジェクトの作成
    p NRSDKの基礎
    p オブジェクトのクリック検知
    p オブジェクトのマニピュレーション
    p 何もないところでのクリック検知
    p uGUI操作

    View Slide

  14. ハンズオン⼿順
    p Unityプロジェクトの作成
    p NRSDKの基礎
    p オブジェクトのクリック検知
    p オブジェクトのマニピュレーション
    p 何もないところでのクリック検知
    p uGUI操作

    View Slide

  15. ハンズオン⼿順
    p Unityプロジェクトの作成
    p NRSDKの基礎
    p オブジェクトのクリック検知
    p オブジェクトのマニピュレーション
    p 何もないところでのクリック検知
    p uGUI操作
    リセットボタン

    View Slide

  16. ハンズオンスタート

    View Slide

  17. ハンズオン⼿順
    オブジェクト
    配置
    p Unityプロジェクトの作成
    p NRSDKの基礎
    p オブジェクトのクリック検知
    p オブジェクトのマニピュレーション
    p 何もないところでのクリック検知
    p uGUI操作

    View Slide

  18. Unity Hub起動
    Unity Hub

    View Slide

  19. プロジェクトの作成 (1/6)
    ①Projects
    ②NewProject

    View Slide

  20. プロジェクトの作成 (2/6)
    EditorVersionを開く

    View Slide

  21. プロジェクトの作成 (3/6)
    2020.3.xxf1
    この資料は2020.3.xを前提に解説をしています

    View Slide

  22. プロジェクトの作成 (4/6)
    ①3D
    ②Project name
    ③保存場所

    View Slide

  23. プロジェクトの作成 (5/6)
    Create project

    View Slide

  24. プロジェクトの作成 (6/6)
    Unity Editorが起動すればOK

    View Slide

  25. 表⽰オブジェクトのインポート (1/5)
    Assets

    View Slide

  26. 表⽰オブジェクトのインポート (2/5)
    ①Import Package
    ②Custom Package

    View Slide

  27. 表⽰オブジェクトのインポート (3/5)
    Scan.unitypackage
    Samplesフォルダ

    View Slide

  28. 表⽰オブジェクトのインポート (4/5)
    Import

    View Slide

  29. 表⽰オブジェクトのインポート (5/5)
    ScanフォルダができればOK

    View Slide

  30. 表⽰オブジェクトをシーンに追加 (1/4)
    Bread
    BreadをHierarchy
    にドラッグ&ドロップ

    View Slide

  31. 表⽰オブジェクトをシーンに追加 (2/4)
    ⼩さすぎてBread
    が⾒えない︖

    View Slide

  32. 表⽰オブジェクトをシーンに追加 (3/4)
    Breadをダブルクリック

    View Slide

  33. 表⽰オブジェクトをシーンに追加 (4/4)
    クローズアップされる

    View Slide

  34. ハンズオン⼿順
    エミュレータ
    実機
    p Unityプロジェクトの作成
    p NRSDKの基礎
    p オブジェクトのクリック検知
    p オブジェクトのマニピュレーション
    p ヘッドトラッキングの活⽤
    p 何もないところでのクリック検知
    p uGUI操作

    View Slide

  35. プラットフォームの設定 (1/4)
    ①File
    ②Build Settings

    View Slide

  36. プラットフォームの設定 (2/4)
    ①Androidを選択
    ②Switch Platform

    View Slide

  37. プラットフォームの設定 (3/4)
    Androidに切り替わる

    View Slide

  38. プラットフォームの設定 (4/4)
    閉じる

    View Slide

  39. NRSDKのインストール (1/4)
    ①Assets
    ②Import Package
    ③Custom Package

    View Slide

  40. NRSDKのインストール (2/4)
    NRSDKをダブルクリック

    View Slide

  41. NRSDKのインストール (3/4)
    Import

    View Slide

  42. NRSDKのインストール (4/4)
    NRSDKフォルダができればOK

    View Slide

  43. Nreal⽤カメラの設定 (1/3)
    MainCameraを削除

    View Slide

  44. Nreal⽤カメラの設定 (2/3)
    Assets
    → NRSDK
    → Prefabs

    View Slide

  45. Nreal⽤カメラの設定 (3/3)
    NRCameraRig
    Hierarchyにドラッグ&ドロップ

    View Slide

  46. 表⽰出⼒の確認
    Gameタブをドラッグして右に移動
    (次⾴参照)

    View Slide

  47. 表⽰出⼒の確認 (1/2)
    こんな感じ

    View Slide

  48. 表⽰出⼒の確認 (2/2)
    カメラとCGが同じ位置(0,0,0)
    にあるため何も⾒えない状態

    View Slide

  49. オブジェクトの位置を調整 (1/4)
    ①Breadをクリック
    ②Positionを下記に変更
    0,-0.08,0.8

    View Slide

  50. オブジェクトの位置を調整 (2/4)
    BreadがSceneからフレームアウトするかも
    Breadが視界内に表⽰

    View Slide

  51. オブジェクトの位置を調整 (3/4)
    Breadをダブルクリック

    View Slide

  52. オブジェクトの位置を調整 (4/4)
    視点が調整され、カメラとの位置関係も確認可能

    View Slide

  53. Sceneの視点調整
    カメラが⼿前に来るように視点を変えると
    実⾏画⾯と⽐較しやすいかもしれない

    View Slide

  54. 現状を保存
    Ctrl/command + S

    View Slide

  55. エミュレーターで動作確認 (1/4)
    Play

    View Slide

  56. エミュレーターで動作確認 (2/4)
    [W][S]: 前後移動
    [A][D]: 左右移動
    [Space]+ドラッグ︓⾸振り

    View Slide

  57. エミュレーターで動作確認 (3/4)
    再度Playをクリックして停⽌

    View Slide

  58. エミュレーターで動作確認 (4/4)
    再⽣ボタンが⻘くなければOK

    View Slide

  59. コントローラの追加 (1/2)
    Assets
    → NRSDK
    → Prefabs

    View Slide

  60. コントローラの追加 (2/2)
    NRInput
    Hierarchyにドラッグ&ドロップ

    View Slide

  61. エミュレーターでのコントローラ使⽤ (1/5)
    Play

    View Slide

  62. エミュレーターでのコントローラ使⽤ (2/5)
    コントローラ画⾯
    ※実際はスマホ画⾯に表⽰される
    コントローラオブジェクト

    View Slide

  63. エミュレーターでのコントローラ使⽤ (3/5)
    ①Gameタブ内をクリック
    ②Shiftを押したままマウスカーソルを
    動かすとポインタも連動して動く

    View Slide

  64. エミュレーターでのコントローラ使⽤ (4/5)
    ①Shiftから指を離すと
    ポインタは動かなくなる
    ②コントローラ画⾯をクリックすると
    ●が表⽰されクリックしたことがわかる

    View Slide

  65. エミュレーターでのコントローラ使⽤ (5/5)
    停⽌

    View Slide

  66. 補⾜︓3DoFを前提に開発 (for Light)
    ①NRCameraRig
    ②NRHMD Pose Trackerの
    TrackingTypeを[3DoF]に変更
    ※今回は不要

    View Slide

  67. 実機で動作確認 (1/7)
    NRSDK

    View Slide

  68. 実機で動作確認 (2/7)
    Project Tips

    View Slide

  69. 実機で動作確認 (3/7)
    Accept All

    View Slide

  70. 実機で動作確認 (4/7)
    Close Window

    View Slide

  71. 実機で動作確認 (5/7)
    スマホ/コンピュータユニットとPCを接続

    View Slide

  72. 実機で動作確認 (6/7)
    ①File
    ②Build And Run

    View Slide

  73. 実機で動作確認 (7/7)
    ①インストーラー名
    ②保存

    View Slide

  74. 動作確認

    View Slide

  75. シーンを名前を付けて保存 (1/3)
    ①File
    ②Save As

    View Slide

  76. シーンを名前を付けて保存 (2/3)
    ①Scene名をSample␣0
    ②保存

    View Slide

  77. シーンを名前を付けて保存 (3/3)
    ①Assets
    ②Sample 0があることを確認

    View Slide

  78. ハンズオン⼿順
    p Unityプロジェクトの作成
    p NRSDKの基礎
    p オブジェクトのクリック検知
    p オブジェクトのマニピュレーション
    p 何もないところでのクリック検知
    p uGUI操作

    View Slide

  79. シーンの複製 (1/4)
    Sample 0を選択して Ctrl + D

    View Slide

  80. シーンの複製 (2/4)
    Sample 1が⽣成される

    View Slide

  81. シーンの複製 (3/4)
    Sample 1をダブルクリック

    View Slide

  82. シーンの複製 (4/4)
    Sample 1に切り替わればOK

    View Slide

  83. スクリプトの追加 (1/5)
    ①Bread
    ②Add Component

    View Slide

  84. スクリプトの追加 (2/5)
    ①検索エリアを空に
    ②New Script

    View Slide

  85. スクリプトの追加 (3/5)
    ①スクリプト名︓TapAndRotate
    ②Create and Add

    View Slide

  86. スクリプトの追加 (4/5)
    TapAndRotateが追加される
    AssetsフォルダにもTapAndRotate.csファイルができる

    View Slide

  87. スクリプトの追加 (5/5)
    TapAndRotateをダブルクリック

    View Slide

  88. オブジェクト回転のスクリプト記述
    public class TapAndRotate : MonoBehaviour
    {
    //回転速度(初期値: 20 deg/sec)
    public float speed = 20.0f;
    //初期化で使⽤(今回は使わない)
    void Start(){ }
    //毎フレーム更新
    void Update()
    {
    //Rotate(x軸,y軸,z軸,回転基準)
    transform.Rotate(
    0, speed * Time.deltaTime, 0, Space.World);
    }
    }

    View Slide

  89. 現状を保存
    ソースコードを保存
    Ctrl/command + S

    View Slide

  90. 動作確認
    Play

    View Slide

  91. 動作確認
    回転する
    ここで速度を変更

    View Slide

  92. 動作確認
    停⽌

    View Slide

  93. 回転On/Offの条件を追加
    //回転速度(初期値: 20 deg/sec)
    public float speed = 20.0f;
    //回転のOn/Off
    bool rotate = false;
    //初期化で使⽤(今回は使わない)
    void Start(){ }
    //毎フレーム更新
    void Update()
    {
    if (rotate)
    {
    transform.Rotate(
    0, speed * Time.deltaTime, 0, Space.World);
    }
    }
    trueになるまで回転しない

    View Slide

  94. コントローラでオブジェクトをクリック (1/6)
    using UnityEngine;
    //NRSDKの読み込み
    using NRKernal;
    //クリックなどのイベント検出
    using UnityEngine.EventSystems;
    public class TapAndRotate : MonoBehaviour
    {
    //回転速度(初期値: 20 deg/sec)
    public float speed = 20.0f;
    //回転のOn/Off
    bool rotate = false;
    void Start(){ }
    void Update()
    {
    if (rotate) {/*スペースの都合により省略*/}
    }
    }

    View Slide

  95. コントローラでオブジェクトをクリック (2/6)
    using UnityEngine;
    using NRKernal;
    using UnityEngine.EventSystems;
    public class TapAndRotate : MonoBehaviour, IPointerClickHandler
    {
    //回転速度(初期値: 20 deg/sec)
    public float speed = 20.0f;
    //回転のOn/Off
    bool rotate = false;
    void Start(){ }
    void Update()
    {
    if (rotate) {/*スペースの都合により省略*/}
    }
    }
    クリック関連のインターフェース

    View Slide

  96. コントローラでオブジェクトをクリック (3/6)
    IpointerClickHandlerにカーソルを合わせる
    ヒントの中から「インターフェイスを実装」を選択

    View Slide

  97. コントローラでオブジェクトをクリック (4/6)
    OnPointerClick関数が追加される

    View Slide

  98. コントローラでオブジェクトをクリック (5/6)
    using UnityEngine;
    using NRKernal;
    using UnityEngine.EventSystems;
    public class TapAndRotate : MonoBehaviour, IPointerClickHandler
    {
    //回転速度(初期値: 20 deg/sec)
    public float speed = 20.0f;
    //回転のOn/Off
    bool rotate = false;
    //このスクリプトが貼られたオブジェクトクリックすると呼ばれる関数
    public void OnPointerClick(PointerEventData eventData)
    {
    throw new System.NotImplementedException();
    }
    void Start(){ }
    void Update(){/*スペースの都合により省略*/}
    }
    OnPointerClick関数内のコードを削除

    View Slide

  99. コントローラでオブジェクトをクリック (6/6)
    using UnityEngine;
    using NRKernal;
    using UnityEngine.EventSystems;
    public class TapAndRotate : MonoBehaviour, IPointerClickHandler
    {
    //回転速度(初期値: 20 deg/sec)
    public float speed = 20.0f;
    //回転のOn/Off
    bool rotate = false;
    //このスクリプトが貼られたオブジェクトクリックすると呼ばれる関数
    public void OnPointerClick(PointerEventData eventData)
    {
    rotate = !rotate;
    }
    void Start(){ }
    void Update(){/*スペースの都合により省略*/}
    }
    回転⽤フラグのOn/Offを切り替え

    View Slide

  100. 現状を保存
    ソースコードを保存
    Ctrl/command + S

    View Slide

  101. 動作確認
    Play

    View Slide

  102. 動作確認
    Shift + ドラッグでポインタを
    移動してオブジェクトに合わせる

    View Slide

  103. 動作確認
    Shiftから⼀旦指を離す

    View Slide

  104. 動作確認
    コントローラ画⾯上でマウスクリック

    View Slide

  105. 動作確認
    いくらクリックしても回転しない︕

    View Slide

  106. 動作確認
    停⽌

    View Slide

  107. 原因
    ポインターとの接触判定を⾏う
    コライダーがCG側に設定されていない
    ※Cubeとかのサンプルでは初めからコライダーが設定されているので忘れがち

    View Slide

  108. コライダーの設定 (1/4)
    Breadをクリック

    View Slide

  109. コライダーの設定 (2/4)
    Add Component

    View Slide

  110. コライダーの設定 (3/4)
    Boxで検索
    Box Collider

    View Slide

  111. コライダーの設定 (4/4)
    Center: 0 0.05 0
    Size: 0.2 0.1 0.2

    View Slide

  112. 現状を保存
    Ctrl/command + S

    View Slide

  113. 動作確認
    Play

    View Slide

  114. 動作確認
    ポインターを合わせる
    コントローラ画⾯をクリック

    View Slide

  115. 動作確認
    今度は回転する
    ※再クリックで停⽌

    View Slide

  116. 動作確認(動画)

    View Slide

  117. 動作確認(動画)

    View Slide

  118. 動作確認
    停⽌

    View Slide

  119. ハンズオン⼿順
    p Unityプロジェクトの作成
    p NRSDKの基礎
    p オブジェクトのクリック検知
    p オブジェクトのマニピュレーション
    p 何もないところでのクリック検知
    p uGUI操作

    View Slide

  120. 現状を保存
    Unityのシーンの現状を保存
    Ctrl/command + S

    View Slide

  121. プロジェクトの複製 (1/3)
    Sample 1を選択して
    Ctrl/command + D

    View Slide

  122. プロジェクトの複製 (2/3)
    Sample 2をダブルクリック

    View Slide

  123. プロジェクトの複製 (3/3)
    Sample 2になっていればOK

    View Slide

  124. 不要なスクリプトの削除 (1/2)
    Bread
    TapAndRotate横の

    View Slide

  125. 不要なスクリプトの削除 (2/2)
    Remove Component

    View Slide

  126. 新規スクリプトの追加 (1/4)
    Add Component

    View Slide

  127. 新規スクリプトの追加 (2/4)
    検索エリアを空に
    New script

    View Slide

  128. 新規スクリプトの追加 (3/4)
    Script名: Manipulation
    Create and Add

    View Slide

  129. 新規スクリプトの追加 (4/4)
    Manipulationが追加される
    Manipulationをダブルクリック

    View Slide

  130. コントローラ押下と解放の検知 (1/5)
    using UnityEngine;
    using NRKernal;
    using UnityEngine.EventSystems;
    public class Manipulation : MonoBehaviour
    ,IPointerDownHandler, IPointerUpHandler
    {
    void Start()
    {
    }
    void Update()
    {
    }
    }
    コントローラ押下開始 コントローラ押下終了

    View Slide

  131. コントローラ押下と解放の検知 (2/5)
    IpointerDownHandlerにカーソルを合わせる
    ヒントの中からインターフェイスを実装を選択

    View Slide

  132. コントローラ押下と解放の検知 (3/5)
    IpointerUpHandlerにカーソルを合わせる
    ヒントの中からインターフェイスを実装を選択

    View Slide

  133. コントローラ押下と解放の検知 (4/5)
    public class Manipulation : MonoBehaviour
    , IPointerDownHandler, IPointerUpHandler
    {
    public void OnPointerDown(PointerEventData eventData)
    {
    throw new System.NotImplementedException();
    }
    public void OnPointerUp(PointerEventData eventData)
    {
    throw new System.NotImplementedException();
    }
    void Start()
    {
    }
    void Update()
    {
    }
    }

    View Slide

  134. コントローラ押下と解放の検知 (5/5)
    public class Manipulation : MonoBehaviour
    , IPointerDownHandler, IPointerUpHandler
    {
    public void OnPointerDown(PointerEventData eventData)
    {
    Debug.Log("Down");
    }
    public void OnPointerUp(PointerEventData eventData)
    {
    Debug.Log("Up");
    }
    void Start()
    {
    }
    void Update()
    {
    }
    }

    View Slide

  135. 現状を保存
    ソースコードを保存
    Ctrl/command + S

    View Slide

  136. 動作確認
    Console

    View Slide

  137. 動作確認
    Play
    ポインタをオブジェクトに合わせる

    View Slide

  138. 動作確認
    Shiftから⼿を離す
    コントローラをゆっくりクリック

    View Slide

  139. 動作確認
    ボタンを押下したタイミングと離したタイミングでそれぞれ⽂字が表⽰

    View Slide

  140. 動作確認
    停⽌

    View Slide

  141. 不要なコードを削除
    public class Manipulation : MonoBehaviour
    , IPointerDownHandler, IPointerUpHandler
    {
    public void OnPointerDown(PointerEventData eventData)
    {
    Debug.Log("Down");
    }
    public void OnPointerUp(PointerEventData eventData)
    {
    Debug.Log("Up");
    }
    void Start()
    {
    }
    void Update()
    {
    }
    }

    View Slide

  142. コントローラ押下でオブジェクト移動
    Breadの親要素なし(=3D空間)
    親要素を切り替えることでコントローラへの追従のOn/Offを切り替える
    コントローラがBreadの親
    押下
    押下
    選択

    View Slide

  143. コントローラ押下でオブジェクト移動 (1/5)
    //コントローラの位置・姿勢 (あとでUnityEditorから指定)
    public Transform controller;
    //デフォルトの(マニピュレーションしていない時の)親オブジェクト
    public Transform base_parent;
    public void OnPointerDown(PointerEventData eventData)
    {
    //このオブジェクトの親をコントローラにする(コントローラに追従)
    transform.parent = controller;
    }
    public void OnPointerUp(PointerEventData eventData)
    {
    //このオブジェクトをコントローラから解放する
    transform.parent = base_parent;
    }
    void Start()
    {
    //最初にこのオブジェクトの親Transformを覚えさせておく
    base_parent = transform.parent;
    }

    View Slide

  144. 現状を保存
    Ctrl/command + S

    View Slide

  145. コントローラ押下でオブジェクト移動 (2/5)
    スクリプトとUnityEditor上の
    コントローラを関連づけよう

    View Slide

  146. コントローラ押下でオブジェクト移動 (3/5)
    NRInput
    → Right
    → ControllerTrack
    → ModelAnchorを⾒つける

    View Slide

  147. コントローラ押下でオブジェクト移動 (4/5)
    Breadをクリック
    Manipulationに注⽬

    View Slide

  148. コントローラ押下でオブジェクト移動 (5/5)
    ModelAncor
    Controllerに
    ドラッグ&ドロップ

    View Slide

  149. 動作確認
    Play

    View Slide

  150. 動作確認
    オブジェクトにポインタを合わせる

    View Slide

  151. 動作確認
    ①Shiftから指を離す
    ②Shiftを押してコントローラ画⾯上をドラッグ

    View Slide

  152. 動作確認

    View Slide

  153. 動作確認
    停⽌

    View Slide

  154. 実機での動作の様⼦

    View Slide

  155. オブジェクトの前後移動 (1/3)
    public Transform base_parent;
    //コントローラで選択されているかどうか
    bool selected = false;
    public void OnPointerDown(PointerEventData eventData)
    {
    //ポインターを合わせてボタンを押したら選択
    selected = true;
    //このオブジェクトの親をコントローラにする(コントローラに追従)
    transform.parent = controller;
    }
    public void OnPointerUp(PointerEventData eventData)
    {
    //指を離したら選択解除
    selected = false;
    //このオブジェクトをコントローラから解放する
    transform.parent = base_parent;
    }

    View Slide

  156. オブジェクトの前後移動 (2/3)
    //コントローラで選択されているかどうか
    bool selected = false;
    //移動速度
    public float moveSpeed = 0.08f;
    public void OnPointerDown(PointerEventData eventData){ 略 }
    public void OnPointerUp(PointerEventData eventData){ 略 }
    void Start(){ 略 }
    void Update()
    {
    if (!selected) return;
    //タッチ位置を取得し、yの絶対値>0.6なら前後移動
    Vector2 p = NRInput.GetTouch();
    if (Mathf.Abs(p.y) > 0.6f)
    {
    transform.Translate(Mathf.Sign(p.y) * controller.forward
    * moveSpeed * Time.deltaTime);
    }
    }
    -1
    1

    View Slide

  157. オブジェクトの前後移動 (3/3)
    //コントローラで選択されているかどうか
    bool selected = false;
    //移動速度
    public float moveSpeed = 0.08f;
    public void OnPointerDown(PointerEventData eventData){ 略 }
    public void OnPointerUp(PointerEventData eventData){ 略 }
    void Start(){ 略 }
    void Update()
    {
    if (!selected) return;
    //タッチ位置(-1~1)を取得し、yの絶対値>0.6なら前後移動
    Vector2 p = NRInput.GetTouch();
    if (Mathf.Abs(p.y) > 0.6f)
    {
    transform.Translate(Mathf.Sign(p.y) * controller.forward
    * moveSpeed * Time.deltaTime);
    }
    }

    View Slide

  158. 動作確認
    Play

    View Slide

  159. 動作確認
    ポインターをオブジェクトに合わせる
    コントローラ画⾯の上か下周辺でクリック

    View Slide

  160. 動作確認
    ポインターの前後⽅向に移動

    View Slide

  161. 動作確認

    View Slide

  162. 動作確認
    停⽌

    View Slide

  163. オブジェクトの左右回転
    //移動速度
    public float moveSpeed = 0.08f;
    //回転速度
    public float rotSpeed = -20.0f;
    /*中略*/
    void Update()
    {
    if (!selected) return;
    //タッチ位置(-1~1)を取得し、xyの絶対値が0.6以上なら移動/回転
    Vector2 p = NRInput.GetTouch();
    if (Mathf.Abs(p.y) > 0.6f){ /* 略(前後移動) */ }
    else if (Mathf.Abs(p.x) > 0.6f)
    {
    transform.Rotate(0, Mathf.Sign(p.x) * rotSpeed *
    Time.deltaTime, 0, Space.Self );
    }
    }

    View Slide

  164. 動作確認
    Play

    View Slide

  165. 動作確認
    ポインターをオブジェクトに合わせる
    コントローラ画⾯の右か左周辺をクリック

    View Slide

  166. 動作確認
    回転もできるようになる

    View Slide

  167. 動作確認
    停⽌

    View Slide

  168. ここまでの成果(エミュレーター)

    View Slide

  169. ここまでの成果(実機)

    View Slide

  170. ハンズオン⼿順
    p Unityプロジェクトの作成
    p NRSDKの基礎
    p オブジェクトのクリック検知
    p オブジェクトのマニピュレーション
    p 何もないところでのクリック検知
    p uGUI操作

    View Slide

  171. 現状を保存
    Ctrl/command + S

    View Slide

  172. プロジェクトの複製 (1/4)
    Sample 2をCtrl/command + D

    View Slide

  173. プロジェクトの複製 (2/4)
    Sample 3が⽣成される

    View Slide

  174. プロジェクトの複製 (3/4)
    Sample 3をダブルクリック

    View Slide

  175. プロジェクトの複製 (4/4)
    Sample 3に切り替わればOK

    View Slide

  176. 不要なオブジェクトを削除
    Breadを削除

    View Slide

  177. サンプルのインポート (1/4)
    Assets
    → Import Package
    → Custom Package

    View Slide

  178. サンプルのインポート (2/4)
    ARShooter.unitypackage

    View Slide

  179. サンプルのインポート (3/4)
    Import

    View Slide

  180. サンプルのインポート (4/4)
    Shooterが追加されていればOK

    View Slide

  181. 壁を表⽰ (1/8)
    Hierarchyの何もないところを右クリック

    View Slide

  182. 壁を表⽰ (2/8)
    Crate Empty

    View Slide

  183. 壁を表⽰ (3/8)
    ①GameObject
    ②名前をWallに変更

    View Slide

  184. 壁を表⽰ (4/8)
    Positionを 0 -0.2 2
    ※壁が表⽰される位置

    View Slide

  185. 壁を表⽰ (5/8)
    Shooter

    View Slide

  186. 壁を表⽰ (6/8)
    WallScriptに注⽬
    ※クリックしない
    WallのInspectorに
    ドラッグ&ドロップ

    View Slide

  187. 壁を表⽰ (7/8)
    WallScriptが追加される

    View Slide

  188. 壁を表⽰ (8/8)
    Cubeに注⽬
    (クリックしない)
    CubePrefabに
    ドラッグ&ドロップ

    View Slide

  189. 動作確認
    Play

    View Slide

  190. 動作確認
    壁が表⽰される

    View Slide

  191. 動作確認
    停⽌

    View Slide

  192. 弾を発射するスクリプトを作成 (1/5)
    NRInput
    → Right
    → ControllerTrack
    → ModelAnchorを⾒つける
    [補⾜]
    弾を発射したいオブジェクトに次⾴で作るスクリプトを貼り付ける。
    例としてコントローラを指定しているが、NRCameraRig内の
    CenterAnhorに貼れば頭から発射も可能

    View Slide

  193. 弾を発射するスクリプトを作成 (2/5)
    Add Component

    View Slide

  194. 弾を発射するスクリプトを作成 (3/5)
    検索エリアを空に
    New script

    View Slide

  195. 弾を発射するスクリプトを作成 (4/5)
    Script名: ShootBullet
    Create and Add

    View Slide

  196. 弾を発射するスクリプトを作成 (5/5)
    ShootBulletが追加される

    View Slide

  197. 発射スクリプトの記述 (1/6)
    ①Assets
    ②ShootBulletをダブルクリック

    View Slide

  198. 発射スクリプトの記述 (2/6)
    using UnityEngine;
    using NRKernal;
    public class ShootBullet : MonoBehaviour
    {
    //発射する弾の元データ
    public GameObject bulletPrefab;
    //実際に空間に放たれる弾
    GameObject bullet;
    void Start()
    {
    }
    void Update()
    {
    }
    }

    View Slide

  199. 発射スクリプトの記述 (3/6)
    void Start()
    {
    NRInput.AddClickListener(
    //右⼿or左⼿の指定
    ControllerHandEnum.Right,
    //コントローラの押した箇所に対応するアクションを記述
    ControllerButton.TRIGGER, () => {
    //既に弾を発射している場合は⼀旦削除
    if (bullet != null) DestroyImmediate(bullet);
    //弾を作って発射位置にセット
    bullet = GameObject.Instantiate(bulletPrefab);
    bullet.transform.position = transform.position;
    //下記設定で⼒を加える
    bullet.GetComponent().AddForce(
    transform.forward * 8, ForceMode.Impulse);
    }
    );
    }

    View Slide

  200. 現状を保存
    ソースコードを保存
    Ctrl/command + S

    View Slide

  201. 発射スクリプトの記述 (4/6)
    NRInput
    → Right
    → ControllerTrack
    → ModelAnchor

    View Slide

  202. 発射スクリプトの記述 (5/6)
    Shooter

    View Slide

  203. 発射スクリプトの記述 (6/6)
    Bulletに注⽬
    (クリックしない)
    BulletPrefabに
    ドラッグ&ドロップ

    View Slide

  204. 動作確認
    Play

    View Slide

  205. 動作確認
    弾が発射される

    View Slide

  206. 動作確認

    View Slide

  207. 動作確認
    停⽌

    View Slide

  208. ハンズオン⼿順
    p Unityプロジェクトの作成
    p NRSDKの基礎
    p オブジェクトのクリック検知
    p オブジェクトのマニピュレーション
    p 何もないところでのクリック検知
    p uGUI操作
    リセットボタン

    View Slide

  209. リセットボタンを追加 (1/5)
    Shooter

    View Slide

  210. リセットボタンを追加 (2/5)
    Canvas
    Hierarchyに
    ドラッグ&ドロップ

    View Slide

  211. リセットボタンを追加 (3/5)
    Canvas
    CanvasのRenderModeが
    WorldSpaceとなっていることを確認

    View Slide

  212. リセットボタンを追加 (4/5)
    Add Component

    View Slide

  213. リセットボタンを追加 (5/5)
    Canvas Raycast
    Canvas Raycast Target

    View Slide

  214. リセット機能を呼び出す (1/9)
    Canvasを開く

    View Slide

  215. リセット機能を呼び出す (2/9)
    Buttonをクリック

    View Slide

  216. リセット機能を呼び出す (3/9)
    Buttonを⾒つける
    On Clickを⾒つける

    View Slide

  217. リセット機能を呼び出す (4/9)
    Wallを⾒つける
    (クリックしない)

    View Slide

  218. リセット機能を呼び出す (5/9)
    OnClickにドラッグ&ドロップ

    View Slide

  219. リセット機能を呼び出す (6/9)
    ドロップダウンメニューを開く

    View Slide

  220. リセット機能を呼び出す (7/9)
    ①WallScript
    ②ResetWall

    View Slide

  221. リセット機能を呼び出す (8/9)
    NRInput
    → Right
    → ControllerTracker
    → LaserRaycaster

    View Slide

  222. リセット機能を呼び出す (9/9)
    Mask Type: Inclusive
    Mask: UI

    View Slide

  223. 動作確認

    View Slide

  224. 参考
    • クイックスタート
    https://nreal.gitbook.io/nrsdk/discove
    r/quickstart-for-android
    • コントローラ詳細
    https://nreal.gitbook.io/nrsdk/nrsdk-
    fundamentals/controller
    • 前回のNreal Lightハンズオン
    https://www.slideshare.net/ssuserc0d
    7fb/nreal-light

    View Slide