この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。
Google I/O 2019のキーノートで、Google検索の結果に表示されたサメの3DモデルをARで表示するデモが行われました。
この記事では、そのデモで使用されているARCore 1.9の新機能「Scene Viewer」を試すための手順を記載します。
Scene Viewerとは
Scene Viewerを使用することで、ARCoreがサポートしているAndroid端末上のブラウザから、手軽にARで現実世界に3Dモデルを表示できます。
iOSのAR Quick Lookという機能と似ていますね。
Google I/O 2019の関連セッション
- Google Keynote (Google I/O'19) - YouTube
- What’s New in ARCore (Google I/O'19) - YouTube
- Next-Generation 3D Graphics on the Web (Google I/O ’19) - YouTube
デモページを表示する
<model-viewer>というWeb Componentsで表示されている3Dモデルのビューアを経由して、ARCoreのScene Viewerを起動できます。厳密には、次のようにar属性が指定されている必要があります。
<model-viewer ar alt="A 3D model of an astronaut." src="Astronaut.gltf"></model-viewer>今回は試したいだけなので、以下のWebページをARCoreのサポート端末で表示します。この記事ではPixel 3aを使用しました。
Scene Viewerを起動する
表示されたWebページの右下のARのマークをタップします。
次に、周囲のスペースに表示するをタップします。
すると、ARCoreのScene Viewerが起動します。初回起動時（と、許可した権限をあとで取り消した場合）はカメラとストレージへのアクセス許可を求められるので、すべて許可します。
3Dモデルを表示する
最初は3Dモデルが表示されません。画面の指示通りに、平らな床などにカメラを向けて回します。
少しすると、宇宙飛行士が表示されました。
操作方法
- 拡大・縮小：ピンチイン・ピンチアウト
- 回転：3Dモデルの周囲を1本指でまわす、または2つの指で回転
- 移動：ドラッグ
さいごに
今回、Scene Viewerを起動するために使用した<model-viewer>というWeb ComponentsはiOSのAR Quick Lookにも対応しています。
今後はAndroidとiOSユーザーに同じAR体験を提供することができますね。
39
