Upgrade to Pro — share decks privately, control downloads, hide ads and more …

ARDKハンズオン1のメインスライド

 ARDKハンズオン1のメインスライド

ppengotsu

June 17, 2022
Tweet

More Decks by ppengotsu

Other Decks in Technology

Transcript

  1. #ARDKUG Zoomで質問受付中
    Niantic Lightship ARDK online
    Hands-on workshop #1
    佐久間捷矢 / デザイニウム
    1

    View Slide

  2. #ARDKUG Zoomで質問受付中
    登壇者
    2
    Designium
    @ppengotsu
    佐久間
    Niantic
    白石
    Designium
    @marikocco
    マリコ
    Niantic
    Joe

    View Slide

  3. #ARDKUG Zoomで質問受付中
    ハンズオンの質疑など
    3
    エラーで詰まった場合などは、Discordの”〇〇” Zoomのチャットで質問くださ
    い。
    zoomは、いいね!👍などリアクションもお願いします
    人数が人数ですので、もし自分のところでは、そのエラーなおったよー!みたい
    な方いたら、返信お願いします。
    Twitterで制作物などをつぶやくときは、#ARDK #ARDKUG をつけてツイートし
    てもらえるとたすかります。

    View Slide

  4. #ARDKUG Zoomで質問受付中
    本日の流れ
    4

    View Slide

  5. #ARDKUG Zoomで質問受付中
    ARDKの説明の前に、、
    5

    View Slide

  6. #ARDKUG Zoomで質問受付中
    Unityで新規プロジェクトを作成
    6
    Unity2021.3.3f1で、新規3D(URP)プロジェクトを作成してください。
    作成後、プラットフォームをiOSに変更してください。

    View Slide

  7. #ARDKUG Zoomで質問受付中
    ARDKの簡単な説明
    7

    View Slide

  8. #ARDKUG Zoomで質問受付中
    ARDKとは?
    8
    NianticのLightshipに属するAR SDKとなります
    Niantic
    Lightship
    ARDK VPS

    View Slide

  9. #ARDKUG Zoomで質問受付中
    ARDKを使った例
    9
    https://youtu.be/bQ8lUzU52Pc

    View Slide

  10. #ARDKUG Zoomで質問受付中
    ARDKの特徴
    10
    特徴は、4つあります。
    ● メッシュ
    ● セマンティックセグメンテーション
    ● マルチプレイヤー
    ● VPS ←New!!

    View Slide

  11. #ARDKUG Zoomで質問受付中
    ARDKの特徴 - メッシュ機能
    11
    ● iPhone8以上
    ● 2018年以降発売のハイエンド
    Android
    であれば、周りの環境に合わせて、
    メッシュを生成できます。
    https://youtu.be/4m_rdpFxJao
    この後、一緒に作ります。

    View Slide

  12. #ARDKUG Zoomで質問受付中
    ARDKの特徴 - セマンティックセグメンテーション機能
    12
    後半、この機能のサンプル
    で遊びます。
    https://www.youtube.com/watch?v=fpKNd2LKAuk
    &t=3s

    View Slide

  13. #ARDKUG Zoomで質問受付中
    ARDKの特徴 - マルチプレイヤー機能
    13
    iOS、Androidを相互に繋ぎ、
    複数端末を同期したARを作成できます。
    サーバは、Nianticが稼働させている
    ものを使います
    後半、この機能のサンプル
    で遊びます。
    https://youtu.be/bQ8lUzU52Pc

    View Slide

  14. #ARDKUG Zoomで質問受付中
    ARDKの特徴 - VPS機能
    14
    現実の位置に合わせて、3Dモデルを
    設置できるようになる機能です。
    詳細
    https://lightship.dev/docs/ardk/vp
    s/concepts_and_terminology.html
    https://www.youtube.com/watch?v=wwFiZ7CU9LE
    &t=24s

    View Slide

  15. #ARDKUG Zoomで質問受付中
    ARDKの特徴
    15
    特徴は、4つあります。
    ● メッシュ
    ● セマンティックセグメンテーション
    ● マルチプレイヤー
    ● VPS ←New!!

    View Slide

  16. #ARDKUG Zoomで質問受付中
    ARDKの簡単な説明は終わり
    16

    View Slide

  17. #ARDKUG Zoomで質問受付中
    初級編2の実践
    17

    View Slide

  18. #ARDKUG Zoomで質問受付中
    目標
    18

    View Slide

  19. #ARDKUG Zoomで質問受付中
    情報
    19
    参考元ブログ
    https://note.com/thedesignium/n/nbfba2a831469
    ブログは、少し古いARDKかつ、旧式レンダーラインで環境構築したものです。

    View Slide

  20. #ARDKUG Zoomで質問受付中
    ステップ一覧
    20
    1. PlayerSettingsの変更
    2. ARDK本体のインポート
    3. ARDKライセンスキー発行
    4. ARDKライセンスキーの設定
    5. URP特有の設定
    6. シーン作成
    7. メッシュ生成機能の設定
    8. ボールを飛ばす設定
    9. ビルド

    View Slide

  21. #ARDKUG Zoomで質問受付中
    PlayerSettingsの変更
    21
     
    Bundle Identifier 各自(xcodeで設定し
    てもよい)
    Camera Usage
    Desciption
    “ForAR”などいれてく
    ださい
    Location Usage
    Desciption
    “ForAR”などいれてく
    ださい

    View Slide

  22. #ARDKUG Zoomで質問受付中
    ARDK本体のインポート
    22
    事前準備でダウンロード済みのARDK本体を
    Unityにインポートしてください
    ARDK本体のダウンロード先
    https://lightship.dev/account/downloads
    途中表示される アラートはYESでよいです。

    View Slide

  23. #ARDKUG Zoomで質問受付中
    ARDKライセンスキー発行 -1
    23
    https://lightship.dev/account/projects

    View Slide

  24. #ARDKUG Zoomで質問受付中
    ARDKライセンスキー発行 -2
    24
    https://lightship.dev/account/projects
    わかりやすいものにしておくとよい
    わかりやすいものにしておくとよい
    ライセンス発行するボタン

    View Slide

  25. #ARDKUG Zoomで質問受付中
    ARDKライセンスキー発行 -3
    25
    https://lightship.dev/account/projects
    ここのボタンで、ライセンスキーをコピーします

    View Slide

  26. #ARDKUG Zoomで質問受付中
    ARDKライセンスキーの設定
    26
    Unityプロジェクトへ戻ります。
    1. /Assets/Resources/ARDK フォルダを作成
    2. 作成したフォルダで右クリックして
    ArdkAuthConfigを作成
    3. Api keyに、さきほどコピーしたキーを設定

    View Slide

  27. #ARDKUG Zoomで質問受付中
    URP特有の設定
    27
    /Assets/Settings/URP-Balanc
    ed-Rendererの設定を変更しま
    す。
    ・ARSessionFeature
    ・DepthMeshRenderFeature
    の2つを追加してください。
    詳細:
    https://lightship.dev/docs/ardk/rendering/urp.html#doxid-urp

    View Slide

  28. #ARDKUG Zoomで質問受付中
    シーン作成
    28
    1. シーンを新規作成し、シーン名を”Main”にしてください
    2. MainCameraを削除
    3. /Assets/ARDK/Extensions/Prefabs/ARSceneManagerをシーンに追加

    View Slide

  29. #ARDKUG Zoomで質問受付中
    メッシュ生成機能の設定 - 1
    29
    /Assets/ARDK/Extensions/Meshing/ARMesh
    をシーンに追加してください

    View Slide

  30. #ARDKUG Zoomで質問受付中
    メッシュ生成機能の設定 - 2
    30
    新しいマテリアルを作ってください
    透過設定にし、
    透過率を90前後に調整してみてください。

    View Slide

  31. #ARDKUG Zoomで質問受付中
    メッシュ生成機能の設定 - 3
    31
    シーン上のARMeshの設定を変更します。
    ・MeshPrefabを
    /Assets/ARDK/Extensions/Meshing/ARMesh
    ColliderChunkに変更
    ・UseInvisibleMaterialをオンに変更
    ・InvisibleManterialに新規作成したMaterialに
    変更

    View Slide

  32. #ARDKUG Zoomで質問受付中
    ボールを飛ばす設定 - 1
    32
    https://github.com/TheDesignium/public_ardkhandson1/blob/main/ActionM
    anager.cs
    上記、スクリプトをダウンロードして、Unityへインポートしてください

    View Slide

  33. #ARDKUG Zoomで質問受付中
    ボールを飛ばす設定 - 2
    33
    シーンで、球体(Sphere)を作成し、”Ball”と名前を変
    えてください。
    作成後、
    ・Scaleを0.1に変更
    ・Rigidbody追加
    ・RigidbodyのMassを0.01に変更
    上記3つの変更をしてください。

    View Slide

  34. #ARDKUG Zoomで質問受付中
    ボールを飛ばす設定 - 3
    34
    シーンで、空のオブジェクトを作成し、”Manager”に名前を変更し
    てください。
    ”Manager”オブジェクトに、ActionManager.csを追加してくださ
    い。
    次、ActionManager.csの紐づけ作業をします
    ・”BallPrefab”には、さきほど作成したBallおぶえジェクト
    ・”Main Camera”には、シーン上のARSceneManagerの小オブジェク
    トであるARSceneCameraオブジェクト
    のそれぞれを紐づけるようにしてください。

    View Slide

  35. #ARDKUG Zoomで質問受付中
    ビルド
    35
    作成した”Main”シーンをビルド対象に追加し、
    いつもどおりBuild&Runして、実機で動作させてみてください。
    何か詰まった!や質問などがあったら教えてください。

    View Slide

  36. #ARDKUG Zoomで質問受付中
    おまけ
    36
    時間が余った方向け
    ● VPSの解説
    ○ https://note.com/thedesignium/n/n10cbe153a7c7
    ● Mesh1のシェーダをいろいろ変えてみると
    おもしろいかとおもいます。

    View Slide

  37. #ARDKUG Zoomで質問受付中
    休憩 〜??:??
    37

    View Slide

  38. #ARDKUG Zoomで質問受付中
    後半
    38

    View Slide

  39. #ARDKUG Zoomで質問受付中
    ARDK公式サンプルを試す
    39

    View Slide

  40. #ARDKUG Zoomで質問受付中
    流れ
    40
    ● ARDK公式サンプルインポートと設定
    ● ビルド
    ● セマンティックセグメンテーション
    ● マルチプレイヤー

    View Slide

  41. #ARDKUG Zoomで質問受付中
    ARDK公式サンプルインポート-1
    41
    さきほどボールを出せるようになったUnityプロジェクトに、
    事前にダウンロードしていた”ardk-examples-2.0.0.unitypackage”をインポート
    してください。
    https://lightship.dev/account/downloads

    View Slide

  42. #ARDKUG Zoomで質問受付中
    ARDK公式サンプルインポート-2
    42
    URPマテリアルに変更が必要です。
    まず、ARDKExamplesフォルダに含
    まれるマテリアルをURPに対応させ
    ます。
    5番目で表示されたマテリアルを
    すべて選択してください





    View Slide

  43. #ARDKUG Zoomで質問受付中
    ARDK公式サンプルインポート-3
    43
    マテリアルを選んだ状態で、
    Editメニューの
    Rendering>Maerials>Convert
    Selected Build~~~URPを選んで
    ください。
    表示された警告はYesを選んでく
    ださい

    View Slide

  44. #ARDKUG Zoomで質問受付中
    ARDK公式サンプルインポート-4
    44
    ダブったARDKライセンスキーファイルを削除
    します
    ARDKExamples>Resources>ARDK>ArdkAuthC
    onfig
    を削除します

    View Slide

  45. #ARDKUG Zoomで質問受付中
    ARDK公式サンプルインポート-5
    45
    ビルド対象シーンにサンプルシーン全て追加し
    ます。
    Materialと同様に、ARDKExsampleフォルダの
    Sceneを全て選びます

    3 2
    4

    View Slide

  46. #ARDKUG Zoomで質問受付中
    ARDK公式サンプルインポート-6
    46
    さきほど選んだシーンを、ビルド対象に追加し
    てください。
    そして、SceneSelectorシーンを一番上にして
    ください。

    View Slide

  47. #ARDKUG Zoomで質問受付中
    ビルド
    47
    ビルドしてください。たぶん時間かかるかと思います。。。

    View Slide

  48. #ARDKUG Zoomで質問受付中
    セマンティックセグメンテーション - 1
    48
    SemanticSegmentationシーンを開いてみてください
    右上の”Change Feature Channel”で対象物を変えてみてください

    View Slide

  49. #ARDKUG Zoomで質問受付中
    セマンティックセグメンテーション - 2
    49
    SemanticSegmentationExampleManagerでは、
    Update文で、セグメンテーションのテクスチャを使って
    マスクの設定をしています。

    View Slide

  50. #ARDKUG Zoomで質問受付中
    マルチプレイヤー
    50
    ARNetworkingExampleManagerシーンを
    みてみましょう。

    View Slide

  51. #ARDKUG Zoomで質問受付中
    マルチプレイヤー
    51
    1. 端末Aで矢印1のボタンを押し、ルームIDを作ります
    2. 端末1の矢印2に表示されたルームIDを、端末Bの矢
    印2に入力してください
    3. 端末Aで矢印3のボタンをおす
    4. 端末Bで矢印3のボタンをおす
    5. まわりをしばらく見渡すとローカライズできて、
    お互いの端末位置に立方体が表示されます
    1
    2
    3

    View Slide

  52. #ARDKUG Zoomで質問受付中
    マルチプレイヤー
    52
    ARNetworkingExampleManagerには、バイト形式でデータ送受信している例があ
    ります
    送信
    受信

    View Slide

  53. #ARDKUG Zoomで質問受付中
    マルチプレイヤー
    53
    エラーコード
    https://lightship.dev/docs/ardk/multiplayer/low_level_networking_errors.h
    tml

    View Slide

  54. #ARDKUG Zoomで質問受付中
    残り時間、各シーン試してみてください
    54

    View Slide

  55. #ARDKUG Zoomで質問受付中
    ボール発射するサンプルのネットワーク版
    55
    ボールを飛ばすトリガーを送受信するようにしてみます
    時間がある場合

    View Slide

  56. #ARDKUG Zoomで質問受付中
    ボール発射するサンプルのネットワーク版
    56
    Assets/ARDKExamples/ARNetworking/ARNetworkingシーンを複製し、
    ”ARNetworkingWithBall”という名前にしてください
    その後、作成したシーンを開いてください

    View Slide

  57. #ARDKUG Zoomで質問受付中
    ボール発射するサンプルのネットワーク版
    57
    /Assets/ARDK/Extensions/Meshing/ARMesh
    をシーンに追加してください

    View Slide

  58. #ARDKUG Zoomで質問受付中
    ボール発射するサンプルのネットワーク版
    58
    シーン上のARMeshの設定を変更します。
    ・MeshPrefabを
    /Assets/ARDK/Extensions/Meshing/ARMesh
    ColliderChunkに変更
    に変更

    View Slide

  59. #ARDKUG Zoomで質問受付中
    ボール発射するサンプルのネットワーク版
    59
    シーンで、球体(Sphere)を作成し、”Ball”と名前を変
    えてください。
    作成後、
    ・Scaleを0.1に変更
    ・Rigidbody追加
    ・RigidbodyのMassを0.01に変更
    上記3つの変更をしてください。

    View Slide

  60. #ARDKUG Zoomで質問受付中
    ボール発射するサンプルのネットワーク版
    60
    https://github.com/TheDesignium/public_ardkhandson1/blob/main/ActionNe
    tworkManager.cs
    をダウンロードし、Unityプロジェクトへ追加してください。

    View Slide

  61. #ARDKUG Zoomで質問受付中
    ボール発射するサンプルのネットワーク版
    61
    シーンで、空のオブジェクトを作成し、”Manager”に名前を変更し
    てください。
    ”Manager”オブジェクトに、ActionNetworkManager.csを追加して
    ください。
    次、ActionNetworkManager.csの紐づけ作業をします
    ・”BallPrefab”には、さきほど作成したBallおぶえジェクト
    ・”Main Camera”には、シーン上のARSceneManagerの小オブジェク
    トであるARSceneCameraオブジェクト
    のそれぞれを紐づけるようにしてください。

    View Slide

  62. #ARDKUG Zoomで質問受付中
    ボール発射するサンプルのネットワーク版
    62
    ビルドします
    ビルド対象に、”ARNetworkingWithBall”シーンを追加し、
    シーンリストの先頭にし、ビルドしてください

    View Slide

  63. #ARDKUG Zoomで質問受付中
    ボール発射するサンプルのネットワーク版
    63
    送信部分
    ボールを発生させたい位置と飛ばしたい方向を送信してます。

    View Slide

  64. #ARDKUG Zoomで質問受付中
    ボール発射するサンプルのネットワーク版
    64
    受信部分
    受信した位置、方向に向かって
    ボールを発射する処理をしている

    View Slide

  65. #ARDKUG Zoomで質問受付中
    ボール発射するサンプルのネットワーク版
    65
    今回のサンプルは、発射トリガーだけを送受信してます。
    そのため、飛ばした後のボールの位置は同期されません。
    今回のような低レイヤーの実装なら、常に位置情報を送受信する修正を行う必要があります。
    高レイヤーの場合は、位置同期便利クラスを使うとよいかもれしれないです
    https://lightship.dev/docs/ardk/multiplayer/HLAPI/network_spawning.html#doxid-hlapi-network-
    spawning

    View Slide

  66. #ARDKUG Zoomで質問受付中
    サンプル補足
    66
    ● 深度取得しているサンプルやVPSのサンプルもあります
    ● 公式のテンプレートもあります
    ○ 公式テンプレートは、新しいシーン
    を作ってから、各テンプレを選ぶと
    よさそうです。

    View Slide

  67. #ARDKUG Zoomで質問受付中
    Q&A
    67

    View Slide

  68. #ARDKUG Zoomで質問受付中
    Nianticからの話
    68

    View Slide

  69. #ARDKUG Zoomで質問受付中
    おわり
    69

    View Slide