アプリをカスタマイズ

アプリのタスク用のテンプレートの順序を決定したら、各テンプレートのコンテンツとアプリのスタイル設定の一部をカスタマイズできます。

ビジュアル デザイン全体のどの側面をカスタマイズできるかについては、ビジュアル デザインのカスタマイズをご覧ください。アプリのカスタマイズの例も掲載されています。アプリの AAOS バージョンの場合、自動車 OEM のカスタマイズの例に示すように、自動車 OEM は車両に合わせてスタイル設定を調整できます。

特定のテンプレートのカスタマイズ オプションについては、テンプレートをご覧ください。

ビジュアル デザインのカスタマイズ

テンプレートのレイアウトとデフォルトのスタイルはアプリ ライブラリによって決定されますが、アプリ デザイナーと車両 OEM の両方がビジュアル デザインのカスタム要素に貢献します。

UI の側面 ライブラリが決定する内容 アプリが特定またはカスタマイズする対象 車両 OEM がカスタマイズできる対象
画像とアイコン画像 標準要素のアイコン画像(戻るボタンや読み込みスピナーなど) 左記のものを除き、アプリはすべての画像とアイコン画像を提供する(マテリアル アイコンGoogle Play アイコンの仕様を参照)
レイアウト、サイズ、シェイプ デフォルトのレイアウト、すべての要素のサイズと形状(デフォルトは Android Auto バージョンのアプリで標準)
  • 画像とアイコンのサイズが「大」か「小」か
  • ビューを切り替える目的で、特定のテンプレートの上部にタブを表示するかどうか
  • 2 番目の地図がクラスタに表示されるかどうか(ナビゲーション テンプレートのみ)
AAOS バージョンのアプリでのテンプレート要素のサイズ、形状、ボタンの位置、比率の調整(たとえば、車両の「大」および「小」の画像とアイコンの正確なサイズ調整)
タイポグラフィとテキストの長さ Android Auto バージョンのアプリのフォント ファミリーとフォントサイズ(タイポグラフィを参照) 自動車の画面ごとに異なるスペースの量に対応するため、場合によっては、テキスト文字列のバリエーションを長く、短くする。 アプリの AAOS バージョンのフォント ファミリーとサイズ
Android Auto バージョンのアプリのデフォルトの色(アプリによって提供される色(右記を参照)を除く) 場所リスト マーカーの色、一部のテキスト要素、背景色(詳しくは、次のセクションの色のカスタマイズをご覧ください)。 AAOS バージョンのアプリで車両 UI と融合できるように、デフォルト色とアプリ提供色を必要に応じて調整しました。

色のカスタマイズ

次のリストに示すように、アプリでは特定のテンプレートの要素に色を設定できます。アプリの AAOS バージョンについては、自動車 OEM が調整できます。

アプリは以下をカスタマイズできます。

カスタマイズされたテンプレート コンポーネントの例については、アプリのカスタマイズの例車両 OEM のカスタマイズの例をご覧ください。

アプリの色を選ぶ

ほとんどのカスタム スタイル(前のセクションで説明した例外を除く)では、以下のカラー オプションがあります。

  • カスタムのアクセント カラーを 2 つまで指定できます(ライトモードとダークモードのバリエーションがあり、Android Auto または自動車 OEM が AAOS バージョンのアプリ向けに適宜適用します)
  • 自動車向け Android の標準カラー 4 種類から選択する(右に示す現在のバージョン。今後変更される可能性があります)
標準色 アクセント カラーの例
サポートされている 4 つの標準色を含む図 選択した 2 つのサンプルアクセント カラーを含む図

色をうまく使うと、デザインの意図が伝わりやすくなります。関数を提供しない場合は色の使用に注意してください。

アプリのカスタマイズの例

アプリ デベロッパーがアプリをカスタマイズする方法に関する 4 つの例

自動車 OEM のカスタマイズの例

以下の例は、自動車 OEM が AAOS バージョンのアプリに適用する可能性のある追加のスタイルのカスタマイズを示しています。ルーティング カードの色はアプリによって決まりますが、自動車 OEM はルーティング カード、ボタン、ETA カードのフォント、テーマ、シェイプをカスタマイズします。また、下記のボタンをカスタマイズするに示すように、ボタンの幅を調整することもできます。

ナビゲーション ビュー(日中)

日中のナビゲーションの OEM カスタマイズの例

夜間のナビビュー

夜間のナビゲーションの OEM カスタマイズの例

ボタンの幅、色、形をカスタマイズする

以下の例では、OEM が AAOS バージョンのアプリでボタンの幅、色、形をカスタマイズする方法を紹介します。

アプリがプライマリ ボタンとして指定されたボタンについて、OEM はアプリのアクセント カラーを使用するか、独自のアクセント カラーを使用するかを決定できます。また、右ハンドルの車両などに対応するために、プライマリ ボタンを左側と右側に配置することもできます。

左側のメインボタン(標準色) 右側のメインボタン(カスタムカラー)
画面の左側に確認ボタンを配置し、標準色を使用した OEM カスタマイズの例 画面の右側に確認ボタンがあり、カスタムカラーを使用した OEM カスタマイズの例