Unity + iOS/Android VR ことはじめ

Copyright©Up-frontier,Inc.Allrightsreserved.

Unity+iOS/Android VRことはじめ#1

Gaprot


注意事項


• 本スライドは「2017/03」時点の情報を元に作成されています

• 古い情報になっている場合もありますのでご了承ください

• 記載のバージョン以外の組み合わせでの動作保証はしておりませんのでご注意ください


作成環境


Unity5.6が出ていますが…

• Unity

• 5.5.2f

• GVRSDK

• 1.30


Unity

• 5.6にUnity謹製のVRSDKが同梱されている

• まだ出たばかりなので安定版を

• そういう理由で今回は5.5を使います


GoogleVRSDK

• ダウンロードはここから

• https://developers.google.com/vr/unity/download

https://developers.google.com/vr/unity/download


使うモデルの読み込み


Unityちゃん

• と思ってたのですが…


AmaneKisora-chan

• こっちのほうがモダンと聞いたので

• https://www.assetstore.unity3d.com/jp/#!/content/70581

• AssetStoreにて無料で配布されています

https://www.assetstore.unity3d.com/jp/#!/content/70581


AssetStore• Unityを立ち上げるとこんな画面


AssetStore• ここのタブを押すとAssetStoreが出て来る


AssetStore• こんな感じです


AssetStore• ここで検索しましょう


AssetStore• 検索結果です


AssetStore• インポートを押すとデータを取得できます


AssetStore• こんな感じの確認画面が出ます


AssetStore• 右下のImportを押しましょう


モデルを配置

• Importを押してしばらく待つとAssetsにSapphiArtというデータが追加されます

• この中を見てみると色んなデータが入ってるのがわかると思います。

• 配置するべき物は大概prefabかmodelというフォルダに入ってることが多いです


モデルを配置• 今回はこれを使います


モデルを配置• OBJフォルダに入ってましたね


モデルを配置

• 使うモデルをドラッグアンドドロップで直接sceneかHierarchyと書かれた部分へ配置します

• そうするとモデルがシーン上に表示されます


モデルを配置

直接持っていく


モデルを配置

こっちに持っていく


モデルを配置

無事配置完了！


シーンの作成


シーンを整える

• 見ての通りまだシーン上にはモデルがぽつんと佇んでいるだけになってます

• なので地面とかそういうのを置いてシーンを整えましょう


その前に…


Unityでの操作

• シーンでのUnityの操作を覚えましょう。


視点移動

• 基本的にマウス+キーボードで視点を移動します

• マウスホイールでズームイン・アウト

• オプションキー+ドラッグで視点移動

• オプション+コマンド+ドラッグで水平移動


視点移動

• とりあえずグリグリしてみましょう

• ちなみにHierarchyのところにあるモデルをダブルクリックすると視点がそこに移動します


地面の作成

• 地面を作るにはメニューにあるGameObjectから3DObject>Planeを選択します

• Terrainというのもあるのですが、スマホでは重いのでPlaneを地面にします。


地面の作成


地面の作成

地面ができました


地面の作成

これでは地面とはいえませんね…


地面の作成

ここの値をいじって調整しましょう


地面の作成

Positionのyを0Scaleのxとzを200にしました


地面の作成

真っ白だと味気ないのでテクスチャを張りましょう


地面の作成

とりあえずこれを使いましょう


地面の作成

ここにドラッグアンドドロップで


地面の作成

無事(?)地面ができました！


地面の作成

• 今回はたまたまアセットに入っていた地面に使っても問題無さそうなテクスチャーを張りました

• 本当はもっと地面っぽいものを張ったほうがいいです


配置とVRモード設定


モデルを配置

• 今モデルと地面それからカメラがデフォルトの位置に置いたままになっています

• これでは配置したといえる状況ではないのでいい感じの場所に置きましょう。


モデルを配置

配置後のものがこちらになります


GVRSDK

• 初に紹介したGVRSDKをインポートしましょう

• Unityを開いている状態でダウンロードしてきたGoogleVRForUnity.unitypackageをダブルクリックするとインポートされます。


GVRSDK

Importをクリック！


GVRSDK

無事インポートされました


VR化

• SDKのインポートもできたのでいよいよVRにします！


VR化

GoogleVR>Prefabsのこれを…


VR化

ここに持っていきます


すると…


VR化


できちゃいました！


VR化

• このようにGoogleVRSDKを使用するとVR化することは非常に簡単です

• ゲーム画面でオプションキーを押しながらマウスを動かすと視点をぐるぐる動かすことができます


アニメーションを追加


アニメーション

• 今回使用したモデルではデフォルトで色々と用意されています

• これを理解していくのもいいのですが今回は簡単なものを作ってみたいと思います


mecanim

• Unityでアニメーションを簡単にコントロールすることが出来るツールがmecanimです

• これを利用することで簡単にアニメーションどうしの遷移などを簡単に制御することができます


作ってみよう！

• まずはじめにAnimatorControllerを作成します

• メニューのAssets>Create>AnimatorControllerを選択すると今いるフォルダに作成されます。


作ってみよう！• 作ったアニメーションコントローラはこんな感じ


作ってみよう！• その上で右クリック


作ってみよう！• 出てきたメニューのCreateState>Empty


作ってみよう！• 新しいステートができました


作ってみよう！• Waitという名前をつけておきました


作ってみよう！• もう一つ作成しておきましょう


作ってみよう！• こっちはWalkにしておきました


作ってみよう！• アニメーションアタッチのためにここをクリック


作ってみよう！• 左上の方にメニューが出てきます


作ってみよう！• 今回はidleを選択しましょう


作ってみよう！• もう一つの方はwalkを設定しておきます


ステートマシン

• これら一つ一つをステートとして扱い、それによりアニメーションの状態を管理します

• あくまでアニメーションの状態の管理をするものであり、モデルの状態を管理するものではありません


ステートマシン

• ステートが切り替わる条件などをこのアニメーションコントローラへ書いておきます

• それによりスクリプトから簡単に制御することができます


ステート遷移• 関係性を作るために右クリック


ステート遷移• 出てきたMakeTransitionをクリック


ステート遷移• それを上のステートにつなげるとこうなります


ステート遷移• 反対方向もやっておきましょう


アニメーションの適用

作成したコントローラをモデルへ適用します



これを



ここに



適用できました


ステート制御

• ステートが勝手に切り替わってくれるようになりました

• 次はこのステートの切り替わりを制御しましょう


パラメータ作成• 制御するためのパラメータを作成しましょう


パラメータ作成• ここをクリックします


パラメータ作成• こうなるので+ボタンを押します


パラメータ作成• 今回は時間をトリガーにしたいのでfloatにします


パラメータ作成• 作ったパラメータには適当に名前をつけましょう


パラメータ作成• ついでにパラメータを設定するとこうなります


パラメータ適用• 作成したパラメータを設定しましょう


パラメータ適用• 矢印をクリックするとこうなります


パラメータ適用• 右側のinspectorというところに情報が出ます


パラメータ適用• ここが遷移条件になります


パラメータ適用• +ボタンを押すとさっき作ったものが適用されます


パラメータ適用• ここで以上、以下、等しい、等しくないを選び


パラメータ適用• ここに条件となる数値を入れます


パラメータ適用• 今回は2より大きいという値を設定します


パラメータ適用• 反対の矢印も似たように設定します


ステート制御

• これでとりあえずステート制御の準備が整いました

• 後はスクリプトを作成し、作成したパラメータを変更してあげるとアニメーションがそのパラメータに従い動作します


スクリプト作成

適当なフォルダで右クリック



適当な名前をつけておきましょう



ダブルクリック



MonoDevelopが開きます



とりあえずこういう感じになります



作ったパラメータを指定



時間を進めてパラメータへ設定


スクリプト適用

出来たスクリプトをアタッチします



これを



ここに



これでアタッチが出来ました！


動かしてみよう


アニメーションはしたけど…

• その場で足踏みしかしてくれませんね

• これではせっかくVRにしても前しか見る場所がありません

• なので自分の周りを回ってもらいましょう


モデルを動かす

• ターゲットとしてカメラを使用する

• その周りを歩きのアニメーションの時に移動

• 待機のアニメーションのときは止まる

• というスクリプトの作成



先程作ったこれを…



こうします！



publicで変数を宣言するとinspectorに表示されます



回転変数の初期設定



歩きアニメーションの間一定速度で動かす



周りを回る予定なのでモデルの向きを変えます



回転させるときはここをクリック



球体が出てきてモデルを回せるようになります



今回は進行方向に向けてy軸を回転させました



y軸を回転させたいときは緑の線をドラッグ！



先程作成したpublicな変数がこちら



ここにターゲット予定のカメラを持っていくと



こんな感じになります


動かしてみましょう！



• 今回はちょっと条件等が雑なので動きに少しおかしい部分もあります

• しかし簡単なスクリプトでここまで動かせるのがUnityの強みだと思います


実機で動かす


ビルド

• ここまで作ったけどせっかくなら実機で試してみたいですよね？

• なのでAndroidやiOSでのビルド方法について説明します。


Android


Androidフロー

• プラットフォームを切り替える（時間かかります）

• プラットフォームの設定

• ビルド


• File>BuildSetting

Androidプラットフォームを切り替える


Androidプラットフォームを切り替える• 切替時にプラットフォーム用のライブラリ導入について聞かれます


Androidプラットフォームの設定• File>BuildSetting


Androidプラットフォームの設定• 画面向きの設定をランドスケープレフトにする


• APILevelを19以上に設定

• BundleIdentifierを設定

Androidプラットフォームの設定


Androidビルド（APK出力）


デバッグKEYでビルドする場合ONに


Androidビルド（APK出力）

• 注意点

• AndroidStudio2.3

• 必要なtoolsが足りないため

• コマンドラインツールのみ入手するよりtoolsを入手


iOS


iOSフロー

• プラットフォームを切り替える（時間かかります）

• プラットフォームの設定

• XCODEプロジェクトの吐き出し

• ビルド（時間かかります）


iOSプラットフォームを切り替える• File>BuildSetting


iOSプラットフォームを切り替える• 切替時にプラットフォーム用のライブラリ導入について聞かれます


iOSプラットフォームの設定• File>BuildSetting


iOSプラットフォームの設定• 画面向きの設定をランドスケープレフトにする


iOSXCODEプロジェクトの吐き出し



iOSビルド

• XCODEで開いてビルドをする

Unity + iOS/Android VR ことはじめ

Technology

Transcript of Unity + iOS/Android VR ことはじめ