「ガァッ」と鳴く“ARアヒル”が床を跳ね回る!? 不思議なWeb版ARアプリ 遊んで仕組みを考えた：遊んで学べる「Experiments with Google」（第10回）

[佐藤信彦，ITmedia]

　「Experiments with Google」は、Googleが人工知能（AI）や拡張現実（AR）といった最新技術の可能性を示すために、実験的な応用例を紹介するショーケースだ。膨大なコンテンツを公開しており、その多くはスマートフォンやPCで試せる。

　この連載では、多種多様な応用例の中から興味深いものをピックアップ。実際に遊んだ体験レポートを通して、裏側にある技術を解説する。

　読者の皆さんも、ぜひ自分の手で試しながらその仕組みを学んでもらえたらうれしい。きっと、最新技術の魅力に気付くはずだ。

ARでアヒルたちを弾ませよう！　Webアプリ「Bouncing Band」

　連載10回目の今回は、目の前の光景にARのホットドッグやラバーダック（黄色いアヒルの玩具）を弾ませて遊べるWebアプリケーション「Bouncing Band」を取り上げる。

　Bouncing Bandは、スマートフォンのカメラで写した映像にさまざまなARオブジェクトを重ねて表示し、動かして遊べる。各オブジェクトを床に落とすと、音を鳴らして跳ね返りいつまでも跳ね続ける。

　オブジェクトの音は、ラバーダックなら「ガァッ」、レーザー光線銃なら「ビュン」というようにそれぞれ異なる。落とすタイミングを上手に調整すれば、クールなリズムトラックが作れそうだ。

　もちろん、そんな難しいことを考えずに楽しめる。映像と音や動きが面白いし、無心でオブジェクトの種類と数を増やし続けると、いろいろな音が重なって大混乱に陥るのがこれまた楽しい。肩の力を抜いて、気の向くままに楽しんでみよう。

Bouncing Bandの紹介イラストを見るだけでワクワクする

開発目的は「WebXR」のデモンストレーション

　Bouncing Bandは、英国のクリエイティブスタジオoio.studioが開発した。開発目的は、ARや仮想現実（VR）コンテンツをWebブラウザ上で操作する技術「WebXR」の活用方法を示すことだ。そのため遊ぶにはWebXRに対応したデバイスが必要で、現時点ではAndroidを搭載したスマホでしか動かせない（iOSは試験段階にある）。

床や階段を、アヒルやホットドッグが跳ね回る

　WebXR対応のデバイスなら、専用ページを開けばBouncing Bandを使える。特別なドライバやアプリのインストールは不要だ。

　画面下の「START AR！」をタップするとカメラが起動し、カメラを向けた先の様子が画面に写る。アヒルなどのARオブジェクトは平らな面にしか落とせないらしく、指示通りスマホを左右に動かしてみた。すると、すぐに床を認識したようで、オブジェクトを落とす目印の丸が現れた。さぁ「now tap to drop！」（タップして落とそう！）。

　ここから先は直感的に操作できる。好きなオブジェクトを選んで、好きなだけ落とせばいからだ。ホットドッグをはじめ、金づちやマキネッタ（じか火式のエスプレッソマシン）などを自由に落としていこう。オブジェクトの数が増えれば増えるほど、画面は混雑し、音はゴチャゴチャになってカオス状態だ。でも、それが楽しい。

スタート画面で「START AR！」を押し（左）、平らな場所を探す（右）

画面をタップすると（左）、ホットドッグやアヒルが降ってくる（右）

　かなり重い処理をしていそうだが、筆者の「Pixel 6」の場合はオブジェクトをいくら増やしても問題なくスムーズに動作した。解説には「Pixel 3」で約600個までオブジェクトを跳ねさせられるとあった。そもそも、そんな数になったら画面が埋まって何も見えないが、そこまで増やせるとは大したものだ。

アヒルやホットドッグが本当に跳ね回っているようだ。ぜひ音声をオンにして視聴してほしい

ARオブジェクトは、後ろに隠れても見えたまま

　ARオブジェクトは最初に落とした位置でいつまでも跳ね続け、階段の途中に落としたらその段でずっと跳ねている。スマホの向きを変えると、オブジェクトの位置も画面の動きに応じて変化するのでとてもリアルだ。画面を見ていると、目の前の床や階段でホットドッグやブロッコリーが本当に跳ね回っていると錯覚してしまう。

　ここで、ふと疑問が浮かんだ。跳ねている位置の見えない場所に移動したら、ARオブジェクトはどうなるのだろう。論より証拠。試してみた。

　階段の上に何匹かラバーダックを落としてから、階段の見えない位置へ移動すると、アヒルたちは相変わらず空中で跳ね回っている。本来なら見えなくなるはずだが、そうはならなかった。

　実は、Bouncing Bandは空間を3次元（3D）的に処理していない。カメラで捉えた範囲を2次元（2D）で認識し、垂直方向と水平方向の座標だけでARオブジェクトを配置する。そのため、手前にある物体の背後にオブジェクトが回り込んで隠される、という現象を再現できない。

階段で跳ねているアヒルが（左）、本来は見えないはずの位置でも跳ねている（右）

何もない空中で跳ねているアヒルたち

物体の背後への回り込みを表現できる「Lines of Play」

　物体の背後に回り込んだARオブジェクトを見えなくするには、物体までの距離データ（深度情報）が欠かせない。カメラが1つしかないスマホだと、画像だけから深度情報を得るのは困難だ。

　ところがExperiments with Googleのコンテンツ「Lines of Play」は、その難しい問題を見事に解決している。

“ARドミノ倒し”アプリは、回り込み表現もばっちり

　Lines of Playは、カメラで写した場所にドミノを並べて“ARドミノ倒し”を遊べるスマホアプリだ。

　最大の特徴は、カメラが1つのスマホでも深度情報を取得できる点だ。ドミノが物体の背後にあるときは、きちんと隠れるように表示する。

　そこで床にごみ箱を置き、それを囲むようにARドミノを置いてみた。すると、ごみ箱の後ろにあるドミノは、画面上でもきちんと見えなくなった。1枚目のドミノを押すと、ドミノは次々と倒れていく。背後にある見えないドミノも連鎖的に倒れていき、ごみ箱を囲んだ列を全て倒すことに成功した。

ごみ箱をARドミノで囲んでみた

並んだドミノがきれいに倒れた

ごみ箱の後ろはどうなっている？

　ごみ箱に隠れても問題なく動作すると分かった。では、ごみ箱の後ろはどうなっているのだろう。気になったのでカメラ越しにのぞたら、背後のドミノは存在すらしていなかった。

　カメラを動かしてごみ箱の後ろを写したら、それに合わせてドミノを描画できるはずだ。しかし処理は複雑になってしまう。Lines of Playは、正面からしか見ないという制約を設けて処理を単純化したのだろう。

ごみ箱の周囲にドミノを並べた（左）。ごみ箱の後ろをのぞてみたら……（右）

ごみ箱の後ろに回ってみると、背後のドミノは描画されていなかった

深度情報をカメラ1つで取得できる　「ARCore」の「Depth API」を活用

　Lines of Playを開発したのは、Google Creative Labだ。深度情報をカメラ1つで取得できると示すためのアプリなので、物体の後ろに回り込んだARオブジェクトを隠せば目的は十分に達成できる。つまり、物体背後のオブジェクトは最初から描画しないというLines of Playの制約は、とても理にかなっている。

　深度情報の取得は、GoogleのARアプリ開発キット「ARCore」の「Depth API」を使っている。スマホを動かして得られる、異なる角度から撮影した複数の画像を比較することで、1つのカメラで深度マップを作れるという。深度マップさえ手に入れば、ARオブジェクトを物体の前に置くことも、後ろに置いて隠すことも自由自在だ。

　残念ながら、現在Lines of Playは非公開になっていて入手できない。ただ、オープンソースとして公開されているソースコードを読めば、ARCore Depth APIをどのように使っているかを学べる。よりリアルなARコンテンツを作る際の参考になるだろう。