​​​​​Ignite Overview Template

Route Overview.png

Design Guidelines

How to use

Overview template is designed to provide a summary of useful information, while providing customizable actions, and relevant visual content such as route previews or product details to help user's review the currently selected content.

Includes

  • Header
  • List items
    • ​​​​​1-3 lines per content "Row"
  • Button rows
    • At-least one "Primary Action" 
    • (1 button min / 3 button(s) max)
  • Supporting visuals
    • Map Information 
    • "Details Screen" Content​

​Note

While this template is primarily used for POI and navigational use cases; it can also be leveraged for use in Apps, Services, and Product "Details Screens" supporting expanded informational context and, e-commerce support.​

Design Constraints​

Header Content

Headers are used in most templates, and can be customized for branded experiences. The header typically includes informational content and / or contextual actions that correspond with the contents, list item(s), or card information. 

Smaller Displays
When used in smaller displays, information will be condensed and prioritized based on the order delivered from the third-party provider. Supporting visual may not be shown depending on screen size.

Default Actions
Services and apps from the same domain may have additional requirements for what actions and information they are required to present. For example, POI apps should always present an option to navigate as the primary action.​
​​

Developer Requirements

  • MUST provide a content title in the header
  • MAY provide an image or icon related to content
  • MUST provide a primary action
  • MAY provide up to two additional actions
  • SHOULD provide additional rows of information (1 - 2 rows min)
  • MUST provide coordinates if using the map

Template Examples

POI App with Ratings​​​

 

Parking App with number of spots using color​​​​​​​