![Scene(設計画面)の視点を変えよう
[←] [→]で左右移動
[↑][↓]でズームイン/アウト
[Alt]+ドラッグで回転
+ドラッグで上下左右](https://image.slidesharecdn.com/arcore3ss-190915164301/85/ARCore-in-22-320.jpg)
![不要なCGの削除
Cubeを選択して[Delete]](https://image.slidesharecdn.com/arcore3ss-190915164301/85/ARCore-in-45-320.jpg)
![表示オブジェクトの追加(2/2)
①AndyGreenDiffuse
② Positionの
yを-0.1[m]
zを0.5[m]
③ Scaleを1~3くらいに
(20~60cmくらい)
※ARCoreではアプリ立ち上げ時のスマホの位置が0 0 0となります](https://image.slidesharecdn.com/arcore3ss-190915164301/85/ARCore-in-53-320.jpg)
![線を消す
void Update () {
if (Input.touchCount == 1)
{
//線の描画をする/カメラ手前10cmの位置を取得
}
else if (Input.touchCount == 2)
{
if (Input.GetTouch(0).phase == TouchPhase.Ended)
{
for(int i = 0; i < lines.Count; i++)
{
Destroy(lines[i]);
lines[i] = null;
}
lines.Clear();
}
}
}](https://image.slidesharecdn.com/arcore3ss-190915164301/85/ARCore-in-115-320.jpg)
More Related Content
![[Netlify版] 0から始めようWebAR/VR入門ハンズオン with 織りなすラボ](https://cdn.slidesharecdn.com/ss_thumbnails/yoshinaganetlifyss-200719024058-thumbnail.jpg?width=640&height=640&fit=bounds)
![[Glitch版] 0から始めようWebAR/VR入門ハンズオン with 織りなすラボ](https://cdn.slidesharecdn.com/ss_thumbnails/yoshinagaglitchss2-200719023821-thumbnail.jpg?width=640&height=640&fit=bounds)
はじめようARCore in 札幌
- 1.
- 2.
- 3. ARコンテンツ作成勉強会の紹介 2013年5月に勉強会をスタートし ARコンテンツの作り方をハンズオン形式で学ぶ 人数は5~10名程度の少人数で実施 参加条件はAR/VRに興味がある人(知識不要) 各地で開催 (福岡、熊本、宮崎、長崎、大分、 鹿児島、山口、広島、関東)
- 4.
- 5.
- 6.
- 7.
- 8. ARCore Googleが提供する次世代ARプラットフォーム。普通のスマホでマーカーレスARを実現。 【主要機能】 (1) 自己位置推定 (MotionTracking) (2) 平面認識 (Environmental Understanding) (3) 明るさ推定 (Light Estimation) (4) マーカー認識 (Augmented Image) (5) 空間共有 (Cloud Anchor) (6) 顔認識 (Augmented Faces)
- 9. 今日の内容 Googleが提供する次世代ARプラットフォーム。普通のスマホでマーカーレスARを実現。 【主要機能】 (1) 自己位置推定 (MotionTracking) (2) 平面認識 (Environmental Understanding) (3) 明るさ推定 (Light Estimation) (4) マーカー認識 (Augmented Image) (5) 空間共有 (Cloud Anchor) (6) 顔認識 (Augmented Faces)
- 10. 開発ツール：Unity Unityとは マルチプラットフォーム対応のゲームエンジンおよび開発環境 GUI上で視覚的にCGを配置したり機能を追加したりできる C#によるプログラミングで細かい挙動も記述可能 アセットストアで高品質なCGやアニメーションを入手できる
- 11. 今日の内容 ① CGを表示 ②平面検出とCGの配置 ③ 空間にドローイング ④ 顔認識
- 12. 事前準備 • Unity2017.4.26 orlater https://unity3d.com/jp/unity/qa/lts- releases • ARCore SDK 1.7 https://github.com/google-ar/arcore- unity-sdk/releases/tag/v1.11.0.1 • Sample http://arfukuoka.lolipop.jp/ARCore_Sa pporo/sample.zip
- 13.
- 14.
- 15.
- 16.
- 17.
- 18.
- 19.
- 20.
- 21.
- 22.
- 23.
- 24.
- 25. CGの詳細情報の編集：位置の指定 位置とサイズを変更 Position 0 00 Scale 1 1 1
- 26.
- 27.
- 28.
- 29.
- 30.
- 31.
- 32.
- 33.
- 34.
- 35.
- 36.
- 37.
- 38.
- 39.
- 40.
- 41. スクリプトを使って立方体を回転 public class NewBehaviourScript: MonoBehaviour { // 初期化のために初回に一回だけ実行される void Start () { } // 毎フレーム(数10ミリ秒おきに)実行される void Update () { } }
- 42. スクリプトを使って立方体を回転 public class NewBehaviourScript: MonoBehaviour { // 初期化のために初回に一回だけ実行される void Start () { } // 毎フレーム(数10ミリ秒おきに)実行される void Update () { //毎フレームY軸を中心に1度ずつ回転 transform.Rotate(0, 1, 0, Space.Self); } } Selfの場合
- 43.
- 44.
- 45.
- 46.
- 47. ARCoreのインポート ①Assets ②Import Package → CustomPackage ③arcore-unity-sdk-xxx ④開く
- 48.
- 49.
- 50.
- 51. ARCore用のカメラの設定(2/2) ①GoogleARCore → Prefabs ②ARCoreDevice ③Hierarchyにドラッグ&ドロップ
- 52. 表示オブジェクトの追加(1/2) ①GoogleARCore → Examples→ Common → Prefabs ② AndyGreenDiffuse ③ドラッグ&ドロップ
- 53.
- 54.
- 55.
- 56.
- 57.
- 58. ビルドの準備 ①Product Nameを入力 ② Resolutionand Presentation
- 59.
- 60.
- 61. ビルドの準備 ①Package Nameを設定 例) com.arfukuoka.test1 ②Minimum API Levelを Android 7.0に設定
- 62.
- 63.
- 64.
- 65.
- 66.
- 67.
- 68.
- 69.
- 70. Environmental Understandingを有効化(4/5) ①sample1.assetをクリック 【Plane FindingMode】 (1)Disabled:平面認識なし (2)Horizontal And Vertical： 水平面と垂直面を認識 (3)Horizontal： 水平面のみ認識 (4)Vertical 垂直面のみ認識 今回は(2)～(4)から好きなのを選択
- 71.
- 72.
- 73.
- 74.
- 75.
- 76. 認識した平面の可視化 (5/6) ①GoogleARCore →Examples → Common → Prefabs ②DetectedPlaneVisualizer
- 77.
- 78.
- 79.
- 80.
- 81.
- 82.
- 83. スクリプトの記述 using System.Collections; using System.Collections.Generic; usingUnityEngine; using GoogleARCore; public class PutScript : MonoBehaviour { public GameObject andy; //CG(Andy)を扱う変数 void Start () { } void Update () { //タップの検出 //タップした画面の座標と3D空間座標の対応付け //Andyをその位置に置く } }
- 84. スクリプトの記述 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→画面をなぞる 平面を構成するポリゴンの 内側をタップ判定の対象に
- 85. スクリプトの記述 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; } }
- 86.
- 87.
- 88.
- 89.
- 90.
- 91.
- 92.
- 93.
- 94.
- 95.
- 96.
- 97.
- 98.
- 99.
- 100.
- 101.
- 102.
- 103.
- 104.
- 105.
- 106.
- 107. TrailRendererを用いた線描画 ①New Script ③Create andAdd ②DrawScript
- 108.
- 109. スクリプトの記述 using System.Collections; using System.Collections.Generic; usingUnityEngine; using GoogleARCore; public class DrawScript : MonoBehaviour { public GameObject obj; //軌跡を描くオブジェクトの元データ GameObject drawObj; //実際の軌跡描画に使うオブジェクト void Start () { } void Update () { //タップの検出 //タップ開始時に線を描くオブジェクトを生成 //その後はスマホの位置にオブジェクトを追従させて線描画 } }
- 110. スクリプトの記述 void Update (){ if (Input.touchCount == 1) { //カメラ手前10cmの位置を取得 Vector3 p = Camera.main.transform.TransformPoint(0,0,0.1f); //タッチスタート TouchPhase phase = Input.GetTouch(0).phase; if (phase == TouchPhase.Began) { drawObj = GameObject.Instantiate(obj, p, Quaternion.identity); } //押下中 else if (phase == TouchPhase.Stationary || phase == TouchPhase.Moved){ drawObj.transform.position = p; } } }
- 111.
- 112.
- 113.
- 114. 線を消す List<GameObject> lines =new List<GameObject>(); void Update () { if (Input.touchCount == 1) {//カメラ手前10cmの位置を取得 Vector3 p = Camera.main.transform.TransformPoint(0,0,0.1f);// TouchPhase phase = Input.GetTouch(0).phase; if ( phase == TouchPhase.Began) { drawObj = GameObject.Instantiate(obj, p, Quaternion.identity); GameObject tmp = GameObject.Instantiate(obj, p, Quaternion.identity); lines.Add(tmp); drawObj = tmp; } //押下中 else if (phase == TouchPhase.Stationary || phase == TouchPhase.Moved){ drawObj.transform.position = p; } } }
- 115. 線を消す void Update (){ if (Input.touchCount == 1) { //線の描画をする/カメラ手前10cmの位置を取得 } else if (Input.touchCount == 2) { if (Input.GetTouch(0).phase == TouchPhase.Ended) { for(int i = 0; i < lines.Count; i++) { Destroy(lines[i]); lines[i] = null; } lines.Clear(); } } }
- 116.
- 117.
- 118.
- 119.
- 120.
- 121.
- 122.
- 123.
- 124.
- 125.
- 126.
- 127.
- 128.
- 129.
- 130.
- 131.
- 132.
- 133.
- 134.
- 135.
- 136.
- 137.
- 138.
- 139.
- 140.
- 141.
- 142.
- 143.
- 144.
- 145.
- 146.
- 147.
- 148.
- 149.
- 150.
- 151.
- 152.
- 153.
- 154.
- 155.
- 156.
- 157.
- 158.
- 160. 今日の内容 Googleが提供する次世代ARプラットフォーム。普通のスマホでマーカーレスARを実現。 【主要機能】 (1) 自己位置推定 (MotionTracking) (2) 平面認識 (Environmental Understanding) (3) 明るさ推定 (Light Estimation) (4) マーカー認識 (Augmented Image) (5) 空間共有 (Cloud Anchor) (6) 顔認識 (Augmented Faces)
- 161.
- 162. ARCoreの機能 Googleが提供する次世代ARプラットフォーム。普通のスマホでマーカーレスARを実現。 【主要機能】 (1) 自己位置推定 (MotionTracking) (2) 平面認識 (Environmental Understanding) (3) 明るさ推定 (Light Estimation) (4) マーカー認識 (Augmented Image) (5) 空間共有 (Cloud Anchor) (6) 顔認識 (Augmented Faces) この辺も使えるようになる
- 163. ARCore × OpenCV https://youtu.be/E5Jy4iunpyQhttps://youtu.be/MviBGZtiv5A
- 164.
- 165.
- 166.
- 167. ARCoreハンズオン資料 • ARCoreハンズオン (自己位置推定/マーカー認識/CloudAnchor) https://www.slideshare.net/ssuserc0d7fb/arcore- 108717431 • 塗り絵AR https://www.slideshare.net/ssuserc0d7fb/opencvarcore unityar • スタンプAR https://www.slideshare.net/ssuserc0d7fb/openar- 152506475 • 簡易HMD Aryzon https://www.slideshare.net/ssuserc0d7fb/aryzonar- 141441121