Condensed items

hero

Overview

Condensed items are compact visual components that allow for more content to be visible on the screen. Due to their size, the components only display the most critical information for an item and allow drivers to browse quickly without feeling overwhelmed.


Composition

The condensed item is designed for high glanceability and includes 4 primary components. You must include at least 1 element:

  • Leading image or icon (optional)
  • Texts: title and subtexts should be restricted to 1 line.
  • Trailing image or icon (optional)
hero

1. Leading image or icon

2. Text

3. Trailing image or icon


UX requirements

To ensure a safe and consistent experience across all apps, follow these design requirements:

Requirement level

Content

SHOULD

Keep metadata brief and avoid stacking text to ensure safe readability at a glance.

SHOULD

Use condensed items to display recommended categories such as recently played media or featured playlists.

SHOULD

Avoid using images for both the leading and trailing elements.