空間の魔術師〜Unityで思うがままにデコるAR作ってみた〜

##はじめに
今回初めてUnityを使い、iPhoneのARアプリを作ってみました！
作ったものは画面でタップした位置に用意したオブジェクトをランダムに出現させるARです。
UnityにはAR用のライブラリがあり、割と気軽に出来たので皆さんに共有したいと思います。

実際に作ったものは以下です！！
![イメージ 5-2.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/378268/0c3f6af7-9a2e-eebd-5305-ff3a8ebfe5fb.gif)


##アジェンダ

1. 事前準備
2. 実装
3. 成果物
4. 終わりに


##1. 事前準備

(1) **Unityをインストール**
[Unity公式サイト](https://unity3d.com/jp/get-unity/download)

(2) **Unity-ARKit-Plugin をダウンロード**
[Unity-ARKit-Plugin(ARKit 2)](https://bitbucket.org/Unity-Technologies/unity-arkit-plugin/downloads/)

(3) **Xcodeをインストール**
iOS 12向けにアプリをビルドする必要があるので、Xcode 10以上のバージョンが必要。
AppStoreからダウンロード。

(4) **iOSを12にアップデート**
iOSを12にアップデートしないとアプリが動かないので、iOSを12にアップデート！！ なお、ARKit2が使えるのは、iPhone 6s 以降です。

##2. 実装

(1) Unityから新規で３Dプロジェクトを作成し、Assets配下にダウンロードした「Unity-ARKit-Plugin」と今回画面に出現させるオブジェクトをAsset Storeからダウンロードして格納する。
ちなみに今回利用したAsset Storeは以下の2つです。 
①[Fruit Pack](https://assetstore.unity.com/packages/3d/props/food/fruit-pack-80254)
②[POLYCRAFT - Christmas Tree](https://assetstore.unity.com/packages/3d/vegetation/trees/polycraft-christmas-tree-108277)
![全画面_2019_08_30_8_01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/378268/f654f2e3-cfb2-0429-f273-ee6083a98ffa.png)

(2) Assets > UnityARKitPlugin >Examples > UnityARKitScene 配下にあるUnityARKitSceneをダブルクリックして開く。Hierarchy上にすでに何個かオブジェクトがあるが、今回使わないものは削除しておいて良いので、以下のキャプチャだけ残せば良い。
ちなみにUnityARKitSceneのデフォルトは、平面認識機能と画面タップすると立方体を表示する機能が備わっている。
![全画面_2019_08_30_8_21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/378268/abee045e-4e9d-a2a3-2e12-89bcf27c7ed0.png)

(3) HierarchyからCreateでCreate Emptyを選択。(名前は任意。)
Projectから右クリックでCreate > C# Scriptで、生成したスクリプトに以下のコードを記入。
記入後、Create Emptyにスクリプトをドラッグ&ドロップする。
![全画面_2019_08_31_1_41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/378268/d809728f-0fad-a4a6-f45d-7e54cffe89b8.png)


```C#:TouchController.cs
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.XR.iOS;
using System.Collections;

public class TouchController : MonoBehaviour
{
    // 画面に出現させるオブジェクトを宣言
    public GameObject[] decoratePrefab;

    void CreateObj(Vector3 atPosition)
    {
        // ランダムにオブジェクトを生成する
        int number = Random.Range(0, decoratePrefab.Length);
        GameObject decorateObj = Instantiate(decoratePrefab[number], atPosition, Quaternion.identity);
        // 正面を向いたオブジェクトを出現させる
        decorateObj.transform.Rotate(0.0f, 180.0f, 0.0f, Space.World);
    }

    void Update()
    {
        if (Input.touchCount > 0 )
        {
            var touch = Input.GetTouch(0);
            if (touch.phase == TouchPhase.Began)
            {
                var screenPosition = Camera.main.ScreenToViewportPoint(touch.position);
                ARPoint point = new ARPoint
                {
                    x = screenPosition.x,
                    y = screenPosition.y
                };

                // スクリーンの座標をWorld座標に変換
                List<ARHitTestResult> hitResults = UnityARSessionNativeInterface.GetARSessionNativeInterface().HitTest(point, ARHitTestResultType.ARHitTestResultTypeFeaturePoint);
                if (hitResults.Count > 0)
                {
                    foreach (var hitResult in hitResults)
                    {
                        Vector3 position = UnityARMatrixOps.GetPosition(hitResult.worldTransform);
                        CreateObj(new Vector3(position.x, position.y, position.z));
                        break;
                    }
                }
            }
        }
    }
}
```


(4) Create EmptyのInspectorのスクリプトのsizeにランダムに出現させたいオブジェクトの種類数を入力し、オブジェクト(Prefab等)をドラッグ&ドロップする。
![全画面_2019_08_31_1_45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/378268/4003b6e3-7289-12cb-35b4-0faadd3a64ed.png)

(5) メニュータブのFile > Build Settings でPlatformをIOSにswitchする。
Edit > Project Settings を押下し、以下のキャプチャの設定を行う。(Bundle Identiferは任意の名前に変更)
そして再びFile > Build Settingsに戻り、ビルド対象のシーンがUnityARKitSceneになっていることを確認し、Build And Runを押下。
![Unity_2019_1_10f1_Personal_-_UnityARKitScene_unity_-_AR_ball_appear_-_iOS__Personal___Metal_.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/378268/a9b6a067-1b91-7b6e-7cee-c98d2ca5164b.png)
![Build_Settings_と_Unity_2019_1_10f1_Personal_-_UnityARKitScene_unity_-_AR_ball_appear_-_iOS__Personal___Metal_.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/378268/5850b439-e58f-e5dd-d99f-802bcf732f9c.png)
(6) ビルド後Xcodeが開かれるので、iphoneをMacに接続しビルド実行。
Xcodeでiphoneに初めてビルドするときはApple IDの登録が必要なため以下を参考に設定してください。
[iPhoneアプリを実機で動かす＆エラー対処](https://pg-happy.jp/xcode-iphone-jikki.html)

ビルド後、iphoneにUniryアプリが作成されているので、カメラのアクセスを許可し正常に動作することを確認。

##3. 成果物


こんな感じでオブジェクトを何個でも置ける！！(カオスww)
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/378268/068436b2-b671-b006-0f4f-b6c07971003f.png" width=50%>
##4. 終わりに

ARを作る前は、どう作ればいいのか一切分からず、難しいものと思い込んでいましたが、ARKitを使えば比較的容易に作成できました！
ARは特に達成感があり、オススメです。
今回は試しに作ってみただけなので、次回はもう少し凝ったARを作成したいと思います。

参考記事
https://recruit.gmo.jp/engineer/jisedai/blog/arkit-unity-plugin/