スポンサーリンク
AR・VR開発

Unity AR Foundation入門|スマホ向けARアプリの作り方

AR・VR開発

Unityで自分だけのARアプリを作ってみたいけれど、ARKitやARCoreといった単語が並ぶだけで身構えてしまう…そんな方も多いのではないでしょうか。特に環境構築の段階でつまずいてしまうと、そのままAR開発自体を諦めてしまうこともあります。

この記事では、UnityのAR Foundationを使ってスマホ向けARアプリを作るための一連の流れを、環境構築から平面検出・画像トラッキング・光源推定といった実装例まで、順を追ってまとめています。

AR Foundationの対応環境とバージョンを確認する

AR Foundationを使い始める前に、まず確認しておきたいのが対象プラットフォームごとの対応バージョンです。iOS向けなのかAndroid向けなのか、あるいは両方に対応させたいのかによって、必要なプラグインや設定が変わってきます。

下の表に、それぞれのプラットフォームで最低限そろえておきたい条件をまとめました。自分が使いたい環境の行だけチェックすれば十分です。

項目 iOS Android HoloLens
必要なプラグイン Apple ARKit XR Plug-in(5.0/6.0) Google ARCore XR Plug-in(5.0/6.0) OpenXR Plug-in(1.2以上)
対応OSバージョン iOS 15.0以上 Android 7.0(APIレベル24)以上
必要な開発ツールなど Xcode 11以上 IL2CPP対応(ARM64)

推奨されるUnityのバージョンは、2021.2/2021.3/2022.1、またはUnity 6です。使用しているUnityのバージョンが古すぎると、そもそもAR Foundationの新しい機能に対応していない場合があるので、プロジェクト開始前にバージョンだけは先に確認しておくと安心です。

注意

以前は「Unity ARKit Plugin」のようなプラットフォーム個別のプラグインを使う方法もありましたが、現在は非推奨となっています。これから学ぶのであれば、最初からAR Foundationに統一して進めるのが遠回りにならずに済みます。

ちなみに、AR FoundationはHoloLensのようなデバイスにも対応しており、この設計思想はUnityのVR開発とも共通する部分があります。OpenXRを軸にした環境構築の考え方については、こちらの記事も参考になります。




プロジェクト作成とパッケージ導入の手順

環境の確認が終わったら、いよいよ実際にプロジェクトを用意していきます。ここでは新規プロジェクトの作成から、AR Foundationに必要なパッケージを導入するところまでを一気に進めます。

プラットフォーム切り替えとパッケージのインストール

まずはUnity Hubで新規プロジェクトを作り、ターゲットとするプラットフォームに切り替えるところから始めましょう。

  1. Unity Hubを起動し、新規プロジェクトをテンプレート「3D」で作成する
  2. メニュー「File > Build Settings」を選択する
  3. 「Platform」からターゲットとするOS(iOSまたはAndroid)を選択し、「Switch Platform」ボタンを押す

プラットフォームの切り替えができたら、続けてAR Foundation本体と、各OS向けのプラグインをパッケージとして追加します。

  1. メニュー「Window > Package Manager」を選択してPackage Managerを開く
  2. 左上のドロップダウンで「Packages: Unity Registry」を選択する
  3. 「+ > add package by name」を選択し、com.unity.xr.arfoundation(AR Foundation本体)を指定してインストールする
  4. 同様に、Android向けのcom.unity.xr.arcore、iOS向けのcom.unity.xr.arkitもそれぞれインストールする

ワンポイント

顔認識機能を使いたい場合は「ARKit Face Tracking」のような追加パッケージも必要になります。まずは基本の3つを入れて、必要になったタイミングで追加していけば十分です。

XR Plug-in Managementでのプラグイン有効化

パッケージを入れただけではAR機能はまだ動きません。次に、どのプラグインを使うかをUnity側にきちんと指定してあげる必要があります。

  1. メニュー「Edit > Project Settings > XR Plug-in Management」を開く
  2. 「iOS」タブを選び、「Apple ARKit」にチェックを入れる
  3. 「Android」タブを選び、「Google ARCore」にチェックを入れる

実機を用意していなくても、パソコン上でAR動作の確認をしたい場合は、あわせて次の設定もしておきましょう。

  1. 「XR Plug-in Management」の設定画面で、PC用の「XR Simulation」の項目にチェックを入れる

この設定をしておくことで、後の章で紹介するエディタ上での動作確認がスムーズに行えるようになります。




iOS/Androidのプレイヤー設定を調整する

パッケージとプラグインの設定が終わったら、次はプラットフォームごとのPlayer Settingsを調整していきます。ここを飛ばしてしまうと、ビルド自体が失敗したり、AR機能が正しく動かなかったりするので、少し細かい設定ですが一つずつ確認していきましょう。

Androidの設定

Android向けにビルドする場合は、グラフィックスAPIやスクリプティングバックエンドなど、いくつかの項目を初期状態から変更する必要があります。

  1. 「Edit > Project Settings > Player」を開き、「Other Settings」を展開する
  2. 「Graphics APIs」のリストから「Vulkan」を選択して削除し、「OpenGLES 3」のみにする(「Auto Graphics APIs」のチェックは外しておく)
  3. 「Minimum API Level」を「Android 7.0(API level 24)」以上に設定する
  4. 「Scripting Backend」を「IL2CPP」に変更する
  5. 「Target Architectures」の「ARM64」にチェックを入れる

注意

「Graphics APIs」をOpenGLES 3のみにする設定を忘れると、実機でARCoreが正しく機能しないことがあります。ここは見落としやすいポイントなので、他の設定と合わせて必ず確認してください。

iOSの設定

iOS向けの設定は、Androidと比べるとシンプルですが、カメラの利用許可に関する項目だけは忘れずに入力しておく必要があります。

  1. 「Edit > Project Settings > Player」を開き、「Other Settings」を展開する
  2. 「Camera Usage Description」に、カメラを使う目的を説明するメッセージ(例:「AR機能にカメラを使います。」)を入力する
  3. 「Target minimum iOS Version」を「15.0」以上に設定する

この「Camera Usage Description」は、アプリがカメラにアクセスしようとしたときにユーザーへ表示される文言です。ここが空欄のままだと、iOSではカメラを使う許可が求められずアプリがクラッシュしてしまうので、必ず何かしらの説明文を入れておきましょう。


AR SessionとXR Originで基本シーンを作る

プレイヤー設定が終わったら、いよいよARシーンの土台を作っていきます。ここでやることはシンプルで、「AR Session」と「XR Origin」という2つのオブジェクトをシーンに追加するだけで、ARの基本シーンが完成します。

  1. Hierarchyウィンドウにあるデフォルトの「Main Camera」を右クリックして削除する
  2. メニュー「GameObject > XR > AR Session」を選択してシーンに追加する
  3. メニュー「GameObject > XR > XR Origin」を選択してシーンに追加する

「AR Session」は、AR全体のライフサイクルやセッション制御を担う、いわば司令塔のような役割を持つコンポーネントです。一方の「XR Origin」は、現実世界のカメラ位置やトラッキング情報を、Unityのシーン内の座標に変換・同期する役割を担っています。

ワンポイント

「XR Origin」は、以前は「AR Session Origin」という名前で呼ばれていました。古い解説記事やUnityのバージョンによっては名称が異なることがありますが、どちらも役割はほぼ同じものだと考えて問題ありません。

ここまでで、AR機能を動かすための最低限の土台が整いました。次の章からは、この土台の上に実際の機能を実装していきます。




平面検出でタップした位置にオブジェクトを配置する

ここからは、実際にARらしい機能を実装していきます。まず作るのは、カメラに映った床やテーブルなどの平面を検出し、その平面をタップした位置にオブジェクトを配置する機能です。「AR Plane Manager」と「AR Raycast Manager」という2つのコンポーネントを組み合わせることで実現できます。

平面検出の準備

最初に、検出した平面を可視化するためのプレハブを用意し、それを「XR Origin」に登録していきます。

  1. メニュー「GameObject > XR > AR Default Plane」を選択して平面オブジェクトを作成する
  2. 作成した「AR Default Plane」をHierarchyからProjectウィンドウ(Assetsフォルダなど)にドラッグ&ドロップしてプレハブ化する
  3. プレハブ化が完了したら、Hierarchy上の「AR Default Plane」オブジェクトは削除する
  4. Hierarchyで「XR Origin」を選択し、Inspectorの「Add Component」から「AR Plane Manager」を検索して追加する
  5. 「Plane Prefab」の項目に、先ほど作成した「AR Default Plane」プレハブをドラッグ&ドロップして設定する

床のような水平な平面だけを検出させたい場合は、あわせて次の設定もしておくと余計な誤検出を減らせます。

  1. 「AR Plane Manager」の「Detection Mode」で「Vertical」のチェックを外し、「Horizontal」のみを有効にする

タップ判定とオブジェクト配置

平面が検出できるようになったら、次はその平面をタップしたときに、実際にオブジェクトを配置する仕組みを作ります。まずは配置するオブジェクト自体をプレハブとして用意しましょう。

  1. メニュー「GameObject > 3D Object > Sphere」または「Cube」を選択してオブジェクトを作成する
  2. TransformのScaleを、実空間で違和感のない小さめのサイズ(例:X=0.1, Y=0.1, Z=0.1)に調整する
  3. 作成したオブジェクトをProjectウィンドウへドラッグ&ドロップしてプレハブ化し、Hierarchy上のオブジェクトは削除する

続いて、画面タップの位置と現実空間の座標を結びつけるための「AR Raycast Manager」を追加します。

  1. Hierarchyで「XR Origin」を選択する
  2. Inspectorの「Add Component」から「AR Raycast Manager」を検索して追加する

ワンポイント

同じ「Raycast」という名前がついていますが、この「AR Raycast Manager」は通常の3D空間で使うPhysics.Raycastとは別物です。ARで検出された平面などの「トラッキング対象」に向けて判定を行う、AR Foundation専用の仕組みだと考えてください。通常のRaycastとの違いをもう少し詳しく知りたい方は、こちらの記事もあわせて参考にしてみてください。

最後に、タップを検知して実際にオブジェクトを生成するスクリプトを作成します。Projectウィンドウで右クリックし「Create > C# Script」を選択して、名前を「PlaneDetection」としたら、以下のコードを記述してください。

using System.Collections.Generic;
using UnityEngine;
using UnityEngine.XR.ARFoundation;
using UnityEngine.XR.ARSubsystems;

public class PlaneDetection : MonoBehaviour
{
    ARRaycastManager raycastManager;
    [SerializeField] GameObject targetPrefab;

    private void Awake()
    {
        raycastManager = GetComponent<ARRaycastManager>();
    }

    void Update()
    {
        if (Input.touchCount == 0 || Input.GetTouch(0).phase != TouchPhase.Ended || targetPrefab == null)
        {
            return;
        }

        var hits = new List<ARRaycastHit>();
        // 検出した平面のポリゴン内部を対象にレイキャストを実行
        if (raycastManager.Raycast(Input.GetTouch(0).position, hits, TrackableType.PlaneWithinPolygon))
        {
            var hitPose = hits[0].pose;
            // レイがヒットした現実世界の座標と回転に合わせてプレハブを生成
            Instantiate(targetPrefab, hitPose.position, hitPose.rotation);
        }
    }
}

スクリプトが書けたら、最後に次の手順でシーンに組み込みます。

  1. Hierarchyで「XR Origin」を選択する
  2. Inspectorの「Add Component」から作成した「PlaneDetection」スクリプトを追加する
  3. 「Target Prefab」スロットに、先ほど作成した配置用オブジェクトのプレハブをドラッグ&ドロップして紐づける

ここまで設定できれば、検出した平面をタップするたびに、指定したオブジェクトがその場所に生成されるようになります。




画像トラッキングでARオーバーレイを表示する

平面検出とは別の方向性として、特定の画像を認識させて、その上に情報を重ねて表示する「画像トラッキング」という機能もあります。看板や商品パッケージなどをカメラで映すと、その上に映像や画像が浮かび上がるような演出は、この仕組みで実現されています。

Reference Image Libraryの作成とターゲット画像登録

まずは、認識させたい画像をUnityに登録するための「Reference Image Library」を作成します。

  1. Projectウィンドウで右クリックし、「Create > XR > Reference Image Library」を選択する
  2. 作成したライブラリの名前を「BillboardImageLibrary」など、わかりやすいものに変更する
  3. 作成したImage Libraryアセットを選択し、Inspectorの「Add Image」ボタンをクリックして、認識対象にしたいターゲット画像をドラッグ&ドロップで登録する
  4. 登録した画像に「Billboard_01」のような名前を設定し、「Physical Size」の幅に現実世界での実寸法(例:幅2mの看板なら「2.0」)を入力する

この「Physical Size」は、あとで説明するスケール調整に直結する重要な項目です。実際のサイズと大きくずれていると、認識はできてもオーバーレイの大きさがおかしくなってしまうので、できるだけ正確な数値を入力しておきましょう。

AR Tracked Image Managerの設定とオーバーレイ用Prefab作成

ライブラリの準備ができたら、それを実際にシーンで使うための「AR Tracked Image Manager」を追加します。

  1. Hierarchyで「XR Origin」オブジェクトを選択する
  2. Inspectorの「Add Component」から「AR Tracked Image Manager」を検索して追加する
  3. 「Serialized Library」プロパティに、先ほど作成した「BillboardImageLibrary」をドラッグ&ドロップして登録する
  4. 「Max Number Of Moving Images」に、同時に動的追跡したい画像の数(例:同時に1つだけなら「1」)を設定する

次に、画像の上に重ねて表示するオーバーレイ用のオブジェクトを作っていきます。

  1. Hierarchyで空のGameObjectを作成し、名前を「AdOverlay」とする
  2. 「AdOverlay」を右クリックして「3D Object > Quad」を追加する
  3. Quadのトランスフォームを、看板と平行になるよう「Rotation X=90, Y=0, Z=0」に、Scaleを看板の比率(例:X=2, Y=1, Z=1)に調整する
  4. Projectで右クリックして「Create > Material」からマテリアルを作成し、名前を「AdMaterial」、Shaderを「Unlit/Texture」に設定したうえで、Albedoに表示したい画像を登録し、QuadのMesh Rendererに適用する
  5. 「AdOverlay」をProjectウィンドウにドラッグしてプレハブ化し、Hierarchy上のオブジェクトは削除する
  6. 「XR Origin」の「AR Tracked Image Manager」にある「Tracked Image Prefab」に、プレハブ化した「AdOverlay」をドラッグ&ドロップして紐づける

画像追跡用スクリプトの実装

最後に、画像が認識されているかどうかに応じて、オーバーレイの表示・非表示やサイズを自動で切り替えるスクリプトを実装します。「AdOverlay」プレハブにアタッチする「ImageTrackedHandler」というスクリプトを作成し、以下のように記述してください。

using UnityEngine;
using UnityEngine.XR.ARFoundation;
using UnityEngine.XR.ARSubsystems;

public class ImageTrackedHandler : MonoBehaviour
{
    [SerializeField] private GameObject adOverlay; 
    private ARTrackedImage trackedImage;

    void Start()
    {
        trackedImage = GetComponent<ARTrackedImage>();
        if (adOverlay != null)
        {
            adOverlay.SetActive(false);
        }
    }

    void Update()
    {
        if (trackedImage == null || adOverlay == null) return;

        // 画像のトラッキング状態に応じて表示を制御
        if (trackedImage.trackingState == TrackingState.Tracking)
        {
            adOverlay.SetActive(true);
            adOverlay.transform.localPosition = Vector3.zero;
            adOverlay.transform.localRotation = Quaternion.Euler(90f, 0f, 0f);
            
            // 検出した画像サイズに合わせてスケールを自動調整
            Vector2 size = trackedImage.size;
            adOverlay.transform.localScale = new Vector3(size.x, size.y, 1f);
        }
        else
        {
            adOverlay.SetActive(false);
        }
    }
}

スクリプトを保存したら、Directional Lightのインスペクター上でスロットを設定する必要はありません。代わりに、「AdOverlay」プレハブのインスペクター上で「Ad Overlay」スロットに、自分自身(またはオーバーレイ表示させたい子オブジェクト)を紐づけておきましょう。

ワンポイント

画像トラッキングは、画像の一部が隠れたり、光の反射で見えにくくなったりすると認識が不安定になりやすい機能です。看板やパッケージなど、実際に使う環境での見え方も想定しながら画像を選ぶと、トラブルを減らせます。




光源推定で仮想オブジェクトの光をリアルにする

平面検出や画像トラッキングでオブジェクトを配置できるようになると、次に気になってくるのが「なんだか浮いて見える」という違和感ではないでしょうか。これは、仮想オブジェクトに現実の照明環境が反映されていないことが原因の一つです。「光源推定」という機能を使えば、現実の明るさや色味に合わせて仮想オブジェクトの見え方を調整できます。

ARCameraManagerでの光源推定設定

まずは、カメラ側で光の情報を取得できるように設定を有効にしていきます。

  1. Hierarchyから「XR Origin > Camera Offset > Main Camera」を選択する
  2. 「ARCameraManager」コンポーネントの「Light Estimation」プロパティにある、以下の項目にチェックを入れる
  • Ambient Intensity(明るさ)
  • Ambient Color(色温度)
  • Color Correction(色味補正)

あわせて、シーン内の「Directional Light」の設定も確認しておきましょう。

  1. 「Directional Light」オブジェクトを選択する
  2. Lightコンポーネントの「Type」が「Directional」、「Mode」が「Realtime」になっていることを確認する

光源推定反映スクリプトの実装

設定を有効にしただけでは、まだ取得した光の情報がシーンに反映されません。ここからは、C#スクリプト「LightEstimate」を作成し、Directional Lightにアタッチしていきます。

using UnityEngine;
using UnityEngine.XR.ARFoundation;

public class LightEstimate : MonoBehaviour
{
    [SerializeField] ARCameraManager aRCameraManager;
    private Light lightComponent;

    void Awake()
    {
        lightComponent = GetComponent<Light>();
    }

    private void OnEnable()
    {
        if (aRCameraManager != null)
            aRCameraManager.frameReceived += OnCameraFrameChanged;
    }

    private void OnDisable()
    {
        if (aRCameraManager != null)
            aRCameraManager.frameReceived -= OnCameraFrameChanged;
    }

    void OnCameraFrameChanged(ARCameraFrameEventArgs args)
    {
        // 明るさの反映
        if (args.lightEstimation.averageBrightness.HasValue)
        {
            float brightness = args.lightEstimation.averageBrightness.Value;
            lightComponent.intensity = brightness;
            RenderSettings.ambientIntensity = brightness; // 環境光に反映
        }

        // 色温度の反映
        if (args.lightEstimation.averageColorTemperature.HasValue)
        {
            float colorTemperature = args.lightEstimation.averageColorTemperature.Value;
            lightComponent.colorTemperature = colorTemperature;
        }

        // 色味補正の反映
        if (args.lightEstimation.colorCorrection.HasValue)
        {
            Color colorCorrection = args.lightEstimation.colorCorrection.Value;
            lightComponent.color = colorCorrection;
        }
    }
}

スクリプトを保存したら、最後にDirectional Lightのインスペクター上で、スクリプトの「AR Camera Manager」スロットに「Main Camera」オブジェクトをドラッグ&ドロップして設定してください。

ワンポイント

光源推定の精度は、デバイスの性能やOSのバージョンによって差が出ることがあります。すべての端末で完全に同じ見え方になるとは限らない、という前提で確認しておくと安心です。

この設定まで終えると、周囲の明るさや色合いに応じて仮想オブジェクトの見た目が自然に変化するようになり、現実の風景に馴染みやすくなります。




エディタと実機でARの動作を確認する

ここまでの設定と実装が終わったら、実際にAR機能が正しく動いているかを確認していきましょう。実機を用意していなくても、Unityエディタ上でARの動きをある程度確認できる「XR Simulation」という便利な機能があるので、まずはそちらから試してみるのがおすすめです。

XR Simulationでの確認方法

先ほど設定した「XR Simulation」が有効になっていれば、実機がなくてもエディタ上でARの疑似体験ができます。

  1. 「Edit > Project Settings > XR Plug-in Management」で「XR Simulation」が有効になっていることを確認する
  2. UnityエディタのPlayボタンを押す

シミュレーション中は、以下の操作でカメラを動かしながら動作を確認できます。

  • マウス右クリックを押しながらマウスを移動すると視点を見回せる
  • Wキーで前進、Sキーで後進
  • Aキーで左移動、Dキーで右移動
  • Qキーで下移動、Eキーで上移動

デフォルトの環境だけでなく、自分でテスト用の空間を作りたい場合は、次の方法でカスタム環境を用意することもできます。

  1. 「Window > XR > AR Foundation > XR Environment」ウィンドウを開く
  2. 「Create environment」を選択し、LiDARスキャンモデルなどの3D環境モデルを使ってカメラの初期位置などを設定・アタッチする

実機(iOS/Android)でのビルドと実行

エディタ上での確認である程度動きが見えてきたら、最終的には実機での確認が欠かせません。カメラの映り方やタップ操作の感覚は、実際の端末で試して初めてわかる部分も多いためです。

  1. 「File > Build Settings」を開く
  2. 「Scenes In Build」に、動作確認したいARシーンを追加する
  3. 「Build And Run」ボタンを押す

ここから先の手順は、iOSとAndroidで少し異なります。

  • iOSの場合:ビルド後に生成されたXcodeプロジェクトを開き、適切な開発用プロビジョニングを設定したうえで、実機を指定してインストール・実行する
  • Androidの場合:Android端末をPCに接続した状態でビルドすると、apkファイルが自動生成され、実機でアプリが起動する

注意

エディタのXR Simulationでは正常に動いていても、実機ビルドすると挙動が変わることがあります。特にARは端末依存の要素が多い機能なので、「エディタでは動いたのに実機で動かない」というケースにあたった場合は、以下の記事もあわせて確認してみてください。

エディタと実機、両方で動作を確認しておくことで、公開前に気づきにくいトラブルを未然に防ぎやすくなります。


よくある質問

Q
AR Foundationを使うのにUnity Proライセンスは必要ですか?
A
AR Foundationの基本機能は、無料のUnity Personalでも利用できます。本記事で紹介した平面検出や画像トラッキング、光源推定といった機能も、Proライセンスがなくても試すことが可能です。ただし、会社の年間売上や資金調達額が一定の基準を超える場合は、Unityの利用条件上Proプランへの切り替えが必要になることがあるため、商用での本格的な開発を考えている場合は、その点だけ事前に確認しておくと安心です。
Q
ARKit用とARCore用でスクリプトを書き分ける必要がありますか?
A
基本的には書き分ける必要はありません。AR Foundationは、ARKitとARCoreの機能を共通のAPIとしてまとめているため、本記事で紹介した平面検出や画像トラッキングのスクリプトは、そのままどちらのプラットフォームでも動作します。ただし、フェイストラッキングなど一部のOS限定機能を使う場合は、対応プラグインの追加やプラットフォームごとの条件分岐が必要になることがあります。
Q
光源推定はどんなデバイスでも同じ精度で使えますか?
A
いいえ、デバイスの性能やOSのバージョンによって精度に差が出ることがあります。特にAmbient Color(色温度)やColor Correction(色味補正)は、機種によって取得できる情報の細かさが異なる場合があります。開発中は複数の端末で見え方を確認しておくと、公開後に「思っていたのと違う見え方だった」という事態を避けやすくなります。

※当サイトはアフィリエイト広告を利用しています。リンクを経由して商品を購入された場合、当サイトに報酬が発生することがあります。

※本記事に記載しているAmazon商品情報(価格、在庫状況、割引、配送条件など)は、執筆時点のAmazon.co.jp上の情報に基づいています。
最新の価格・在庫・配送条件などの詳細は、Amazonの商品ページをご確認ください。

スポンサーリンク