見出し画像

【Unity】画像認識のARコンテンツを作ってみた

こんにちは! エンジニアの宮Pです。
前回の平面認識ARに続いて、今回は画像認識のARコンテンツの話です🙂
お菓子のパッケージや、観光スポットに用意されたイラストなどをスマホの画面で映して3Dモデルを表示させるという仕掛けがありますよね。
今回は、そんなARアプリを作ってみようと思います😄


ARの環境づくり

まずはARの環境づくりからです。
この自分の記事を参考にして「AR Foundationをインストール」の手順まで進めました。
やけに大変だったの記憶があるのですが、今回はサクッと完了。前回は調べながら進めていたから時間が掛かったのでしょうね😉

Hierarchy内のMain Cameraを削除して、AR SessionとAR Session Originを作るところまでも、前回と同様です。

ARマーカーを作成する

画像認識をさせるターゲットとなる画像を登録します。
今回は弊社のロゴを使います。

弊社のロゴです

実はこのロゴの前に別の画像で試していたのですが、以下のエラーが発生してアプリを起動することが出来ませんでした。

Failed to get enough keypoints from target image.

「ターゲットの画像から十分なキーポイントを取得できませんでした」というように訳せますが、要するに「その画像はシンプルすぎる」ということのようです。
ちなみに、エラーが出た時の画像はこのUniyのロゴです。

Unityのロゴです

シンプルで素敵なデザインですが、ターゲット画像としてはある程度複雑であったほうが誤った検出が少なくなる、ということなのでしょう🙄

ARマーカーのライブラリを作成します。
Projectの+ボタンをクリックして、Create、XR、Reference Image Libraryの順に選択してください。

Reference Image Libraryは一番下です

Add Imageをクリックして、このReference Image Libraryにターゲット画像を登録します。
Physical Sizeには、実際の画像の大きさを入力します。
A4用紙に印刷したところ、20センチ四方程度の大きさでしたので「0.2」を入れておきます(「1」=1メートルです)。

AR Tracked Image Managerコンポーネントの追加

前回は平面を認識するためのAR Plane Managerを使いました。
今回は画像を認識するためのAR Tracked Image Managerを利用します。
Hierarchy内のAR Session Originを選択して、InspectorのAdd ComponentからAR Tracked Image Managerを追加してください。

このAR Tracked Image Managerの中身を設定していきます。
Serialized Libraryには、先ほど作ったReferenceImageLibraryをドラッグします。
Max Number of Moving Imagesには、トラッキングするマーカーの個数を入力します。
Tracked Image Prefabには、ARマーカーが検出された際に表示する3Dモデルを設定します。目立つようにピンク色のSphereを使ってみます。

3DのSphereにピンク色のMaterialを貼ってます

実際の動作を見てみます。
カメラの前にターゲット画像が印刷された紙を持ってきた瞬間に、ピンク色のSphereが表示されます。
このSphereは、ターゲット画像に合わせて移動します。

画像を認識しています

無事にターゲット画像を認識しています👌
さらにアニメーションするモデルを使ったり、コードを追加してタップ操作に反応させるのも面白そうですね。

とりあえず、トゥーンシェイドの実験中のユニティちゃん(© Unity Technologies Japan/UCL)を置いてみました。
…ちょっと影がおかしくなっているのはご容赦ください😅
その内、ライティングやカメラを修正したバージョンで記事を書きます😋

会社ロゴを踏んでるよ…

まとめ

今回もおつきあい頂きまして、ありがとうございました!
コーディングが無かった分、比較的簡単に画像認識ARコンテンツを作ることができました。
画像認識ができると、一気に仕様の幅が広がりますね!😊

私たちは、お客様のご要望にあわせて様々なVR、ARコンテンツを制作しております。
ご質問やご要望は、<お問い合わせページ>よりお送りください。


この記事が気に入ったらサポートをしてみませんか?