HoloLensでUnityちゃんを出してみよう！

 N高の生徒ではないですが書かさせていただきます。

N高といえば、[HoloLensを使った入学式](https://nnn.ed.jp/blog/archives/214.html)とか、[HoloLensの特別授業](https://nnn.ed.jp/blog/archives/1205.html)とかやってるので、やっぱりHoloLensが好きなのかなぁと感じました。

ということで、今回は簡単ですがHoloLensで空間認識を使い実世界上にUnityちゃんを表示するアプリの作り方を説明します。
~~もしかしたら、HoloLensの特別授業で同じようなことやったんじゃないかなと思ったが気にしない。~~

ちなみにこんな感じです
壁や天井の白い線は、実世界の壁などをHoloLensが認識して描画しているものです。
![20171211_025045_HoloLens.jpg](https://qiita-image-store.s3.amazonaws.com/0/150295/e88b8cbc-f8e2-e93d-2ff5-256d6cffe06d.jpeg "20171211_025045_HoloLens.jpg")

微妙に浮いてるように見えますが、床を認識してその上にUnityちゃんが立っています。

![20171211_025101_HoloLens.jpg](https://qiita-image-store.s3.amazonaws.com/0/150295/ec1a3ef1-9570-cd72-d6b9-375c4f6e8949.jpeg "20171211_025101_HoloLens.jpg")



##環境

 * OS:Windows10 Pro
 * Unity 2017.1.2f1
 * Visual Studio 2017 ver15.3.5
 * MixedRealityToolkit-Unity for Unity 2017.1.2f1
 
 細かい開発環境の構築などは
[こちら](https://qiita.com/raku-lab/items/e292ecd6ccb47006f30d)や[こちら](https://qiita.com/atsuo1203/items/6732110f6120ecbc2a76)の記事を参考にしてください。




##MixedRealityToolkit-Unity for Unityとは？


**簡単にいうと、HoloLensの機能（空間認識など）を使ったアプリケーションの開発をしやすくするためのツールです。**
今は、Windows MRの開発でも使われるため、MixedRealityToolkitという名前になりましたが、前まではHoloToolkitという名前でした。

https://github.com/Microsoft/MixedRealityToolkit-Unity

↑こちらから、Unityパッケージでダウンロードできます。
**ちゃんとUnityのバージョンにあったもの**を選ばないと、後で色々大変なことになります。（Unityのバージョンが2017.1.2なら、2017.1.2用のパッケージをダウンロードしましょう。Unityのバージョンが新すぎたら、対応していない可能性もあるので注意）

##HoloLensアプリの開発の流れ
![HoloLensはつらいよ_-_Google_スライド.png](https://qiita-image-store.s3.amazonaws.com/0/150295/cd0b9a8a-fc8d-d432-d0cb-6e13fad1db62.png "HoloLensはつらいよ_-_Google_スライド.png")

図に示すとこんな感じです。
基本的にUnityで開発し、UWP(ユニバーサル Windows プラットフォーム[こちらを参照](https://docs.microsoft.com/ja-jp/windows/uwp/get-started/whats-a-uwp))の形式にビルドして、VisualStudio上で、もう一度ビルドして、実機のHoloLensやHoloLensのエミュレーター上で動かすことができます。

空間認識などの機能を使うのであれば、UnityにMixedRealityToolkitをインポートしないといけないですが、それらの機能を使わないのであれば、インポートしなくても大丈夫です。


ちなみに、UnityやVSのバージョンの組み合わせが悪いと、UnityではビルドできるけどVSではビルドできなくなったりします。

環境などの説明はこれくらいにして早速、HoloLensでUnityちゃんをだしてみましょう！

##とりあえず、UnityちゃんAssetのインストール
まずは、Unityで新しいプロジェクトを作成し、Assetストアを開き、「Unity-chan」で検索してください。
![Unity_2017_2_0f3_Personal__64bit__-_battledome_game_unity_-_battel_dome114514_-_PC__Mac___Linux_Standalone__Personal___Metal_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/9cb429b8-f006-746c-6a67-f281f5bc666c.png "Unity_2017_2_0f3_Personal__64bit__-_battledome_game_unity_-_battel_dome114514_-_PC__Mac___Linux_Standalone__Personal___Metal_.png")

1番上に出てきた、Unityちゃんのアセットを
![2017-12-11__1_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/d23277bd-cf34-d015-62a7-2c3e4b6d8633.png "2017-12-11__1_.png")

ダウンロードしてインポートします。
![2017-12-11__2_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/500f1ae5-5245-f7d5-dbde-2a8e602d6917.png "2017-12-11__2_.png")
全部にチェックがついてるか確認して、Importを押してください。

そうすると、Assetsの中にUnityChanというフォルダができていると思います。これで成功です。
![2017-12-11__4_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/7615d78e-2c46-765d-436c-f2bd6e6644fa.png "2017-12-11__4_.png")



##MixedRealityToolkitを入れよう

次に、MixedRealityToolkitをインポートします。

https://github.com/Microsoft/MixedRealityToolkit-Unity/releases
↑こちらから、Unityのバージョンに対応したパッケージをダウンロードしてください。

そして、Unity上で、[Assets]->[Import Package]->[Custom packege...]を選択 
![2017-12-11__5_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/4fa93c00-b36d-3a96-6b9b-5d61e621b182.png "2017-12-11__5_.png")

そして、先ほどダウンロードしたパッケージを選択してください。
![DESKTOP-QDI87A2_-_Chrome_リモート_デスクトップ.png](https://qiita-image-store.s3.amazonaws.com/0/150295/aeecc05d-bcfc-f641-1f3e-5587c06d12b9.png "DESKTOP-QDI87A2_-_Chrome_リモート_デスクトップ.png")

Assets以下にHoloToolkitというフォルダができていたら成功です。
![DESKTOP-QDI87A2_-_Chrome_リモート_デスクトップ.png](https://qiita-image-store.s3.amazonaws.com/0/150295/e343ead8-5fe4-a9e2-46cc-dad16a4e2960.png "DESKTOP-QDI87A2_-_Chrome_リモート_デスクトップ.png")


##空間認識を実装しよう

ということで、空間認識機能を実装します。
HoloLensはデプスセンサーや環境認識カメラによる空間認識機能を持っています。

![20171126_192433_HoloLens_mp4.png](https://qiita-image-store.s3.amazonaws.com/0/150295/168a8f3b-1713-fcc2-2a8e-289f2f9e89e6.png "20171126_192433_HoloLens_mp4.png")

最初にも軽く説明しましたが上記の画像の白い線はスキャンした空間をメッシュ化したもので、今回は空間が認識されているということをわかりやすくするため表示しています。

これらの空間認識機能の実装はとても簡単で
[Assets]->[HoloToolkit]->[SpatialMapping]->[Prefabs]の中にある、「SpatialMapping」のprefabファイルをHierarchyに入れるだけです。
![2017-12-11__6_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/5c9de9ca-75fa-d9e6-685f-cd6b2ae98c53.png "2017-12-11__6_.png")

**とっても簡単！**


後は、Main CameraのPositionが[0,0,0]でないと、マッピングにズレが生じることがあるので、Main Cameraを動かしている場合はPositionを[0,0,0]にしましょう。
さらに、HoloLensじょうでは、黒色が透明になるので、Main Cameraの[Clear Flags]を「Solid Color」に変更して、色を黒に変えましょう。
![2017-12-11__4___1_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/62d71206-e3f2-66e6-518f-6848ebc2d90d.png "2017-12-11__4___1_.png")


##Unityちゃんを表示させよう
それでは、空間認識を実装したので、Unityちゃんを表示させます。
普通はUnityちゃんを地面に立たせるには、Colliderなどをつけないといけないのですが、今回は、デフォルトで設定されているUnityちゃんのPrefabを使います。
[Assets]->[UnityChan]->[Prefabs]->[for Locomotion]内にある、unitychanをHierarchyにドラッグ&ドロップします。
![2017-12-11__8_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/436f998b-5be4-36d7-9f4e-fc1f58715c87.png "2017-12-11__8_.png")

そして、Positionを[0,0,3]、Rotationを[0,180,0]に変更します。
![2017-12-11__8_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/02c0869c-11fa-1c03-ac82-7558184c4ed4.png "2017-12-11__8_.png")

##Unityちゃんを落とそう
SpatialMappingでの空間認識は、アプリケーションが起動してから空間を認識してメッシュを生成するまでに数秒ほどかかります。
ですので、今のままだとUnityちゃんは出現したら認識された地面に立つことはなく、永遠に落ち続けてしまいます。
対策は色々ありますが、今回は一番簡単な方法を使います。それは...
**Unityちゃんを500m上空から落とすのです！**
ということで、UnityちゃんのPositionのY軸を500にします。

ちなみに、デフォルトでUnityちゃんにはRigidbodyも付いているので、この状態でUnity上から実行するとUnityちゃんは落ち続けます。

![2017-12-11__9_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/5cfbb452-02da-91f0-041e-61b96850be16.png "2017-12-11__9_.png")

ということで、ひとまずUnityちゃんを表示するアプリは完成です。

適当な名前をつけて、Sceneを保存しましょう。

##Unityでビルドしよう
アプリができたので、次はUnity上からUWPの形式にビルドします。
[File]->[Build Settings...]を開きます。
![2017-12-11__10_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/19ad03ed-2614-d319-f12c-ddaa8ab22c9f.png "2017-12-11__10_.png")

そして、Platformは「Universal Windows Platform」へSwitch Platformを押して変更します。

さらに、
[Target device]をHoloLens
[Build Type]をD3D
[Build and Run]をLocal Machine
[Unity C# Projects]にチェックをつけます
![2017-12-11__12_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/43fe9c60-6255-dd87-0ea1-bfcbe8c48983.png "2017-12-11__12_.png")

そして、下の[Player Setting...] を押してください。


[Other Settings]から、[Virtual Reality Supported]にチェックをつけて、Windows Holographicが追加されているか確認してください。
![2017-12-12__7_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/815cbe75-3a5e-c58e-4e7a-0b5f690ff9d3.png "2017-12-12__7_.png")

そして、さらに下の、[Publishing Settings]の[Capabilities]から[SpatialPerception]にチェックをつけてください。
これはSpatialMappingを使用するために必要です。

![2017-12-12__10_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/09d51f99-87d8-3e62-7fcd-83eaec1eee9e.png "2017-12-12__10_.png")

そして、ビルドしましょう！
ビルドボタンを押して
![2017-12-11__12_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/08641c9e-4e1a-ea11-c8bf-6c46c36d523d.png "2017-12-11__12_.png")

「App」というフォルダを作成し、「App」を選択しましょう。
![2017-12-12__11_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/a931d077-2d70-83c3-1264-4805c9b5723b.png "2017-12-12__11_.png")

ビルドが成功すれば、「App」フォルダに[プロジェクト名].slnというファイルが生成されるので、それをVisual Studioで開いてください。
![2017-12-12__13_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/30adcf35-c1c9-82dc-4723-330096862926.png "2017-12-12__13_.png")



##VSでビルドしよう
PCとHoloLensを接続しましょう。
そして、Visual Studio上ではソリューション構成を[Release],ソリューションプラットフォームを[x86],Deviceを[Device]に変更し、[Device]をクリックして、実機でビルドします。

![2017-12-11__14_.png](https://qiita-image-store.s3.amazonaws.com/0/150295/039f10b2-8f68-20b2-3f5f-867c0a7d9c9a.png "2017-12-11__14_.png")


##完成
こんな感じで、プロジェクト名のアプリケーションがHoloLensに追加されていたら完成です。
![20171212_015332_HoloLens.jpg](https://qiita-image-store.s3.amazonaws.com/0/150295/97483bf8-d163-9f31-0bda-3ff9a507b1dc.jpeg "20171212_015332_HoloLens.jpg")

後は、アプリケーションを起動して、しばらくすると、Unityちゃんが出てくると思います。

たまに、メッシュが生成されていないところにUnityちゃんが落ちてきて、出現しなくなりますが、その時は再起動してください笑

##最後に
そういや、書いてて気がつきましたが、1行もコードを書いてませんね。

今回は、Unityちゃんを出現させるだけでしたが、音声コマンドの機能を入れたり、立体音響の機能を入れると、コードも書いていくことになるので、気が向いたら調べてみてください。