Android XR対応の情報まとめ
はじめに
Android XRが発表されましたね！
この記事では「既存のComposeアプリをAndroid XR対応する」という観点で、色々情報をまとめていこうと思います。
まず、Android XRがどのようなものなのかは下記の8分動画を見て頂くのが良さそうです。
上記の記事もざっと見ておくのが良いです。下記の様な事が書いてあります。
- Android XR SDKのdeveloper previewをリリースした
- ほとんどのAndroidアプリは自動的にAndroid XRでも利用できるようになる
- Composeアプリの場合、XR対応のM3コンポーネントを組み込むとよりXRに適したUIを提供できる
- Hello XR Sample がある（アニメーションGIFで紹介されているXR対応のJetNews sample appはまだ公開されていなさそう？）
- Android Studio Meerkatを使えばAndroid XR EmulatorでAndroid XR向けのアプリ開発が可能
- UnityやWebでもXR対応できる
- 一部地域では対面でAndroid XR Developer Bootcampをおこなうので、興味がある人は応募してね
デザインに関してはDesign for Android XR、実際の開発に関してはDevelop with the Android XR SDKから様々なドキュメントを参照できます。
全てのドキュメントに目を通すのは大変だと思うので、ざっくりと「既存のComposeアプリをAndroid XR対応する」という観点で要点を紹介します。
Android XR対応アプリの種類
下記で言及されている通り、3種類あります。
- XR compatible mobile app
- 大画面やフォルダブル端末に最適化されていないモバイルアプリ
- XR compatible large screen app
- 大画面やフォルダブル端末に最適化されたアプリ
- XR differentiated app
- XRに最適化されており、XRデバイスでしか実現できない体験を提供するアプリ
大半のアプリは何もしなくてもXR compatible mobile appの要件を満たしていると思います。
自分のアプリがまだ大画面やフォルダブル端末に最適化されていない場合、まずは最適化をおこないXR compatible large screen appを目指しましょう。求められる品質についてはLarge screen app qualityを参考にして下さい。
まずXR compatible large screen appの要件を満たしてから、よりXRに適したユーザー体験を実現してXR differentiated appを目指しましょう。
それぞれのより詳しい説明はAndroid XR app quality guidelinesに記述があります。
XR differentiated appに求められる項目
ここにチェックリストがあります。
いくつか気になる項目をピックアップし、補足します。
Interaction targets size
- 最小サイズは48dp x 48dpですが、推奨サイズは56dp x 56dpです
- M3の最小サイズは48dp x 48dpですが、推奨サイズはそれより少し大きいですね
- 推奨サイズが少し大きいのはeye trackingが想定されているからだと思います
- もしかしたら、Android XRデバイス上でのみ、ユーザーインタラクション可能なUI部品のサイズをモバイル・タブレットデバイスより少し大きくした方が使いやすくなるかもしれません
- M3側で将来的には自動でXRデバイス上では最小サイズを大きくする可能性もあるかもしれませんね
App startup time
- コールドスタートで2秒未満、ウォームスタートで1秒未満
- Android XR搭載デバイスのスペックにもよりますが、アプリによっては起動高速化のチューニングが必要かもしれません
ANRs
- <1 ANR in 99.5% of daily sessionsが要求されています
- ANR率が上記より高めの場合、今のうちに改善に取り組む必要がありそうです
Crash Rate
- keeping a ~1% crash rateが求められます。
- これもクラッシュ率が上記より高めの場合、今のうちに改善に取り組む必要がありそうです
Android App Baseline (XR-differentiated)
- orbiters、spatial panels、virtual environment、3Dオブジェクトのどれかの導入が求められます
- orbiters、spatial panelsはXRに適したUI部品です、詳細は後述します
Transitioning between Home Space (HSM) and Full Space (FSM)
- Android XRにはHome SpaceとFull Spaceというモードがあるのですが、これの切替ができる事が求められています
- Home Spaceは複数アプリでマルチタスクできるモード、Full Spaceは一つのアプリで空間全体を占有するモードです、詳細は後述します
Spatial Player (Android only)
- Full Spaceでユーザーがコンテンツを楽しめるようにしなければなりません
- またオーバーレイでのコントローラー（再生/一時停止やシークバー）表示は禁止です
- 代わりにorbitersやpanelsの導入が必要です
- letter box表示を避けるため、ビデオ映像を映しているUI部品にはビデオと同じアスペクト比を指定する必要があります
Home SpaceとFull Space
ユーザーは2つのモードでアプリを利用できます。
- Home Space
- 色々なアプリでマルチタスク可能
- 各アプリが利用できる空間サイズには制限がある
- 既存のモバイル向けや大画面向けアプリを追加開発無しで利用できる
- spatial panelsや3Dモデルなどは使えない
- Full Space
- 1つのアプリで空間全体を占有する
- アプリが利用できる空間サイズには制限がない
- spatial panelsや3Dモデルなど、XRの機能をフルに利用した体験ができる
spatial panelsや3Dモデルなどを利用できるかどうかはユーザーのアプリ操作やシステム操作によって変化するので、下記に記述されている方法でチェックする必要があります。
そして、XR differentiated appはHome SpaceだけではなくFull Spaceをサポートする必要があります。
Android XR向けUI部品の概要 - Spatial UI
Android XR向けのUI部品としていくつかのSpatial UIがあり、これを利用する事でよりXRに適したユーザー体験を実現できます。
spatial panels
Android XRアプリのUIを構成する基礎的な部品です。
わかりやすい例を、Implement Material Design for XR から抜粋します。
下記のXR-adaptedな例はどちらも後述するorbitersと、2つのspatial panelsから構成されています。
色々なレイアウトでpanelsを配置できますが、panelsを重ねてしまってユーザーにとって重要な情報を隠さないように注意が必要です。
orbiters
orbitersは浮遊するUI部品でspatial panelsに表示している要素をコントロールします。
これにより、コンテンツにより多くの表示スペースを提供できます。
例えば、navigation railやnavigation barをorbitersとして表示します。
例えばビデオプレイヤーのシークバーなどはorbitersとして表示するのが適しているでしょう。
spatial elevation
UI部品にspatial elevationを追加することで、そのUI部品はspatial panelsに対してZ軸上で上に表示されます。これにより、ユーザーにより注意を向けて貰うことができます。
Spatial UIに対応する基本的な流れ
まずは開発環境をセットアップしましょう。
Set up your development environmentの手順通りに実施すればOKです。
エミュレーターなどの使い方はAndroid Studio tools for XRで触れられています。
アプリにJetpack Compose for XRとMaterial Design for XRを追加します。
androidx.xr.compose:compose:1.0.0-alpha01 はminSDK 30を要求する既知の問題がありますが、リリースノートにワークアラウンドが記載されています。
protobufに関するDuplicate classエラーが発生することがあります。Firebase SDKに既知の問題があり、これはFirebase SDKとprotobuf-javalite:4.27.0以上の組み合わせで発生します。androidx.xr.composeがprotobuf-javalite:4.28.2を指定しているので、GradleのResolutionStrategyを参考にprotobuf-javalite:4.26.1を強制的に使用するように設定しましょう。
次に、Full Spaceでアプリを表示出来るようにします。なぜなら、Full SpaceでないとSpatial UIの表示自体ができないからです。
Transition from Home Space to Full Spaceを参考に、Home SpaceとFull Spaceを切り替えるボタンをアプリに表示しましょう。
デフォルトで常にFull Spaceでアプリ起動する事も可能です。
Declare the default mode for launchを参考にして下さい。
そして、下記の記事を参考に実際のSpatial UI対応をおこなっていきます。
Subspaceと@SubspaceComposable
Spatial UIには@SubspaceComposableというアノテーションが付いたComposable（VolumeやSpatialPanels）がありますが、これはsubspace内にしか配置できません。subspace外に配置した場合は例外を送出します。
そのため、Add a subspace to your appを参考に基本的にはアプリUIのトップレベルにsubspaceを追加する事になります。
また、@SubspaceComposableというアノテーションが付いたComposableは通常のModifierとは異なるSubspaceModifierを使用します。
OrbiterやSpatialDialogはsubspaceの外でも配置可能です。
SpatialDialogとSpatialPopUp
既存のDialog、PopUpのSpatial版で、Full spaceではspatial elevationを追加してくれます。2D環境ではこれまでのDialog、PopUpと同様に動作します。
Navigation railとNavigation bar
NavigationSuiteScaffoldを使っていれば、自動でFull spaceではorbiterとして表示してくれます。
その他Full space向けのカスタマイズ
Check for spatial capabilities using Jetpack Compose for XRで触れられているように LocalSpatialCapabilities.current.isSpatialUiEnabledなどで条件分岐して適切なUIを表示する事で、より細かいカスタマイズが可能です。
Spatial panelsを含んだNavigationの管理
ここが現時点では悩ましところだと思います。
いずれGoogle側からベストプラクティスの提示があると思うのですが、それまでは各自で試行錯誤が必要そうです。
個人的に思っている事
我々は日常的にスマートフォンを利用していますが、10年〜20年後も同じような形のデバイスを使い続けているのかには疑問を持っています。
もしかしたら、その頃にはスマートフォンが廃れていてAndroid XRを搭載したスマートグラスを様々な人が当たり前に利用しているかもしれません。
そうなると、2次元では無く3次元により適した体験をユーザーには求められるでしょう。まだこれからどうなるかわからないAndroid XRですが、これを良いきっかけにして「3次元でベストなユーザー体験とはどのようなものか」を模索していければと思います。
Discussion