Tutorial: Creation of AR Coloring with OpenCV and ARCore

Slide 1

Slide 1 text

with OpenCV and ARCore Tutorial: Creation of AR Coloring

Slide 2

Slide 2 text

Download and Installation ①Sample Data for the Tutorial http://arfukuoka.lolipop.jp/nurie/sample.zip ②ARCoreSDK(v1.8.0) https://github.com/google-ar/arcore-unity-sdk/releases/tag/v1.8.0 ③Unity2017.4.15f1 or later https://unity3d.com/jp/unity/qa/lts-releases?version=2017.4 ④Android SDK https://developer.android.com/studio ※Please finish setting up Android build on Unity before hand.

Slide 3

Slide 3 text

You can see also… Source Code https://github.com/TakashiYoshinaga/AR-Coloring

Slide 4

Slide 4 text

Goal of The Tutorial https://youtu.be/E5Jy4iunpyQ https://youtu.be/MviBGZtiv5A

Slide 5

Slide 5 text

ARCore New marker-less AR platform which can available for Android devices. 【Features】 (1) Motion Tracking based on SLAM (2) Environmental Understanding (3) Light Estimation (4) Augmented Image (5) Cloud Anchor (6) Augmented Faces

Slide 6

Slide 6 text

OpenCV Plus  Unity asset of image processing based on OpenCV3.  OpenCVSharp was adapted to Unity environment.  Available on Windows/Mac/Android/iOS.

Slide 7

Slide 7 text

Procedure of Image Processing Clipping ROI Binarization Square Detection Transformation input output Attachment

Slide 8

Slide 8 text

Getting Started with Unity

Slide 9

Slide 9 text

Creation of a Unity Project New

Slide 10

Slide 10 text

Creation of a Unity Project Create Project Name of the Project

Slide 11

Slide 11 text

Adding a 3D Object Right Click 3DObject → Cube

Slide 12

Slide 12 text

Applying a Texture to Material Change the appearance by applying texture image

Slide 13

Slide 13 text

Creation of a Material File ①Assets ②Right Click

Slide 14

Slide 14 text

Creation of a Material File ①Create ②Material

Slide 15

Slide 15 text

Creation of a Material File ①NewMaterial ②Click here

Slide 16

Slide 16 text

Creation of a Material File ①Legacy Shaders ②Diffuse

Slide 17

Slide 17 text

Creation of a Material File Texture will be assigned here later

Slide 18

Slide 18 text

Importing a Texture Image ①Assets ②ImportNewAsset...

Slide 19

Slide 19 text

Importing a Texture Image ①Sample Folder ②Select ilovear & opencv ③Import

Slide 20

Slide 20 text

Applying a Texture Image NewMaterial

Slide 21

Slide 21 text

Applying a Texture Image ①See ilovear ②Drag & Drop

Slide 22

Slide 22 text

Applying a Texture Image Image was assigned

Slide 23

Slide 23 text

Applying a Material to 3D Object ①Click Cube ②Open Materials ※Click ▼

Slide 24

Slide 24 text

Applying a Material to 3D Object ①See NewMaterial ②Drag & Drop it into Element0

Slide 25

Slide 25 text

Applying a Material to 3D Object Appearance was changed

Slide 26

Slide 26 text

Changing a Material to 3D Object ①Cube ②Open the Detail Information of NewMaterial

Slide 27

Slide 27 text

Changing a Material to 3D Object ①See opencv ②Drag & Drop it Texture Area

Slide 28

Slide 28 text

Changing a Material to 3D Object Appearance was changed

Slide 29

Slide 29 text

Check Point & Next Step 【Check Point】 Appearance can be changed just by replacing texture file if a material to use texture was applied to3D model. 【Next Step】  Create texture from inner area of square frame.  Writing C# script to replace texture automaticaly.

Slide 30

Slide 30 text

Save the Scene ①File ②Save Scene as...

Slide 31

Slide 31 text

Save the Scene ①Write the name of scene ②Save

Slide 32

Slide 32 text

Installation of ARCore SDK ①Assets ②Import Package ③Open SDK from Custom Package arcore-unity-sdk-v1.8.0.unitypackage

Slide 33

Slide 33 text

Installation of ARCore SDK Import

Slide 34

Slide 34 text

Installation of ARCore SDK GoogleARCore was added

Slide 35

Slide 35 text

Setting Up Camera for AR Delete Main Camera

Slide 36

Slide 36 text

Setting Up Camera for AR Assets→GoogleARCore→Prefabs

Slide 37

Slide 37 text

Setting Up Camera for AR ①ARCore Device ②Drag & Drop into Hierarchy

Slide 38

Slide 38 text

Setting Up Camera for AR ①ARCore Device ②Double Click DefaultSessionConfig

Slide 39

Slide 39 text

Setting Up Camera for AR Switch Camera Focus Mode to Auto

Slide 40

Slide 40 text

Modification of Position & Scale of a CG Click Cube

Slide 41

Slide 41 text

Modification of Position & Scale of a CG Position: 0, -0.2, 0.5 Scale: All 0.1

Slide 42

Slide 42 text

視点 ViewPoint 0.5 Y X -0.2 Z

Slide 43

Slide 43 text

Saving the Scene Ctrl/Command + S

Slide 44

Slide 44 text

Build Setting ①File ②Build Settings...

Slide 45

Slide 45 text

Build Setting ①Android ②Switch Platform

Slide 46

Slide 46 text

Build Setting ①Internal ②Player Settings

Slide 47

Slide 47 text

Build Setting ①Resolution and Presentation ②Select Portrait as Default Orientation

Slide 48

Slide 48 text

Build Setting ①Other Settings ②Turn Off Multithreaded Rendering

Slide 49

Slide 49 text

Build Setting ①Set original PackageName 例)com.fukuoka.test ②Set Minimum API Level as Andrid 7.0

Slide 50

Slide 50 text

Build Setting (for Unity2018) Set Allow unsafe Code Checked

Slide 51

Slide 51 text

Build Setting ①XR Settings ②Setting ARCore Supported Checked

Slide 52

Slide 52 text

Saving the Scene Ctrl/Command+S

Slide 53

Slide 53 text

Installation App Into Smartphone ①File ②Build & Run

Slide 54

Slide 54 text

Installation App Into Smartphone ①Set a name of installer(.apk) ②Save

Slide 55

Slide 55 text

Run

Slide 56

Slide 56 text

From Next Slide.. Preparation for Getting Started with Image Processing

Slide 57

Slide 57 text

Installation of OpenCV Plus Unity ①Window ②Asset Store

Slide 58

Slide 58 text

Installation of OpenCV Plus Unity Search “OpenCV Plus”

Slide 59

Slide 59 text

Installation of OpenCV Plus Unity Open OpenCV Plus

Slide 60

Slide 60 text

Installation of OpenCV Plus Unity Download

Slide 61

Slide 61 text

Installation of OpenCV Plus Unity Import

Slide 62

Slide 62 text

Installation of OpenCV Plus Unity Import

Slide 63

Slide 63 text

Installation of OpenCV Plus Unity OpenCV + Unity will appear

Slide 64

Slide 64 text

Setting Up the View of Unity Editor Game This operation means making your modification of UI layout of application comfortable in Unity Editor.

Slide 65

Slide 65 text

Setting Up the View of Unity Editor ①Click Free Aspect ②Click＋ This operation means making your modification of UI layout of application comfortable in Unity Editor.

Slide 66

Slide 66 text

Setting Up the View of Unity Editor ①Put Name ②800 × 1280

Slide 67

Slide 67 text

Importing Sample UI ②Import Package ①Assets ③Custom Package...

Slide 68

Slide 68 text

Importing Sample UI ②Open ①NurieUI.unitypackage

Slide 69

Slide 69 text

Importing Sample UI Import

Slide 70

Slide 70 text

Importing Sample UI Scene

Slide 71

Slide 71 text

Using Sample UI ①Canvas ②Drag & Drop into Hierarchy

Slide 72

Slide 72 text

Using Sample UI UI was added to the Scene UI might not be visible the view point which you using know. But it’s not problem! Please see next page.

Slide 73

Slide 73 text

Using Sample UI ①Double Click Canvas ②You can see whole UI

Slide 74

Slide 74 text

Using Sample UI ①Click x or z ②Modify view point to make UI to be facing to you

Slide 75

Slide 75 text

Role of UI Results of Image Processing Showing ROI Switch visibility of UI Starting capture

Slide 76

Slide 76 text

Preparation of Writing C# Script Write click on the blank of Hierarchy

Slide 77

Slide 77 text

Preparation of Writing C# Script Create Empty

Slide 78

Slide 78 text

Preparation of Writing C# Script ①Game Object ②Add Component

Slide 79

Slide 79 text

Preparation of Writing C# Script ①New Script ②Name of Script (ex. ColoringScript) ③Create and Add

Slide 80

Slide 80 text

Preparation of Writing C# Script ①Game Object ②ColoringScript was added

Slide 81

Slide 81 text

Preparation of Writing C# Script Double Click

Slide 82

Slide 82 text

Importing OpenCV and UnityEngine.UI using UnityEngine; using UnityEngine.UI; using OpenCvSharp; using OpenCvSharp.Demo; public class ColoringScript : MonoBehaviour { // Start関数は初期化のために一度だけ実行される void Start () { cg = GameObject.Find ("Robot Kyle"); } // Update関数は毎フレーム実行される void Update () { } }

Slide 83

Slide 83 text

Declaration of Variables public MeshRenderer target; //Rendering Setting of Cube public GameObject canvas; //Canvas which involves UI public RawImage viewL, viewR; //Result viewer UnityEngine.Rect capRect;//Region of screen shot Texture2D capTexture; //Texture of screenshot image Texture2D colTexture; //Result of image processing(color) Texture2D binTexture; //Result of image processing(gray) void Start () { } void Update () { } canvas viewL viewR colTexture binTexture

Slide 84

Slide 84 text

Linking Objects and Variables ①Click GameObject ②See Target

Slide 85

Slide 85 text

Linking Objects and Variables See Cube Drag & Drop into Target of ColoringScript

Slide 86

Slide 86 text

Linking Objects and Variables See Canvas Drag & Drop into Canvas of ColoringScript

Slide 87

Slide 87 text

Linking Objects and Variables See RawImage Drag & Drop into ViewL of ColoringScript

Slide 88

Slide 88 text

Linking Objects and Variables View RawImage(1) Drag & Drop into ViewR of ColoringScript

Slide 89

Slide 89 text

Procedure of Image Processing Clipping ROI Binarization Square Detection Transformation input output Attachment

Slide 90

Slide 90 text

Procedure of Image Processing Clipping Binarization Square Detection Transformation output Attachment input

Slide 91

Slide 91 text

Preparation of Screen Capture public MeshRenderer target; public GameObject canvas; public RawImage viewL, viewR; UnityEngine.Rect capRect; Texture2D capTexture; Texture2D colTexture; Texture2D binTexture; void Start () { int w = Screen.width; int h = Screen.height; //Definition of capture region as (0,0) to (w,h) capRect = new UnityEngine.Rect(0, 0, w, h); //Creating texture image of the size of capRect capTexture = new Texture2D(w, h, TextureFormat.RGB24, false); } width height (0,0)

Slide 92

Slide 92 text

Making Function of Image Processing void Start () { /*Code was omitted in the slide.*/ } IEnumerator ImageProcessing() { canvas.SetActive(false);//Making UIs invisible yield return new WaitForEndOfFrame(); capTexture.ReadPixels(capRect, 0, 0);//Starting capturing capTexture.Apply();//Apply captured image. /*Setting texture on the coloring target object (cube)*/ target.material.mainTexture = capTexture; canvas.SetActive(true);//Making UIs visible. } public void StartCV() { StartCoroutine(ImageProcessing());//Calling coroutine. } Write!

Slide 93

Slide 93 text

Calling StartCV() From UI ①Click Button ②Find Button ③Click + laying on bottom of OnClick()

Slide 94

Slide 94 text

Calling StartCV() From UI Find GameObject Drag & Drop into the area written None, of OnClick()

Slide 95

Slide 95 text

Calling StartCV() From UI ①Click No Function ②ColoringScript

Slide 96

Slide 96 text

Calling StartCV() From UI StartCV()

Slide 97

Slide 97 text

Ctrl/Command + S

Slide 98

Slide 98 text

Build & Run!

Slide 99

Slide 99 text

Run Capture

Slide 100

Slide 100 text

Procedure of Image Processing Clipping Binarization Square Detection Transformation output Attachment input

Slide 101

Slide 101 text

Procedure of Image Processing Binarization Square Detection Transformation output Attachment Clipping ROI input

Slide 102

Slide 102 text

Clipping Image of Inside the ROI void Start () { int w = Screen.width; int h = Screen.height; //Setting up position/size of ROI int sx = (int)(w * 0.2); //Start of X int sy = (int)(h * 0.3); //Start of Y w = (int)(w * 0.6); //Width of ROI h = (int)(h * 0.4); //Height of ROi //キャプチャする領域を保持したRectを作成 capRect = new UnityEngine.Rect(0, 0, w, h); capTexture = new Texture2D(w, h, TextureFormat.RGB24, false); } capRect = new UnityEngine.Rect(sx, sy, w, h); Replace!

Slide 103

Slide 103 text

Run Capture You can find coloring sheet (pdf) in Markers folder.

Slide 104

Slide 104 text

Refactoring (1/2) IEnumerator ImageProcessing() { canvas.SetActive(false); yield return new WaitForEndOfFrame(); //描画終了を待つ capTexture.ReadPixels(capRect, 0, 0);//キャプチャ開始 capTexture.Apply();//各画素の色をテクスチャに反映 /*下記の一行でオブジェクトにテクスチャを張り付け*/ target.material.mainTexture = capTexture; canvas.SetActive(true); } void CreateImage() { /*Cut & Paste Code of Image Creation*/ } void ShowImage() { /*Cut & Paste Code of Image Visualization*/ } Image Creation Visualization

Slide 105

Slide 105 text

Refactoring (2/2) IEnumerator ImageProcessing() { canvas.SetActive(false); yield return new WaitForEndOfFrame(); CreateImage(); //Image Creation ShowImage(); //Image Visualization canvas.SetActive(true); } void CreateImage() { capTexture.ReadPixels(capRect, 0, 0); capTexture.Apply(); } void ShowImage() { target.material.mainTexture = capTexture; }

Slide 106

Slide 106 text

Procedure of Image Processing Binarization Square Detection Transformation output Attachment Clipping ROI input

Slide 107

Slide 107 text

Clipping ROI input Procedure of Image Processing Square Detection Transformation output Attachment Binarization

Slide 108

Slide 108 text

From now on, we use OpenCV!

Slide 109

Slide 109 text

Binarization of Gray Scale Image 0 255 0 255 Binarization means splitting grayscale(0~255) into 0 or 255 by threshold. It’s very important technique to define pixels which should be processed.

Slide 110

Slide 110 text

Preparation of Using Image with OpenCV Texture2D colTexture; Texture2D binTexture; //Mat:Format of image for OpenCV //bgr is for color image、bin is for binarized image Mat bgr, bin; void Start () { int w = Screen.width; int h = Screen.height; int sx = (int)(w * 0.2); int sy = (int)(h * 0.3); w = (int)(w * 0.6); h = (int)(h * 0.4); capRect = new UnityEngine.Rect(sx, sy, w, h); capTexture = new Texture2D(w, h, TextureFormat.RGB24, false); }

Slide 111

Slide 111 text

Binarization void CreateImage() { capTexture.ReadPixels(capRect, 0, 0); capTexture.Apply(); //Conversion Texure2D to Mat bgr = OpenCvSharp.Unity.TextureToMat(capTexture); //Conversion Color Image to Gray Scale Image bin = bgr.CvtColor(ColorConversionCodes.BGR2GRAY); //Binarization of image with Otsu’s method. bin = bin.Threshold(100, 255, ThresholdTypes.Otsu); Cv2.BitwiseNot(bin, bin); } Color Image Gray Scale Binary Inverse

Slide 112

Slide 112 text

Visualization of Results void ShowImage() { //Releasing memories of textures. if (colTexture != null) { DestroyImmediate(colTexture); } if (binTexture != null) { DestroyImmediate(binTexture); } //Conversion of Mat to Texture2D colTexture = OpenCvSharp.Unity.MatToTexture(bgr); binTexture = OpenCvSharp.Unity.MatToTexture(bin); //Attaching texture to RawImage for visualization. viewL.texture = colTexture; viewR.texture = binTexture; //スクショ画像をモデルに適用 target.material.mainTexture = colTexture; }

Slide 113

Slide 113 text

Releasing Memories Allocated for Mat IEnumerator ImageProcessing() { canvas.SetActive(false); yield return new WaitForEndOfFrame(); CreateImage(); ShowImage(); //Releasing Memories allocated for two Mats bgr.Release(); bin.Release(); canvas.SetActive(true); }

Slide 114

Slide 114 text

Run ①Put marker into ROI ②Capture ③Clipped Image and Binarized Image

Slide 115

Slide 115 text

Clipping ROI input Procedure of Image Processing Square Detection Transformation output Attachment Binarization

Slide 116

Slide 116 text

Binarization Clipping ROI input Procedure of Image Processing Transformation output Attachment Square Detection

Slide 117

Slide 117 text

Preparation of Square Frame Detection IEnumerator ImageProcessing() { canvas.SetActive(false); yield return new WaitForEndOfFrame(); CreateImage(); Point[] corners; //4 corners of square will be memorized FindRect(out corners); //Square Frame Detection ShowImage(); //画像の表示 bgr.Release(); bin.Release(); canvas.SetActive(true); } void FindRect(out Point[] corners) { /*Code will be described from next page.*/ }

Slide 118

Slide 118 text

Contour Detection //Initialization of corners corners = null; //contour points and hierarchy Point[][] contours; HierarchyIndex[] h; //Contour detection bin.FindContours(out contours, out h, RetrievalModes.External, ContourApproximationModes.ApproxSimple); //Finding the contour of which has the most wide area. double maxArea = 0; for(int i = 0; i < contours.Length; i++) { double area = Cv2.ContourArea(contours[i]); if (area > maxArea) { maxArea = area; corners = contours[i]; } }

Slide 119

Slide 119 text

Visualization of the Result void FindRect(out Point[] corners) { /*Code is omitted in this slide.*/ double maxArea = 0; for (int i = 0; i < contours.Length; i++) { double area = Cv2.ContourArea(contours[i]); if (area > maxArea) { maxArea = area; corners = contours[i]; } } //Write a contour line of max area in bgr. if (corners != null) { bgr.DrawContours( new Point[][] { corners }, 0, Scalar.Red, 5); } }

Slide 120

Slide 120 text

Run

Slide 121

Slide 121 text

Polygon Approximation void FindRect(out Point[] corners) { /*Code is omitted in this slide*/ double maxArea = 0; for(int i = 0; i < contours.Length; i++) { //Calculate the length of contour line. double length = Cv2.ArcLength(contours[i], true); //Polygon Approximation. Point[] tmp = Cv2.ApproxPolyDP( contours[i], length * 0.01f, true); double area = Cv2.ContourArea(contours[i]); //If number of corner is 4. if (area > maxArea) { maxArea = area; corners = contours[i]; } } /*次のページに続く*/ if (tmp.Length == 4 && area > maxArea) corners = tmp;

Slide 122

Slide 122 text

Visualization of Corners void FindRect(out Point[] corners) { /*Code is omitted in this slide.*/ if (corners != null) { bgr.DrawContours( new Point[][] { corners }, 0, Scalar.Red, 5); //Draw circle on the position of corner point. for(int i = 0; i < corners.Length; i++) { bgr.Circle(corners[i], 20, Scalar.Blue, 5); } } }

Slide 123

Slide 123 text

Run 四角形以外は認識されない

Slide 124

Slide 124 text

Before seeing next step… void FindRect(out Point[] corners) { /*Code is omitted in this slide.*/ //Comment out the visualization code. /*if (corners != null) { bgr.DrawContours( new Point[][] { corners }, 0, Scalar.Red, 5); //各頂点の位置に円を描画 for(int i = 0; i < corners.Length; i++) { bgr.Circle(corners[i], 20, Scalar.Blue, 5); } }*/ }

Slide 125

Slide 125 text

Binarization Clipping ROI input Procedure of Image Processing Transformation output Attachment Square Detection

Slide 126

Slide 126 text

Square Detection Binarization Clipping ROI input Procedure of Image Processing output Attachment Transformation

Slide 127

Slide 127 text

Perspective Transformation (0, 0) (255, 0) (0, 255) (255 255) [0] [1] [2] [3]  Deform distorted square to front view based on the result of calculation of perspective transformation matrix.

Slide 128

Slide 128 text

Perspective Transformation IEnumerator ImageProcessing() { canvas.SetActive(false); yield return new WaitForEndOfFrame(); CreateImage(); Point[] corners; FindRect(out corners); TransformImage(corners); //Deform distorted square. ShowImage(); //画像の表示 bgr.Release(); bin.Release(); canvas.SetActive(true); } void TransformImage(Point[] corners) { /*Code will be described from the next page.*/ }

Slide 129

Slide 129 text

Perspective Transformation void TransformImage(Point[] corners) { //Do nothing if square wasn’t found. if (corners == null) return; //Input detect corners. Point2f[] input = { corners[0], corners[1], corners[2], corners[3] }; //Define corners of square image. Point2f[] square = { new Point2f(0, 0), new Point2f(0, 255), new Point2f(255, 255), new Point2f(255, 0) }; //Calculation of transformation matrix. Mat transform = Cv2.GetPerspectiveTransform(input, square); //Deform image as front view square. Cv2.WarpPerspective(bgr,bgr,transform, new Size(256, 256)); } (0, 0) (255, 0) (0, 255) (255 255) [0] [1] [2] [3]

Slide 130

Slide 130 text

Run Result of deformation is different by the rotation of square frame in the ROI. Rotated

Slide 131

Slide 131 text

 Local position of corner at [0] depends on rotation of square.  Sorting is necessary to obtain image of front standing view. [0] [1] [2] [3] [0] [1] [2] [3] Succeeded Failed

Slide 132

Slide 132 text

Sorting Corner Points void TransformImage(Point[] corners) { if (corners == null) return; //Sorting SortCorners(corners); Point2f[] input = { corners[0], corners[1], corners[2], corners[3] }; Point2f[] square = { new Point2f(0, 0), new Point2f(0, 255), new Point2f(255, 255), new Point2f(255, 0) }; Mat transform = Cv2.GetPerspectiveTransform(input, square); Cv2.WarpPerspective(bgr,bgr,transform, new Size(256, 256)); } void SortCorners(Point[] corners) { /*Code of sorting is described in the next page.*/ }

Slide 133

Slide 133 text

Sorting Corner Points void SortCorners(Point[] corners) { System.Array.Sort(corners, (a, b) => a.X.CompareTo(b.X)); if (corners[0].Y > corners[1].Y) { corners.Swap(0, 1); } if (corners[3].Y > corners[2].Y) { corners.Swap(2, 3); } } [0] [1] [2] [3] [2] [0] [1] [3] [3] [0] [1] [2] Sort by X axis Sort [2][3] by Y axis

Slide 134

Slide 134 text

Clip a Image Inside the Square Frame void TransformImage(Point[] corners) { if (corners == null) return; SortCorners(corners); Point2f[] input = { corners[0], corners[1], corners[2], corners[3] }; Point2f[] square = { new Point2f(0, 0), new Point2f(0, 255), new Point2f(255, 255), new Point2f(255, 0) }; Mat transform = Cv2.GetPerspectiveTransform(input, square); Cv2.WarpPerspective(bgr,bgr,transform, new Size(256, 256)); int s = (int)(256*0.05);//Line width of frame is 5% of square int w = (int)(256*0.9);//Width of clipping area is 90% of square OpenCvSharp.Rect innerRect = new OpenCvSharp.Rect(s, s, w, w); bgr = bgr[innerRect]; }

Slide 135

Slide 135 text

Square Detection Binarization Clipping ROI input Procedure of Image Processing output Attachment Transformation

Slide 136

Slide 136 text

Transformation Square Detection Binarization Clipping ROI input Procedure of Image Processing output Attachment

Slide 137

Slide 137 text

Applying Texture to 3D Object void ShowImage() { //すでにcolTextureが存在するならいったん削除 if (colTexture != null) { DestroyImmediate(colTexture); } if (binTexture != null) { DestroyImmediate(binTexture); } //Matをテクスチャに変換 colTexture = OpenCvSharp.Unity.MatToTexture(bgr); binTexture = OpenCvSharp.Unity.MatToTexture(gray); //RawImageに切り抜き画像を表示 viewL.texture = colTexture; viewR.texture = binTexture; //Applying texture to target 3D object target.material.mainTexture = capTexture; //Show Canvas gain. canvas.SetActive(true); } target.material.mainTexture = colTexture; Replace

Slide 138

Slide 138 text

Run

Slide 139

Slide 139 text

Switching Visiblity of ROI ①Toggle ②Click + laying on the bottom of OnValueChanged

Slide 140

Slide 140 text

Switching Visiblity of ROI ①See Panel ②Drag&Drop it int None of OnValue Changed

Slide 141

Slide 141 text

Switching Visiblity of ROI Click No Function

Slide 142

Slide 142 text

Switching Visiblity of ROI ①GameObject ②Click SetActive of Dynamic bool

Slide 143

Slide 143 text

Run Turn off

Slide 144

Slide 144 text

Repalace 3D Model

Slide 145

Slide 145 text

Poly Download 3D model from Google Poly https://poly.google.com/

Slide 146

Slide 146 text

Getting 3D Model Input search word here Search「Duck」

Slide 147

Slide 147 text

Getting 3D Model Rubber Duck

Slide 148

Slide 148 text

Getting 3D Model Download → OBJ File

Slide 149

Slide 149 text

Getting 3D Model Unzip archive.zip

Slide 150

Slide 150 text

Importing 3D Model ①Assets ②Drag & Drop archive folder into Assets

Slide 151

Slide 151 text

Replacing 3D Model Delete Cube

Slide 152

Slide 152 text

Replacing 3D Model Assets → archive

Slide 153

Slide 153 text

Replacing 3D Model ①RubberDuck ②Drag&Drop into Hierarchy

Slide 154

Slide 154 text

Modification of Position/Size of 3D Model ①RubberDuck ②Position 0 -0.25 0.5 Rotation 0 150 0 Scale 0.03 0.03 0.03