- AIメガネ向け透明ディスプレイのための新しいデザインシステム Jetpack Compose Glimmer は、現実世界の上に自然に重なるインターフェースを実現する
- 従来の Material Design の不透明なサーフェスと影は、透明ディスプレイで ハレーション と 可読性の低下 を引き起こすため、暗いサーフェスと明るいコンテンツ中心の新しいアプローチが必要になる
- テキストは 視角 (visual angle) 基準で設計され、約 0.6度以上 のサイズと Google Sans Flex の光学サイズ調整によって読みやすい形状を維持する
- 色は 加算コントラスト比 (additive contrast ratio) に基づいて調整され、現実の背景の明るさ変化の中でも安定した ニュートラルパレット と高いコントラストを確保する
- 動きはユーザーの 周辺視野を尊重する滑らかな遷移 として設計され、技術が注意を求めるのではなく、現実と自然に調和する体験を提供する
Jetpack Compose Glimmerと透明ディスプレイデザインの背景
- Jetpack Compose Glimmer は Android XR（拡張現実） 環境のための新しいデザインシステムで、AIメガネ向けインターフェース の開発に使われる
- 従来の画面ベースのデザインとは異なり、現実世界そのものがキャンバスになる形
- インターフェースは必要なときだけ現れ、不要なときは消える アンビエント ディスプレイの概念を志向する
- 透明ディスプレイでは、色、タイポグラフィ、影といった基本要素が従来とは異なる形で機能する
- たとえば、黒は透明 として認識され、明るい色は空色の背景で消えてしまう
- こうした特性のため、既存のデザイン原則を根本から再定義する必要があった
腕の長さの距離にあるインターフェース
- ディスプレイはレンズ表面ではなく、約1メートル先（腕の長さ） に投影されて見える構造
- ユーザーは現実からこの焦点面へと視線を移す必要があり、これは 意識的で能動的な注意の切り替え行為 である
- この焦点移動は設計上の重要課題であり、短い瞬間でも注目する価値のあるインターフェース を作る方向につながった
光の扱い方
- 透明ディスプレイは 光を加えることしかできず、暗くすることはできない
- そのため黒は色ではなく、光のない空間（透明領域） として機能する
- 従来の Material Design の明るいサーフェスと影は、透明画面では まぶしさとバッテリー消費 を引き起こす
- 明るい領域がにじんでテキストがぼやける halation 現象 が発生する
- 解決策として 黒を「コンテナ」として再定義 し、暗いサーフェスの上に明るいコンテンツを配置
- 奥行き感のある暗い影 を使って階層と空間感を表現
- ボタン、カード、システムスライダーなどは 階層的な深さレベル で区別する
テキストの可読性と視角
- テキストは ピクセル単位ではなく視角 (visual angle) で設計される
- 0.6度以上 の大きさが最小可読基準として設定されている
- Google Sans Flex 書体の Optical Size 軸を活用して文字内部の空間や間隔を調整
a、e などの内部空間を広げ、i、j の点の間隔を広げて 素早い視線認識 を支援- コードで別途字間設定をしなくても 自動的な視覚最適化 が行われる
- 推奨事項: 太くて間隔の広い書体 を使い、細くて小さい文字は避ける
色とコントラスト
- 現実世界が背景になるため、明るさと色は継続的に変化する
- チームは 加算コントラスト比 (additive contrast ratio) を測定してコンテンツの視認性を確保した
- 高彩度の色は現実の背景の中で消えたり、薄く見えたりする
- そのため Glimmer は ニュートラルで暗いサーフェス + 明るいコンテンツ を基本構造として採用した
- 彩度を落とした (desaturated) パレットにより、環境変化に関係なく安定したコントラストを維持
- 色は主に ボタンなど注目を集める要素の強調 のために限定的に使われる
動きと注意のバランス
- ヘッドアップディスプレイ では、動きが妨げになってはならない
- コンテンツはいつでも視界に現れ得るため、滑らかで配慮のある遷移 が必要になる
- 当初の 500ms の遷移は短すぎて認識されず、約2秒の緩やかな遷移 に調整された
- ユーザーの 周辺視野 (periphery) から中心へ自然に視線を導く
- ユーザー入力（音声、ジェスチャー）には 即時フィードバック が必要
- そのため フォーカスリングとハイライト を用いて 低遅延の応答性 を確保する
現実と技術の調和
- 透明ディスプレイデザインの核心は 注意や集中といった人間的要因 にある
- Jetpack Compose Glimmer は 技術が注意を要求せず、現実を補完する体験 を目指している
- このアプローチは、AIメガネが情報を表示する道具を超えて、現実認識そのものを高める方向 へと発展している
- Google は開発者向けに AIメガネのデザインガイドライン と Figma Design Kit を提供している
まだコメントはありません。