ランスタのブログ

気になった事の実験や検証、Cinema4Dでのモデリングや使い方、Unityのゲームアプリ制作に関する記事を書いています。

【スポンサーリンク】

【Unity】ARkitを使って現実世界でニコニ立体ちゃんを等身大で召喚させる【ios】

【スポンサーリンク】

UnityでARkitの使い方 

今回UnityでArkitを動作させる環境と準備は、

1.Unityの5.6.2p2のバージョンを使用している。

2.ニコニ立体ちゃんのモデルをインストール。

3.ARkitをダウンロードしている。

4.Xcode beta3を使用している。

5.iphoneをios11にしている。

になります。

 

最新のUnityパッチをインストールする

まずは以下のUnityのURLに入って5.6.2p2をインストールして下さい。

https://unity3d.com/jp/unity/qa/patch-releases

f:id:Lanstar:20170713224324p:plain

 

ニコニ立体ちゃんをインストールする

次にニコニコ動画のサイトからニコニ立体ちゃんのモデル素材を以下のURLからダウンロードします。

 

ダウンロード場所は以下の赤枠内にある「ダウンロード」からどうぞ。

f:id:Lanstar:20170713224331p:plain

 

ARkitをインストール

次にARkitを以下のサイトに飛び、「リボジトリをダウンロードする」をクリックしてダウンロードします。

https://bitbucket.org/Unity-Technologies/unity-arkit-plugin/downloads/?tab=downloads

f:id:Lanstar:20170713224336p:plain

 

Xcode9 beta3とios11をインストールする

次にXcode9 beta3とios11にする為のインストールを行います。

年会費12000円位のApple Developer Programに入っていないとダウンロード出来ません。

以下のApple DeveloperのURLに飛んでログインします。

http://developer.apple.com/download/

 

ログインしたら赤枠内の「Downloads」をクリックします。

f:id:Lanstar:20170713224340p:plain

 

次にXcode9 beta3をダウンロードします。

f:id:Lanstar:20170713224344p:plain

 

少し下を見るとiOS11 beta3があるので「See all」をクリックします。

f:id:Lanstar:20170713224348p:plain

 

自分の所持しているiphone機種に合わせてダウンロードして下さい。

私はiPhone6 Plusなのでそれに合わせてダウンロードしています。

f:id:Lanstar:20170713224352p:plain

 

ios11にアップデートする

Xcode9 beta3とios11をダウンロードしたらiTuneに行きます。

これからiphoneをios11のバージョンにさせる作業を行います。

f:id:Lanstar:20170713224356p:plain

 

そしてiphoneをmacに接続して下さい。

以下のように赤枠内に出ているiphoneマークをクリックします。

f:id:Lanstar:20170713224359p:plain

 

そして右側にある「アップデートを確認」ボタンをoptionキーを押しながらクリックして下さい。

f:id:Lanstar:20170713224404p:plain

 

そしてダウンロードから先ほどios11をダウンロードしたファイルを選択して、開くをクリックします。

f:id:Lanstar:20170713224409p:plain

 

以下のような画面になるので「アップデート」をクリックしてiphoneをios11のバージョンにさせましょう。

f:id:Lanstar:20170713224413p:plain

 

Unityを起動して新規でプロジェクトを作成

完了したらUnityの5.6.2p2を起動します。

新規でプロジェクトを作成して下さい。

f:id:Lanstar:20170713224417p:plain

 

FinderのダウンロードからARkitをダウンロードしたフォルダ「Unity-Technolohies...なんたらかんたらー」を「Assets」にフォルダをドラッグ&ドロップで入れます。

f:id:Lanstar:20170713224421p:plain

 

再度Finderのダウンロードにあるニコニコ動画からダウンロードしたニコニ立体ちゃんのフォルダ名「Alicia」をクリックして「Unity_Package」→「Alicia_unitypackage」をUnityの「Assets」にドラッグ&ドロップして入れて下さい。

f:id:Lanstar:20170714191549p:plain

 

インポートボタンを押してインポートします。

f:id:Lanstar:20170713224430p:plain

 

次に以下の赤枠の手順のように「Assets」フォルダーをクリックして、

「UnityARkitScene」をクリックしてシーンを開きます。

f:id:Lanstar:20170713224435p:plain

 

開いたら、「RandomCube」と「HitCube」オブジェクトは使用しないので右クリックして「Delete」を選択して2つ削除して下さい。

f:id:Lanstar:20170713224440p:plain

 

iOSアプリ用にプラットフォームを切り替える

次に上のメニューにある「File」→「Build Settings」をクリックします。

f:id:Lanstar:20170713224444p:plain

 

iosにプラットフォームを切り替えましょう。

「ios」を選択して「Switch Platform」をクリックします。

その後に右側中央にある「Add Open Scenes」をクリックして現在のシーンを追加します。

f:id:Lanstar:20170713224449p:plain

 

「Alicia」のフォルダをクリックして「Prefabs」をクリックして中にある「Alicia_solid」をシーンにドラッグ&ドロップして追加します。

f:id:Lanstar:20170713233736p:plain

 

Asset Storeからアニメーションさせる為のMecanim Locomotion Kitをダウンロードする

ニコニ立体ちゃんをアニメーションさせる為のアイテムをAsset Storeからダウンロードします。

「Window」から「Asset Store」にいきます。

f:id:Lanstar:20170713224459p:plain

 

「mecanim locomotion」と検索します。

f:id:Lanstar:20170713224504p:plain

 

以下の赤枠内にあるようにMecanim Locomotionをクリックします。

f:id:Lanstar:20170713224510p:plain

 

インポートボタンを押します。

f:id:Lanstar:20170713224514p:plain

 

インポートすると「Locomotion Setup」のフォルダーが入っているのでクリックして「Locomotion」フォルダーの中にある「Locomotion」を「Alicia_solid」オブジェクトの中にあるAnimatorのControllerにドラッグ&ドロップして入れます。

f:id:Lanstar:20170713224518p:plain

 

再生を押すとエラーが出て再生出来ません。

このエラーはニコニ立体ちゃんにあったjava scriptの中にエラーが発生しています。

以下のように赤枠内のエラー内容をダブルクリックするとMonoDevelopが開きます。

f:id:Lanstar:20170713224523p:plain

 

エラーしていた文言にコメント状態の//を入れて無効にしてビルドしましょう。

f:id:Lanstar:20170713224527p:plain

 

次に「Alicia_solid」オブジェクトをクリックして右側に表示されている2つのスクリプト「Alicia_moof」と「Cam Angles」は使用しないのでチェックを外して無効にします。

f:id:Lanstar:20170713224531p:plain

 

「Alicia_solid」オブジェクトをクリックして「HitCubeParent」の階層の中に入れて子にして下さい。

そして「Alicia_solid」オブジェクトのPositionとScale値を変更します。

等身大レベルでのScale値の設定をしていますので、もしニコニ立体ちゃんを小さく出現させたい場合は、Scale値を7より低く設定して下さい。

f:id:Lanstar:20170713224535p:plain

 

「Alicia_solid」オブジェクトをクリックして右下側にある「Add Component」ボタンをクリックします。

そして「Unity AR Hit Test Example」と検索して、そのスクリプトをクリックして入れて下さい。

次にHierarchyにある「HitCubeParent」オブジェクトを「Unity AR Hit Test Example」スクリプトのHit Transformの隣の枠にドラッグ&ドロップして入れます。

この「Unity AR Hit Test Example」スクリプトは現実世界の平面場所を検知してタッチするとニコニ立体ちゃんを出現させる為のスクリプトになっています。

f:id:Lanstar:20170713224541p:plain

 

再生を押してみて下さい。

ニコニ立体ちゃんがアニメーションしているかどうかプレビュー画面から確認して下さい。

ゲームビューの画面では緑色の画面になっていますが、この状態で大丈夫です。

f:id:Lanstar:20170713224549p:plain

 

Xcodeにビルドする

「File」→「Build Settings」を開いて下にある「Player Setteings」をクリックします。

f:id:Lanstar:20170713224554p:plain

 

「Bundle identifier」を適当に設定して、「Camera Usage Description」に何でもいいですが今回は「ARcamera」と記入して下さい。

この2つを設定しないでxcodeでビルドすると必ずエラーが出るので設定をして下さい。

f:id:Lanstar:20170713224559p:plain

 

設定が終わったら「Build」を押してXcodeにビルドします。

f:id:Lanstar:20170713224603p:plain

 

ビルドするとファイルが表示されるので、以下の赤枠内のファイルをダブルクリックして開きます。

f:id:Lanstar:20170713224607p:plain

 

開いたXcode9がbeta3か確認して下さい。

左上の「Unity-iPhone」をクリックして右側に表示されたTeamボタンをクリックして、自分の開発者名に合わせます。

iPhoneをmacに繋げてビルドボタンを押しましょう。

f:id:Lanstar:20170713224611p:plain

 

ニコニ立体ちゃんが等身大で出現

iphoneにビルドが成功するとカメラのアクセスを求められるので許可を押して平面場所を確認して下さい。

平面の場所だと以下のように青枠が表示されます。

青枠内をクリックして下さい。

f:id:Lanstar:20170713225403p:plain

 

するとニコニ立体ちゃんが等身大で出現するはずです。

出現したのはいいですが、映りが少し悪い感じに見えます。

体調が悪かったのかもしれませんが、これはUnityにあるライトの「Directional light」の当て方によって変わりますので、もっと光を入れたい時は「Alicia_solid」オブジェクトの子に「Directional light」を入れて直接顔に当たるようにライトの角度を設定すると映りが良くなります。

f:id:Lanstar:20170713225415p:plain

 

以上がARkitの使い方でしたが、これに現実世界の壁を自動的に判別してキャラクターが衝突出来たりしたらもっと楽しくなりそうだなーと使っていて色々と想像してしまっていました。

 

閃いた!

 

【スポンサーリンク】