Custom apps Custom app anatomy

Custom app anatomy

Custom apps include all apps that do not fall within the audio or messaging activities. Android Auto is currently working with specific partners to develop custom apps.

Structure Expand and collapse content An arrow that points down when collapsed and points up when expanded.

Android Auto apps should use a simple, flat hierarchy so drivers don’t have to remember where they are within the app. Designing a flat hierarchy means using the primary app screen to display the essential app functions, and using the drawer for navigation to secondary information.

Android Auto apps shouldn’t include all of the features from a mobile app or website. Instead, they should make the most important features prominent and easy to use. Additional functionality might be relevant in the Android Auto app that did not exist on the app or website.

In this example, the RoboCharge website and app contain a large amount of information and actions. This much content displayed at once could be distracting while driving.

In the Android Auto version, only the most important information and actions are displayed. By minimizing additional content, the app can provide the primary functionality while attempting to minimize driver distraction.

Android Auto app contains:

  • The primary information and actions from the app and website
  • Car-specific functionality, such as locating nearby charging stations

Canvas Expand and collapse content An arrow that points down when collapsed and points up when expanded.

To comply with Material Design and improve glanceability, interactive content should be raised above the background either in a card or as a Floating Action Button (FAB).

Custom app screen with actions on a card and Floating Action Button

Do.

Cards help make the screen more glanceable by grouping UI elements and by calling attention to action buttons.

Don’t.

Interactive content on the background layer can be less noticeable and should be avoided.

Actions Expand and collapse content An arrow that points down when collapsed and points up when expanded.

The menu button is an element in the status bar that opens the drawer. The menu button does not have to be enabled on all screens. Custom menu buttons should not be used.


The back button should be avoided in custom applications. Back buttons require the driver to recall the previous screen which increases cognitive load and could become distracting. In place of the menu button, provide a clearly labeled navigation button from the primary screen to the secondary screen. The secondary screen should provide a link back to the primary screen but no additional navigation links that would create a hierarchical chain of screens.

The back button does exist in the drawer, where the structure is the same across all Android Auto applications. In the drawer, the back button navigates to the top level of the drawer then returns to the primary app view.

Do.

The back button can exist in the drawer.

Don’t.

The back button should not appear on custom app screens.