今すぐ始める『えもふりAR』入門

2018/06/20 ・ 12:35 pm

みなさんこんにちは。

CLEARBLUE COMMUNICATIONS 様の iOS アプリ、「まいてつカメラ」が話題になっています。

まいてつカメラ

iPhoneのカメラの中で、まるで「本当にそこにいる」かのようにこちらを見上げるレイルロオドの可憐さに、ノックアウトされた方も多いのでは無いでしょうか？　私はノックアウトされました。

ハチロクかわいい。

近日発売予定の PS4タイトル「まいてつ -pure station-」ではキャラアニメーションに弊社のE-moteをご採用いたいだいております。魂のこもったキャラ達の感情あふれるアニメーションは必見です。

まいてつ – pure station –

まいてつカメラの実装に弊社は直接関わっておりません。ですが、その中核にある E-mote Unity SDKの E-mote VR コンポーネントは、えもふりSDK にも収録されており、OSXを持っている方なら誰でも簡単に開発を試してみることが出来ます。

本日は、iOSのARKit + Unity + えもふりSDKではじめる、速攻お手軽『えもふりAR』ことはじめを紹介してみようと思います。ものの数時間で終わる作業ですので、興味のある方はぜひお付き合いください。

開発環境

今回の開発には以下のような環境を使いました。

OSX	High Sierra 10.13.5
XCode	9.4.1(9F2000)
Unity	20181.5.f1
iOS	11.4(15F79)

動作環境

iOSのARKitは、A9/A10/A11チップを積んでいるiOSデバイスで、iOS11以上のバージョンを搭載していることが動作条件です。

具体的には、次の端末で利用可能です。

iPhon 6S
iPhone 6S Plus
iPhone SE
iPad(第五世代）
iPad Pro(第一世代）
iPhone7
iPhone7 Plus
iPad(第六世代)
iPad Pro(第二世代）
iPhone8
iPhone8 Plus
iPhone X

Unity の新規プロジェクトを作成する

まずはいつものようにUnityの新規プロジェクトを作成しましょう。

Unity ARKit Plugin を導入する

次に、UnityでARKitを利用するためのPluginを導入します。Unity社謹製のPluginがそのものずばり「Unity ARKit Plugin」の名前でAssetStoreに公開されています。

このパッケージの内容を全てインポートします。

えもふりSDKを導入する

次にえもふりの公式ホームページから、最新のえもふりSDKを導入します。
ダウンロードしたフォルダの中にある emote_sdk_type2.unitypackage をダブルクリックします。
このパッケージの内容を全てインポートします。

E-mote VRモデルを導入する

次にE-moteVRモデルを導入します。

E-moteVRモデルは、E-moteVR用の専用パラメータを設定したモデルで、通常のE-moteモデルと比較した場合、3D空間で発生する視点の上下や左右の動きに対して自然な補正をかけ、VR空間やAR空間におけるキャラの実在感を高める機能を持っています。

えもふりSDKに収録済みのVRモデルをそのまま使ってもいいのですが、折角なのでここは見栄えのいいサンプルモデルを使いましょう。

E-moteサンプルキャラクターダウンロードページよりダウンロードできる「かける君」のデータです。

本来このモデルはPSDサイズが大きすぎ、えもふりでは編集出来ないのですが、今日は特別にえもふり向けにエクスポート済みのUnity用モデルデータを用意しましたので、こちらをご使用ください。

Download : えもふり Unity SDK 用かける君モデル

アーカイブの中には２つのファイルがあります。

これらを Assets/Resources/emote/ の下にコピーします。

ARシーンを作成する

それではいよいよAR用のシーンを作成していきましょう。

雛形を確認する

今回は、Unity ARKit Pluginにサンプルとして入っている UnityARKitScene.unity シーンを改造して、E-moteARのシーンを作り上げます。まずはこのシーンを開きましょう。

UnityARKitSceneは、AR空間で床をタップするとその場所にキューブが表示されるだけのシンプルなARサンプルです。

Hierarchy に表示されている HitCube オブジェクトが、タップした地点に表示されることになっているオブジェクトなので、これを削除してE-moteモデルに入れ替えることにします。

新しいGameObjectを作成する

まず、HitCubeを削除して、HitCubeParentの子として空のGameObjectを作ります。

次に、このままE-moteモデルを表示すると画面内で小さくなりすぎるので、Transformのスケールを9.5倍に設定します。

EmotePlayerを設定する

GameObjectに EmotePlayer コンポーネントをアタッチします。

データファイルに、 kakeru_emofuri.bytes を指定します。

足下を基準とするように、AlignmentをAlign to bottomに設定します。

EmoteBillboardControl を設定する

次に、EmoteBillboardControlコンポーネントをアタッチします。

これは、E-moteモデルがプレイヤ（カメラ）の方を常に自然に注視するように制御する、E-moteARの中核となるコンポーネントです。

追随するカメラとして、Target Camera に Hierarchyからドラッグ＆ドロップしてMain Camera を指定します。

UnityARHitTestExampleを設定する

次に、UnityARHitTestExampleコンポーネントをアタッチします。

これは、AR空間をタッチした時にオブジェクトの位置を変更するための、UnityARKitのコンポーネントです。
Hit Transform に、HierarchyからHitCubeParentを指定します。

これで、UnityARKitSceneの改造は終わりました。

どうです、簡単でしょう？

E-moteロゴを設定する

EmoteLogo.unity を設定する

えもふりSDKは、一旦E-moteロゴを表示しないとキャラをグレーアウトする制限を持っています。

そこで、E-moteロゴからUnityARKitSceneへ遷移するように設定を行います。
EmoteLogo.unity を開きます。

ロゴの表示後に遷移をするように、EmotePlayerにアタッチされているEmoteLogoコンポーネントのNext Sceneに、UnityARKitSceneと記入します。