App experience

The app experience in the portrait reference design features 2 layers.

These layers allow users to interact with apps on both layers:

For the optimal multitasking experience, it's recommended that the base layer run navigation apps, while the top layer run other types of apps using the system app templates.

Base layer

The base layer encompasses almost the entire car screen.

It can run multiple apps at a time but only 1 of those apps will be visible to the user. All the app's standard controls are available to the user.

For guidance about implementing and customizing the base layer, see Base layer best practices and Base layer customization.

Base layer

Base layer best practices

Best practices for OEMs:

  • Run separate apps on base and top layers: Don't run the same app simultaneously on both layers.
  • Run a navigation app on the base layer: Since drivers refer to navigation apps the most during their car journey, use the base layer to keep a navigation app always available. With the control bar providing media controls, drivers get an optimal media and navigation experience on the car screen.

Top layer

The top layer can run any type of app, including phone apps (such as Dialer) and media apps providing content such as music, podcasts, radio, or bluetooth audio. These apps run in system app templates. In addition, media content can be accessed from the app launcher and the control bar.

When the top-layer app is opened, the base-layer app becomes responsive to the screen space adjustment. That is, the base layer responds to the top-layer app's expansion on the screen by reducing its own screen area.

System app templates

System app templates help build a consistent user experience throughout the infotainment system. They are provided for settings, media, and phone apps. The template consists of the following:

  1. App header at the top
  2. Vertical app menu to the left within reach of the driver
  3. App body content area
  4. Persistent controls in the control bar for some apps
System app template components