アイカツ！におけるAR

おはようございます！
本記事はアイカツ！Advent Calendar 2018ではなく [AR Advent Calendar](https://adventar.org/calendars/2956) 4日目です。

みなさんAR使ってやりたいことって何ですか？
ARをやりたいモチベーションってどこから来ますか？

## モチベーション

僕は漫画やアニメが昔から大好きなので、日本が誇る空想技術をついに現実世界に具現化できる時代が来た！というモチベーションが一番強いです。
弊社meleapで開発している[HADO](https://hado-official.com/)でも、[CEO福田が子供の頃から打ちたかった「ドラゴンボール」の「かめはめ波」をAR技術を使って実現したというエピソード](https://www.google.co.jp/search?q=HADO+%E7%A6%8F%E7%94%B0+%E3%81%8B%E3%82%81%E3%81%AF%E3%82%81%E6%B3%A2&oq=HADO+%E7%A6%8F%E7%94%B0+%E3%81%8B%E3%82%81%E3%81%AF%E3%82%81%E6%B3%A2&aqs=chrome..69i57j69i64.14163j1j7&sourceid=chrome&ie=UTF-8)があり、そういう発想に大変共感して入社した覚えがあります。

## 既存メディアから連想するAR技術

さて漫画やアニメから連想されるAR技術は必殺技だけではありません。
きっとARで実現されるであろう、僕が一番興味あるものの一つにライブ演出があります。

![マクロス.jpg](https://qiita-image-store.s3.amazonaws.com/0/29871/18950a7f-a466-f473-c51a-343ac365eb8f.jpeg)
&copy;ビックウエスト、マクロスF製作委員会、毎日放送

上の画像は「劇場版マクロスF～サヨナラノツバサ」でのライブシーンで、歌い手であるランカ・リーが小さな妖精になって観客の前に飛んでくる演出です。マクロスシリーズは歌をテーマにした近未来バトルアクションなのでこういった演出が多数出てきます。

# アイカツ!をARで実装しよう

アニメに描かれているAR演出は他にも多くありそうですが、今回は[TVアニメ「アイカツ！」](http://www.tv-tokyo.co.jp/anime/aikatsu2013/index2.html)で表現されている演出を題材に実際「今」のAR技術で実装するならどうするか検討してみたいと思います。

アイカツ!はタイトルの通りアイドル活動を描くアニメなのですが、ライブ演出部分はちょっと未来を先取りしたものが採用されています。

![ライブ0.jpg](https://qiita-image-store.s3.amazonaws.com/0/29871/2d639ac1-3826-a609-bc94-6a1c81023c4f.jpeg)

&copy;SUNRISE/BANDAI,DENTSU,TV TOKYO

## カードによるデータベース連動

![アイカツカード.jpg](https://qiita-image-store.s3.amazonaws.com/0/29871/e0b18960-cd54-6a53-6e3a-a332112b121e.jpeg)
&copy;SUNRISE/BANDAI,DENTSU,TV TOKYO

![アイカツシステム.jpg](https://qiita-image-store.s3.amazonaws.com/0/29871/77cfaf06-a7a0-9600-4de2-d29821b77d86.jpeg)
&copy;SUNRISE/BANDAI,DENTSU,TV TOKYO



アイカツ！ではアイカツカードという、衣装や演出をデータ化したものをアイカツシステムに読み込ませることでAR（設定上はVRなのかも）の衣装や演出をまとう事ができます。
このカードシステム自体はQRコードを読み取る筐体ゲームとしてゲームセンター等に設置されており（というかゲームが元です）、実際に集めたカードを読み込ませてモニタ上のキャラクターの衣装を変える仕組みになっています。

![Card.jpg](https://qiita-image-store.s3.amazonaws.com/0/29871/cfb780a5-2d6c-044f-9245-9a505c84bce9.jpeg)
&copy;SUNRISE/BANDAI,DENTSU,TV TOKYO

ゲームをプレイすると手に入る新衣装をその場でQRコード付きカードとして発行できます。手に入れたQRコードは次回以降のプレイで利用できます。
もしARアトラクション・ARゲームとして実装するのであればこの仕組みはそのまま使いたいですね。

![ゲート1.jpg](https://qiita-image-store.s3.amazonaws.com/0/29871/357c238d-b3c1-7c02-2766-fea6e8f5f768.jpeg)
&copy;SUNRISE/BANDAI,DENTSU,TV TOKYO

## 現実世界と拡張世界を繋ぐ瞬間


アイカツシステムにカードを読み込ませたらゲートをくぐります。ゲートの向こうが衣装のフィッティングルームになるので、ここが現実世界と拡張世界の境界の役目を果たします。
例えばこの部屋でデバイスを装着してオペレーターによるシステム解説を挟み心理的没入感を徐々に高めるのに使えそうですね。

![ゲート２.jpg](https://qiita-image-store.s3.amazonaws.com/0/29871/7cdaddf5-49b6-06ed-1d84-e5e2c8518930.jpeg)
&copy;SUNRISE/BANDAI,DENTSU,TV TOKYO


弊社が開発した[HADO MONSTAR BATTLE〜ダンジョン・オブ・ダークネス（ハウステンボスに導入）](http://www.huistenbosch.co.jp/event/dungeon/)でもARデバイスを装着する前に完全な暗闇迷路を探検させることでラスボスとの対峙に向け没入感を高めていく演出が取られています。
現実に拡張世界を繋ぎこむ瞬間の扱いは、ARコンテンツにおいて大切にしたいポイントです。

## ライブステージ作り

![ライブ1.jpg](https://qiita-image-store.s3.amazonaws.com/0/29871/98b06c0b-3110-f209-1580-0691e387b663.jpeg)
&copy;SUNRISE/BANDAI,DENTSU,TV TOKYO

いよいよステージ作りです。
さらっとデバイスを装着と書きましたが、どんな演出をしたいかで最適なデバイスは変わるでしょう。
複雑な演出を目指すのであれば、全身にマーカーを装着するモーキャプやOptiTrackなども候補に上がってきます。
過去の事例をあげると、NHK天才テレビくん YOUではOptiTrackを採用し、武器を振りかざす演出などを実現しています。
[「天才てれびくん YOU」AR 技術を活用した特別生放送 制作の取り組み](http://www.mpte.jp/otameshi/pdf/%E5%A4%A9%E6%89%8D%E3%83%86%E3%83%AC%E3%83%93%E3%81%8F%E3%82%93YOU.pdf)



![ライブ羽根.jpg](https://qiita-image-store.s3.amazonaws.com/0/29871/ea6f7a50-5997-ddbb-95a6-64e5e9e1dec7.jpeg)
&copy;SUNRISE/BANDAI,DENTSU,TV TOKYO


今回の演出は演者の背後に羽根を出したり、周辺にエフェクトがついてくることをメインとしたいので
単純に演者のポジションが取れていれば十分とします。
また全体を妄想してるうちにロケーションベースのアトラクションとして成立できる可能性も感じたので、装着が簡単なiPhoneを採用します。
実装内容としてもARKitで十分実現できそうですね。
他にもOSの挙動が安定してる点や、熱に強い点、入手しやすい点などは今iPhoneを選ぶメリットだと感じています。

装着に関しては演者にもARを実感させながらライブするのであればHMDを採用しますが、ここは悩ましいですね。

![HADO_HMD.jpg](https://qiita-image-store.s3.amazonaws.com/0/29871/1898ea05-bfad-e7a5-c754-af6133cebe88.jpeg)
(参考までにHADOのHMD）

本当にポジションを取れればいいだけならこっそり背中や腰に装着してカメラだけ見えてても良いでしょう。
[ARKitは画像解析に加えIMUセンサーも使ってトラッキングしている](https://qiita.com/k-boy/items/1de8e9ed1260834d02af#arkit%E3%81%AF%E3%81%A9%E3%81%86%E3%82%84%E3%81%A3%E3%81%A6%E8%87%AA%E5%B7%B1%E4%BD%8D%E7%BD%AE%E6%8E%A8%E5%AE%9A%E3%81%A8%E7%92%B0%E5%A2%83%E3%83%9E%E3%83%83%E3%83%94%E3%83%B3%E3%82%B0%E3%82%92%E8%A1%8C%E3%81%AA%E3%81%A3%E3%81%A6%E3%81%84%E3%82%8B%E3%81%AE%E3%81%8B)ので、激しすぎるダンスなどは厳しいかもしれません。
iPhoneのIMU値は強い力を掛けると比較的簡単に狂います。

ライブに付き物である照明も、特徴点が変わってしまいトラッキングの精度が落ちてしまうのが予想されるので、照明そのものはARで表現したほうがよいかもしれません。
当然真っ暗なのもNGでしょう。

もし暗闇前提でポジトラをするのでれあば光るARマーカーを要所に配置してマーカーベースのトラッキングをするのが現状最善手でしょうか？？

## 観客視点

![ヘッドセンサー.jpg](https://qiita-image-store.s3.amazonaws.com/0/29871/d0bfffd9-9a98-7a99-abfc-5f064e04ec8a.jpeg)
&copy;SUNRISE/BANDAI,DENTSU,TV TOKYO

観客も受信機のようなものを頭に装着してます。
作中では脳波か何かで演出を感じているのでしょうか？もしくは網膜照射でしょうか？
さすがにこのあたりはまだまだ技術が程遠いので、現状で出来ることを考えると
観客がそれぞれ持ったスマホにアプリを入れて画面越しで見てもらうのが最善でしょうか。
スマホ片手にライブを見るのも興ざめなのでHMDに差し込んで没入感は高めたいですね。

## オクルージョン

観客視点からは人とARの重なり（オクルージョン）も気になってきます。
超簡易実装だと、人を大雑把に包むオブジェクトにグラデーションマスクをかけて擬似的なオクルージョンにするだけでも案外いけるかもしれません。
本格的なオクルージョンについてはDepthセンサーや複眼カメラなどデバイスのAR特化が待たれるものだと考えられてきました。

がしかし[Facebook（のインターン生！！）から最近素晴らしい論文が発表](https://homes.cs.washington.edu/~holynski/publications/occlusion_sa2018.pdf)されました。
彼の論文ではARのオクルージョンにこれまで研究されてきたような絶対的な深度の正確さはそこまで必要無いので別の方法（ソフトエッジ検出）を取ってるらしく、モバイル端末でもOK、ディレイは116msほどしかないそうです。
こうしたComputerVisionのみでのアルゴリズムが次々と生まれてきているのでオクルージョンの解決は案外早いかもしれないですね。

[![occ.jpg](https://qiita-image-store.s3.amazonaws.com/0/29871/0b0db701-e48c-1baa-d58a-4ec0fce8a114.jpeg)](https://www.youtube.com/watch?v=VjR11gkmm3E)


### 通信

各デバイスへのデータ送信は現状だとローカルなWi-Fi通信がベストだと考えますが、アクセスポイント1つに付き接続出来る台数は業務用で頑張りまくっても50〜100台くらいでしょうか？
ブロック毎に隣の電波を極力遮蔽した壁を設けて混線を避けてアクセスポイントを配置する等でなんとかならないでしょうか。
正直ここが一番ネックを感じています。
また通信速度もネックになってくるので、TCPによる安全確実な通信よりもUDPによるシンプル最低限なプロトコルが求められます。
最近では[Googleが開発してきたUDPベースのQUICプロトコルがHTTP/3になることが決まったり](https://www.publickey1.jp/blog/18/http-over-quichttp3ietfquichttp.html)、そのGoogleとUnityが提携したりと、来るべき時代に向けて着々と準備が進んでいる感もあるので注目したいです。

以上で「アイカツ！」のライブをARで実装する検討は完了です。
本当はプロトタイプの実装までするつもりだったのですが、Multipeer Conectivityとかどうかな？と調べてたらそれだけで終わってしまいました。
残りは冬休みの宿題にさせてください！

こうして夢を仕様検討してみるとまだまだな技術の進歩待ちな部分もありますが、とりあえず今出来る方法でやってみるのも大切だと思うのでAR開発者の皆さん一緒にがんばりましょう。

### 参考
- [「天才てれびくん YOU」AR 技術を活用した特別生放送 制作の取り組み](http://www.mpte.jp/otameshi/pdf/%E5%A4%A9%E6%89%8D%E3%83%86%E3%83%AC%E3%83%93%E3%81%8F%E3%82%93YOU.pdf)
- [ARKitはどうやって自己位置推定と環境マッピングを行なっているのか](https://qiita.com/k-boy/items/1de8e9ed1260834d02af)
- [FAST DEPTH DENSIFICATION FOR OCCLUSION-AWARE AUGMENTED REALITY](https://homes.cs.washington.edu/~holynski/publications/occlusion/index.html) - [論文](https://homes.cs.washington.edu/~holynski/publications/occlusion_sa2018.pdf)
- [「HTTP/3」がHTTP-over-QUICの新名称に。IETFのQUICワーキンググループとHTTPワーキンググループで合意](https://www.publickey1.jp/blog/18/http-over-quichttp3ietfquichttp.html)