Pane template

  • The Pane template is designed to display detailed information and prominent actions, limiting information and action rows to 4 each for easy scanning.

  • It's ideal for presenting non-editable metadata and enabling actions based on that data, with options for headers, buttons, rows, and a large image.

  • This template can be embedded within the Tab template or the Map + Content template for enhanced navigation and display.

  • Developers must include at least one row of information and should prioritize a primary action, especially navigation, when including actions, along with providing icons for them.

  • While optional, developers should consider using a header with title and actions, while limiting information rows and actions to a maximum of 4 and 2 respectively.

The Pane template presents detailed information and prominent actions.

For easy scanning, actions and information rows are limited to 4 each. This template is useful for presenting non-editable metadata, such as location and reservation details, and for taking action based on data. For a version of this template with a map and no image, navigation apps can use the Map + Content template.

This template can be embedded in the Tab template to provide tabbed navigation.

This template can be included in the Map + Content template to provide a pane on a map.

Includes:

  • Optional header
  • Up to 2 buttons, where one can be designated as primary (optional)
  • Up to 4 non-actionable rows (1 row is mandatory)
  • Optional large image (see example)
Wireframes of the Pane template

Pane template examples

Pane template, location details, action buttons
Location details for a parking app, with 2 related actions (Android Auto example)
Pane template embedded in Map + X template, action buttons
Location details for a cafe, with two actions. The second action button's associated text is truncated to its icon due to size constraints. (Android Auto example)

Pane template UX requirements

App developers:

MUST Include at least one row of information.
SHOULD Designate a primary action when providing 2 actions.
SHOULD Make navigation the primary action, when it's included as one of the actions.
SHOULD Provide icons for all actions.
SHOULD Include a header with an optional title and primary and secondary actions.
MAY Include up to 4 rows of information and 2 actions.