Empfohlen
Empfohlen
Weitere ähnliche Inhalte
Was ist angesagt?
Was ist angesagt? (20)
Ähnlich wie はじめようARCore: Motion Tracking & Image Tracking編
Ähnlich wie はじめようARCore: Motion Tracking & Image Tracking編 (9)
Mehr von Takashi Yoshinaga
Mehr von Takashi Yoshinaga (20)
Kürzlich hochgeladen
Kürzlich hochgeladen (9)
はじめようARCore: Motion Tracking & Image Tracking編
- 1. ARコンテンツ作成勉強会 はじめようARCore Motion Tracking & Augmented Images編
- 3. ARコンテンツ作成勉強会の紹介 2013年5月に勉強会をスタート ARコンテンツの作り方をハンズオン形式で学ぶ 人数は5~10名程度の少人数で実施 参加条件はAR/VRに興味がある人(知識不要) 各地で開催 (福岡、熊本、宮崎、長崎、大分、 鹿児島、山口、広島、関東)
- 5. ARCore Googleが提供する次世代ARプラットフォーム。普通のスマホでマーカーレスARを実現。 【主要機能】 (1) 自己位置推定 (Motion Tracking) (2) 明るさ推定 (Light Estimation) (3) 平面認識 (Environmental Understanding) (4) マーカー認識 (Augmented Image) (5) 空間共有 (Cloud Anchor)
- 6. ARCore Googleが提供する次世代ARプラットフォーム。普通のスマホでマーカーレスARを実現。 【主要機能】 (1) 自己位置推定 (Motion Tracking) (2) 明るさ推定 (Light Estimation) (3) 平面認識 (Environmental Understanding) (4) マーカー認識 (Augmented Image) (5) 空間共有 (Cloud Anchor)
- 9. Unityのプロジェクトを作成 (2/2) プロジェクト名・保存場所・3Dを指定してCreate project 3D 最後にCreate Project プロジェクト名 保存場所
- 10. まずはUnityの簡単な使い方
- 16. CGの詳細情報の編集：位置の指定 オブジェクトの詳細の表示・追加・変更 はInspectorで行う 例えば、TransformのPositionを 変更すると位置が変わる Positionを0 0 0に変更
- 18. CGの詳細情報の編集：色の設定 (2/4) 作成したマテリアルの色(Albedo)を設定 (2) Albedoの右側をクリックし、色を選択 (1)作成したマテリアルをクリック ④好きな色を選ぶ
- 20. CGの詳細情報の編集：色の設定 (4/4) オブジェクト(Cube)のマテリアルを開き、作成したマテリアルを割り当て (2) Materialsの横の▼ (1)Cube (3) Element0に ドラッグ&ドロップ
- 26. スクリプトを使って立方体を回転 public class NewBehaviourScript : MonoBehaviour { // 初期化のために初回に一回だけ実行される void Start () { } // 毎フレーム(数10ミリ秒おきに)実行される void Update () { } }
- 27. スクリプトを使って立方体を回転 public class NewBehaviourScript : MonoBehaviour { // 初期化のために初回に一回だけ実行される void Start () { } // 毎フレーム(数10ミリ秒おきに)実行される void Update () { //毎フレームY軸を中心に1度ずつ回転 transform.Rotate(0, 1, 0, Space.Self); } }
- 32. ARCoreを使おう Googleが提供する次世代ARプラットフォーム。普通のスマホでマーカーレスARを実現。 【主要機能】 (1) 自己位置推定 (Motion Tracking) (2) 明るさ推定 (Light Estimation) (3) 平面認識 (Environmental Understanding) (4) マーカー認識 (Augmented Image) (5) 空間共有 (Cloud Anchor)
- 33. ARCoreのインポート ①Assets ②Import Package → Custom Package ③arcore-unity-sdk-xxx ④開く
- 38. ARCore用のカメラの設定(2/2) ①GoogleARCore → Prefabs ② ARCore Device ③ドラッグ&ドロップ
- 39. 表示オブジェクトの追加(1/2) ①GoogleARCore → Examples → Common → Prefabs ② Andy Green Diffuse ③ドラッグ&ドロップ
- 42. ビルドの準備 ②Switch Platform ① Android ③Player Settings
- 43. ビルドの準備 ①Product Nameを入力 ② Other Settings ③ Multithreaded Renderingをオフ
- 44. ビルドの準備 ①Package Nameを設定 例) com.arfukuoka.test1 ② Minimum API Levelを Android 7.0に設定
- 45. ビルドの準備 ①XR Settings ② ARCore Supportedをオン
- 46. ビルドと実機インストール ①File ② Build & Run
- 48. 動作確認
- 53. Environmental Understandingを有効化(4/5) ①sample1.assetをクリック 【Plane Finding Mode】 (1)Disabled:平面認識なし (2)Horizontal And Vertical： 水平面と垂直面を認識 (3)Horizontal： 水平面のみ認識 (4)Vertical 垂直面のみ認識 今回は(2)～(4)から好きなのを選択
- 54. Environmental Understandingを有効化(5/5) ①ARCore Deviceをクリック ②Sample1フォルダ ③sample1.asset ④Session Configに ドラッグ&ドロップ
- 55. 平面可視化スクリプト (1/5) ①空白を右クリック ② Create Empty
- 58. 平面可視化スクリプト (4/5) ②GoogleARCore → Examples → Common → Prefabs ①Controller
- 60. 動作確認 水平面 垂直面
- 62. タップした平面にCGを置く ①New Script ③Create and Add ②PutScript
- 64. スクリプトの記述 using System.Collections; using System.Collections.Generic; using UnityEngine; using GoogleARCore; public class PutScript : MonoBehaviour { public GameObject andy; //CG(Andy)を扱う変数 void Start () { } void Update () { //タップの検出 //タップした画面の座標と3D空間座標の対応付け //Andyをその位置に置く } }
- 65. スクリプトの記述 void Update () { //タッチしていないなら if (Input.touchCount < 1 ){ return; } Touch touch = Input.GetTouch(0); //画面をなぞっていなければ if (touch.phase != TouchPhase.Moved ){ return;} //タップした座標にAndyを移動。 TrackableHit hit; TrackableHitFlags filter = TrackableHitFlags.PlaneWithinPolygon; Frame.Raycast(touch.position.x, touch.position.y, filter, out hit) } touch.position hit Moved→画面をなぞる 平面を構成するポリゴンの 内側をタップ判定の対象に
- 66. スクリプトの記述 void Update () { //タッチしていないなら if (Input.touchCount < 1 ){ return; } Touch touch = Input.GetTouch(0); //画面をなぞっていなければ if (touch.phase != TouchPhase.Moved ){ return;} //タップした座標にAndyを移動。 TrackableHit hit; TrackableHitFlags filter = TrackableHitFlags.PlaneWithinPolygon; if(Frame.Raycast(touch.position.x, touch.position.y, filter, out hit) ) { //Andyの3D座標を指定するコードを記述(次頁) } } touch.position hit Moved→画面をなぞる 平面を構成するポリゴンの 内側をタップ判定の対象に
- 67. スクリプトの記述 if (Frame.Raycast(touch.position.x, touch.position.y, filter, out hit)) { //平面にヒットしたならAndyを置く if (hit.Trackable is DetectedPlane) { //Andyの位置・姿勢を指定 andy.transform.position = hit.Pose.position; andy.transform.rotation = hit.Pose.rotation; andy.transform.Rotate(0, 180, 0, Space.Self); //Anchorを設定 var anchor = hit.Trackable.CreateAnchor(hit.Pose); andy.transform.parent = anchor.transform; } }
- 69. 動作確認
- 77. ARCore用カメラの設定 ①GoogleARCore → Prefabs ② ARCore Device ③ドラッグ&ドロップ
- 82. 補足 ①sample2.assetをクリック ②下記を適宜設定 ・Plane Fitting Mode ・Enable Light Estimation ※マーカー認識には影響なし
- 95. 今回は事前配布
- 101. マーカー認識用スクリプトの作成 ①New Script ③Create and Add ②MarkerScript
- 103. スクリプトの記述 using GoogleARCore; public class MarkerScript : MonoBehaviour { public GameObject andy;//Andyオブジェクト public GameObject astronaut;//宇宙飛行士オブジェクト //検出されたマーカー番号(int)とCG(GameObject)の対応を記録する辞書 Dictionary<int,GameObject> markerDic = new Dictionary<int,GameObject>(); //フレーム毎に認識されたマーカーを一時的に覚えておく List<AugmentedImage> markers = new List<AugmentedImage>(); void Start() { } void Update() { //マーカーとCGの対応付けを行う(次頁) } }
- 104. CGとスクリプトの対応付け(Andy) ② Controller ① GoogleARCore → Examples → Common → Prefabs
- 108. void Update() { //計測情報が更新されたマーカーを取得 Session.GetTrackables<AugmentedImage> (markers,TrackableQueryFilter.Updated); //マーカーに対してCGとの対応付けor解除を行う foreach (var image in markers) { int index = image.DatabaseIndex; //マーカーの番号 GameObject obj = null; //上記indexに対応するCGを格納(予定) markerDic.TryGetValue(index, out obj);//indexに対応するCGを取得 if (obj == null && image.TrackingState == TrackingState.Tracking) { //マーカーとCGの対応付けと辞書(markerDic)登録を行う } else if (obj != null && image.TrackingState == TrackingState.Stopped) { //計測をやめたマーカーに対して行う処理 } } }
- 109. void Update() { //計測情報が更新されたマーカーを取得 Session.GetTrackables<AugmentedImage> (markers,TrackableQueryFilter.Updated); //マーカーに対してCGとの対応付けor解除を行う foreach (var image in markers) { int index = image.DatabaseIndex; //マーカーの番号 GameObject obj = null; //上記indexに対応するCGを格納(予定) markerDic.TryGetValue(index, out obj);//indexに対応するCGを取得 if (obj == null && image.TrackingState == TrackingState.Tracking) { //マーカーとCGの対応付けと辞書(markerDic)登録を行う } else if (obj != null && image.TrackingState == TrackingState.Stopped) { //計測をやめたマーカーに対して行う処理 } } }
- 110. if (obj == null && image.TrackingState == TrackingState.Tracking) { Anchor anchor = image.CreateAnchor(image.CenterPose); switch (index) { case 0://AndyMarker obj = GameObject.Instantiate(andy, anchor.transform); obj.transform.localPosition = new Vector3(0, 0.02f, -0.04f); obj.transform.Rotate(-90, 0, 0, Space.Self); obj.transform.localScale =new Vector3(0.3f, 0.3f, 0.3f); markerDic.Add(index, obj); break; case 1://earth obj = GameObject.Instantiate(astronaut, anchor.transform); obj.transform.localPosition = new Vector3(0.02f, 0.04f, 0); obj.transform.Rotate(90, 0, 0, Space.Self); obj.transform.localScale = new Vector3(0.01f, 0.01f, 0.01f); markerDic.Add(index, obj); break; } }
- 111. void Update() { //計測情報が更新されたマーカーを取得 Session.GetTrackables<AugmentedImage> (markers,TrackableQueryFilter.Updated); //マーカーに対してCGとの対応付けor解除を行う foreach (var image in markers){ int index = image.DatabaseIndex; //マーカーの番号 GameObject obj = null; //上記indexに対応するCGを格納(予定) markerDic.TryGetValue(index, out obj);//indexに対応するCGを取得 if (obj == null && image.TrackingState == TrackingState.Tracking) { //マーカーとCGの対応付けと辞書(markerDic)登録を行う } else if (obj != null && image.TrackingState == TrackingState.Stopped) { markerDic.Remove(index); Destroy(obj); } } }
- 112. 完成！