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

by ppengotsu

Slide 1

Slide 1 text

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

Slide 2

Slide 2 text

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

Slide 3

Slide 3 text

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

Slide 4

Slide 4 text

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

Slide 5

Slide 5 text

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

Slide 6

Slide 6 text

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

Slide 7

Slide 7 text

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

Slide 8

Slide 8 text

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

Slide 9

Slide 9 text

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

Slide 10

Slide 10 text

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

Slide 11

Slide 11 text

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

Slide 12

Slide 12 text

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

Slide 13

Slide 13 text

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

Slide 14

Slide 14 text

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

Slide 15

Slide 15 text

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

Slide 16

Slide 16 text

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

Slide 17

Slide 17 text

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

Slide 18

Slide 18 text

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

Slide 19

Slide 19 text

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

Slide 20

Slide 20 text

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

Slide 21

Slide 21 text

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

Slide 22

Slide 22 text

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

Slide 23

Slide 23 text

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

Slide 24

Slide 24 text

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

Slide 25

Slide 25 text

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

Slide 26

Slide 26 text

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

Slide 27

Slide 27 text

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

Slide 28

Slide 28 text

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

Slide 29

Slide 29 text

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

Slide 30

Slide 30 text

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

Slide 31

Slide 31 text

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

Slide 32

Slide 32 text

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

Slide 33

Slide 33 text

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

Slide 34

Slide 34 text

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

Slide 35

Slide 35 text

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

Slide 36

Slide 36 text

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

Slide 37

Slide 37 text

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

Slide 38

Slide 38 text

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

Slide 39

Slide 39 text

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

Slide 40

Slide 40 text

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

Slide 41

Slide 41 text

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

Slide 42

Slide 42 text

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

Slide 43

Slide 43 text

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

Slide 44

Slide 44 text

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

Slide 45

Slide 45 text

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

Slide 46

Slide 46 text

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

Slide 47

Slide 47 text

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

Slide 48

Slide 48 text

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

Slide 49

Slide 49 text

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

Slide 50

Slide 50 text

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

Slide 51

Slide 51 text

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

Slide 52

Slide 52 text

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

Slide 53

Slide 53 text

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

Slide 54

Slide 54 text

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

Slide 55

Slide 55 text

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

Slide 56

Slide 56 text

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

Slide 57

Slide 57 text

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

Slide 58

Slide 58 text

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

Slide 59

Slide 59 text

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

Slide 60

Slide 60 text

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

Slide 61

Slide 61 text

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

Slide 62

Slide 62 text

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

Slide 63

Slide 63 text

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

Slide 64

Slide 64 text

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

Slide 65

Slide 65 text

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

Slide 66

Slide 66 text

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