Junpei Qawasaki

博報堂アイ・スタジオという会社でテクノロジーをベースに新規事業とかインタラクティブなものとかを色々とやっております

【30分でできる】Unityで簡単にARアプリを作る

UnityでサクッとARアプリ作れるのでせっかくなので書いておきます。ググると他にも同じ内容出てくるのでとってもポピュラーな事なのですが技術書みるとどうしてもUnityはゲームよりになっちゃうので、ARで使いたい人はお試しください。

 

誤解のないよう、先に書いておくと「Unity=AR」ではないです。正確にはAR用のライブラリを使ってUnityパッケージを作成して、そのパッケージ使うってだけです。

今回は「vuforia」ってライブラリを使った方法をご紹介。他にもいくつか有名どころがあるのでそれはまた後日使ってレポートしたいと思います。

 

では早速つくっていきましょう。

 

1.vuforiaでアカウントを作る

何はともあれvuforiaのDeveloperサイトにいってアカウントをつくりましょう。

f:id:jkawasaki:20131227185958p:plain

右上の「Register」ボタンから必要項目を入力すれば作れます。先も長いのでここは割愛します。

2・Dattabaseの作成とマーカーのアップロード

アカウントが出来たらログインをして上部メニューから「TargetManager」にはいってください。画面内に「CreateDatabase」と出るのでコレを押してマーカ画像のDBを作成します。DB名は適当で良いです。

f:id:jkawasaki:20131227190038p:plain

ここではお試しなので「KawaSample」というDBをつくります。

f:id:jkawasaki:20131227190134p:plain

DBを作成したら次はターゲット(マーカ)を登録します。「Add Target」ボタンを押して必要な項目を入力します。

f:id:jkawasaki:20131227190209p:plain

TargetName … ターゲットの名前

Target Type … ターゲットとなるオブジェクトの形状

Target Dimension …大きさ?

Target ImageFile …登録する画像

登録後、反映までに2〜3分かかります。適当な所でブラウザをリフレッシュして、画像が表示されたらOKです。

 

3・ターゲットのダウンロード

ダウンロードしたいターゲットを選択状態にして上部にある「Downlard Targets」を選択します。デフォルトではSDKが選択状態となっていますが、今回はUnityを使うので"Unity Editer"を選択してCreateボタンを押します。押したらすぐダウンロードがされます。

f:id:jkawasaki:20131227190236p:plain

 

4・vuforia SDKのダウンロード

これでマーカは出来ましたがARを行うのにvuforiaのSDKが必要になります。SDKはvuforiaトップページの「Doeload the SDK」(theって必要なのか?)から落とせますので落としてください。

5・Unity起動

ここでいよいよUnityの起動です。起動して適当に新規projectを作ってください。オプションとか付いてない、空のプロジェクトで大丈夫です。プロジェクトを作成すると"Heararchy"にCameraがデフォルトで用意されますが、不要なので削除してください。

6・パッケージインポート

先ほどvuforiaで作成した2つのパッケージをインポートします。

[Assets]➡[Import Package]➡[custom package]から先にダウンロードした2つのパッケージ(「KawaSample.unitypackage」と「vuforia-unity-android-ios-2-8-7.unitypackage」)をそれぞれインポートしてください。

インポートされたらprojectのAssetsに入ってくるので分かるかと思います。

f:id:jkawasaki:20131227190438p:plain

 

7・ARカメラの設定とImageTargetの設定

この状態では"Heararchy"になにも存在しない状態です。

まずはここに"ARCamera"を追加しましょう。"ARCamera"はさっきダウンロードしたSDKに入ってます。projectの[Qualcomm Augmented Reality]➡[Prefabs]に入っているのでドラッグして入れてください。

f:id:jkawasaki:20131227190617p:plain

もう一つ、同じ場所にあるImageTargetも同様にドラッグして設定します。

8・ARCameraの設定

[Data Set Load Behaviour]という項目の"Load Data Set Test"にチェックを入れましょう。その下にある"Active"にも同様にチェックを入れましょう。これを忘れるとオブジェクト自体は認識されるけど画面には何も映らない、という残念な状況になります。

(これで30分くらいはまりました。。)

ここまで行くとこんな感じで真っ白なターゲットだけがScaneに乗っている状態になります。

f:id:jkawasaki:20131227190826p:plain

9・ImageTargetの設定

次にマーカをImageTargetに設定します。やり方は単純です。[ImageTargetBehavier]の中にDataSetとImageTargetの2つの項目があり、デフォルトでは"EMPUTY"となっています。ここを選択するとプルダウンで先ほどインポートしたファイルが選べるので選べばイメージがセットされます。これでマーカを読み込む準備が出来ました。

f:id:jkawasaki:20131227190859p:plain

10・表示するオブジェクトの設定

今回僕は訳あって、キリンを出すのを目的にしています。なのでキリンの3Dオブジェクトを探しましたが残念ながら無かったので羊のオブジェクトにキリンのテクスチャを貼ったもので代用します。

オブジェクトはprojectに適当に「Texture」とか「obj」みたいにフォルダ切ってそこに突っ込めばOKです。突っ込んだオブジェクトをSceneにドラッグすれば配置出来ます。適当にマーカの上に置きましょう。

f:id:jkawasaki:20131227190955p:plain

 

この時注意なのが、オブジェクトは必ず「ImageTarget」の子要素にしてください。

子要素にしたい場合は親要素にドラッグしてあげればOKです。

さあ、これで準備が出来ました。

11・apkファイルへの書き出し

準備が出来たのでAndroidの実行ファイル(apk)として出力します。

Androidの開発環境を直接は使わないけれど、SDKにアクセスするのでPCに入っている事が前提となります。まずはメニューの[File]➡[BuildSetting]を開きましょう。

下のような画面が上がってくるので「Android」を選んで「Build」を押すだけです。

f:id:jkawasaki:20131227191054p:plain

あとはディレクトリとかを指定すればそこにapkを吐いてくれます。超簡単。

 

12・実行

吐き出されたapkは適当にメールで自分の端末に送るか、慣れている人ならadbコマンドとかでインストールして上げてください。個人的にはGoogleDriveにUPして端末から閲覧するのが一番楽だと思ってますが。

 

で、実行した結果がこちら。

f:id:jkawasaki:20131227191524p:plain

 

30分くらいで楽しく出来ました。

完全にプログラム関係ないので、ものが出来上がっても実感薄めなのですが、それだけUnityが素晴らしいという事で許したいと思います。

ここまで簡単に作れるのですが、実用にあたってはvuforiaもUnityもある程度分かっていないときっとすぐ壁にあたるので引き続き色々作りながら実戦に耐えれるレベルになっていきたいと思っております。

 

メリークリスマス。