Wear OS エコシステムは、さまざまな画面サイズのデバイスで構成されています。すべてのユーザーに最高品質のエクスペリエンスを提供するには、適応型 UI の原則を活用することが重要です。
アダプティブ UI とは何ですか？
アダプティブ UI は、レンダリングされる画面のサイズに関係なく、使用可能な画面スペースを最大限に活用するように伸縮および変更されます。
適応型 UI は、レイアウト ロジックに直接組み込まれたコンポーネントとメソッドを使用して、レスポンシブに変化します。また、これらのレイアウトでは、画面サイズのブレークポイント（異なる画面サイズに異なるデザインを適用）を利用して、ユーザーにより豊かなエクスペリエンスを提供します。
主な画面サイズ
新しいエクスペリエンスを設計する際に考慮すべき主な参照サイズについて学びます。
レイアウトの種類
円形画面のアダプティブ レイアウトを設計する場合、スクロール ビューとスクロール以外のビューには、UI 要素のスケーリングと、バランスの取れたレイアウトとコンポジションの維持に関する独自の要件があります。
上、下、左右のすべての余白は、クリッピングを回避し、要素を比例してスケーリングできるように、パーセンテージで定義する必要があります。
すべての余白はパーセンテージで定義し、中央のメイン コンテンツが使用可能な領域に収まるように垂直方向の制約を定義する必要があります。
アダプティブ レイアウトとデザイン手法で価値を付加する
円形画面のアダプティブ レイアウトを設計する場合、スクロール ビューとスクロール以外のビューには、UI 要素のスケーリングとバランスの取れたレイアウトとコンポジションの維持に関してそれぞれ固有の要件があります。
以下の画像は一般的な提案であり、例はあくまで参考情報です。各コンポーネントまたはサーフェス ページを表示して、コンテキストに応じた詳細なガイダンスを確認します。
レスポンシブ レイアウトにより、より多くのチップ、カード、テキスト行、ボタンを 1 つの画面に表示できます
定義された画面サイズのブレークポイントで適用される新しいレイアウトを使用して、可能であれば新しいコンテンツを導入し、画面サイズの大きいデバイスでユーザーに付加価値を提供します。
余分な画面スペースを使用して、より大きなコンテナ、より大きなテキスト、より太いリング、より詳細なデータ可視化を実現し、ユーザーが情報をすばやく把握できるようにしました。
画面の余分なスペースを使用して、タップ ターゲットを大きくし、視覚的な階層を高め、コンテンツ アイテム間のスペースを広げることで、インターフェースの操作をより簡単に、快適にします。
更新されたコンポーネントとテンプレートを使用して、すべての画面サイズで UI のルック＆フィールを改善します。
アプリの品質
品質ガイドラインは 3 つのレベルに分かれています。3 つの階層すべてでガイドラインを満たすことで、ユーザーに最適なエクスペリエンスを提供します。
|
すべての画面サイズに対応 |
レスポンシブで最適化 |
アダプティブで差別化されたデザイン |
確立された正規レイアウトを利用する
確立された正規レイアウトを使用すると、さまざまなデバイスサイズに UI をスムーズに適応させることができます。
正規レイアウトは、すべての画面サイズで質の高いエクスペリエンスを提供するために慎重に開発されています。