Unity2017でARアプリ - 2.シンプルなARプロジェクト

Vuforiaを使ったARアプリを作るための第一歩として、まずはサンプルのARマーカーを利用して作ります。（オリジナルのARマーカーは次回！）
#はじめる前に
ここではARアプリを使うために、VuforiaというComponentライブラリを利用します。もしVuforiaの利用が初めての方は、こちらの記事
[「Unity2017でARアプリ　1.サンプルを動かす」](https://qiita.com/takako_sudou/items/50644c672310f990bf57)
をご覧いただき、登録や設定を先に行ってください。
#制作手順
##1.新規プロジェクト作成
まずは、Unityで３Dの新規プロジェクトを新規で作ります。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/234600/673132c7-fdee-5dba-c1e8-5a28a87ecbc9.png)
Unityの画面が立ち上がります。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/234600/1dffe27e-a399-87cd-780e-f9e256305d50.png)
##2.Vuforiaの設定
![image.png](https://qiita-image-store.s3.amazonaws.com/0/234600/36a52c7f-33cc-4542-4ca5-b3208ffeb17a.png)
###①Vuforiaの設定を開く
メニュー「Edit」→「Project Setting」→「Player」をクリック（上図中①）
###②ARにチェック
「Vuforia Argumented Reality」にチェック（上図中②）
##3.カメラを配置
###①AR用のカメラを挿入
「Hierarchy」の「Create」→「Vuforia」→「AR Camera」をクリック
![image.png](https://qiita-image-store.s3.amazonaws.com/0/234600/aa058e4c-2418-6866-42af-ebff25ddc34e.png)
###②Import開始
確認画面でImportボタンをクリックすると、必要なデータの読み込みが開始します。しばらく待ちます。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/234600/7722bef6-f95a-94e2-6a3c-274c8e1b2d0c.png)
###③デフォルトのカメラを削除
HieralchyにあるMain Cameraは削除しておきます。
（クリックで選択し、Deleteキー）
##4.Sceneの保存
ここでSceneを保存します。（もっと前でもOK）
①メニュー「File」→「Save Scenes」
②「scene1」と名前を入力し保存。（名前は好きな名前でOK）
画面は下図のようになりました。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/234600/464350f1-ab3f-145b-32e5-ad243ea6a63e.png)
##5.App Licence Keyの設定
###①Keyの取得
こちらをお読みください　[過去記事](https://qiita.com/takako_sudou/items/50644c672310f990bf57#1vuforia%E3%81%AE%E7%99%BB%E9%8C%B2%E3%81%A8key%E3%81%AE%E7%99%BA%E8%A1%8C
)
###②設定
>1)UnityのHierarchyパネル中「ARCamera」をクリックで選択。
2)Inspectorパネル中の「Vuforia Behaviour（Script)」にある「Open Vuforia configration」をクリック。
3)VuforiaConfigrationで、App License Keyに１－④でコピーしたLicense Keyをペースト。（再度vuforiaのサイトへアクセスしてコピーすることも可）
4)Databasesにチェックを入れる（これを忘れると動きません！
こちらから引用[7.の設定](https://qiita.com/takako_sudou/items/50644c672310f990bf57#7%E8%A8%AD%E5%AE%9A)

##6.ARマーカー作成
![image.png](https://qiita-image-store.s3.amazonaws.com/0/234600/a3c93602-55e7-49bc-a8f0-9b250e9f9e51.png)
###①Camera Image Targetの挿入
「Hierarchy」の「Create」→「Vuforia」→「Camera Image」→「Camera Image Target」をクリック。（上図中①）
画面上にカード状のオブジェクトが挿入されます。
また、「Hierarchy」の「scnene1」に「ImageTarget」が挿入されています。
###②使用するマーカー画像のある場所
「Project」の「Assets」→「Editor」→「Vuforia」→「ImageTargetTextures」→「vuforiaMars_Images」をクリックし、サンプルのテクスチャを表示する。（上図中②）
###③マーカーの選択
![image.png](https://qiita-image-store.s3.amazonaws.com/0/234600/caef650b-7508-3005-cddc-84b727e18315.png)
「Hierarchy」の「scnene1」にある「ImageTarget」が選択されている状態で行います。
(1)Image Target Behavior(Script)で、TypeをPredefinedに変更する。
Databaseが、VuforiaMars_Images、Image TargetがAstronautになるのでそのまま今回は使用します。
###④マーカーには、マテリアルとしてAstronautの画像を貼っておきます。
(詳細は割愛）
##7.オブジェクトの配置
「Hierarchy」の「Create」→「3DObject」→「Cube」でキューブを挿入し、サイズとマテリアルを変更する。
##8.カメラの設定
![image.png](https://qiita-image-store.s3.amazonaws.com/0/234600/4e8cb396-d1db-69d5-0794-6b0b5a55ba63.png)
※これはサンプルのプロジェクトを開いたときの画面です。
ここで参考にしたいのは、カメラの位置と角度です。
Position X 0.15 Y 0.15 Z 0
Ratation X 90 Y 0 Z 0
となっています。
上から見ている状態です。これを参考にして設定しました。
設定値
Position X 0 Y 0.15 Z 0
Ratation X 90 Y 0 Z 0
![image.png](https://qiita-image-store.s3.amazonaws.com/0/234600/88547339-aafe-a97e-d742-91919651c2ab.png)

##9.テスト
タブレットにコピーしたARマーカーを表示して認識させました。方法は過去記事と同じです。
[「Unity2017でARアプリ　1.サンプルを動かす」](https://qiita.com/takako_sudou/items/50644c672310f990bf57)
![image.png](https://qiita-image-store.s3.amazonaws.com/0/234600/0c78286f-efc7-a40c-b60c-fc6730a33f25.png)
こんな感じに出ました。