Design Pattern Library 1.5

General Guidelines

Desktop/Web

Mobile (Tablet & Phone)

Visual Design Guidelines

Mobile - Annunciator Row

Problem

You need to provide an easily discovered display of the status of important hardware features such as battery level and network connections. The OS provides Annunciator Row features, but you can usually modify or suppress the Annunciator Row within applications.

Solution

Annunciators are lights, gauges or sounds that indicate system status. The same feature is often referred to as a "status bar"; however, some overlap with the concept of Notifications is implied with Annunciators.

The Annunciator Row is displayed along the top of every screen with a series of icons representing the state of the device. Always use common representations and placement of icons in order that the user will understand these key indicators across all devices.

Variations

The Annunciator Row is present on all screens. It may be suppressed along with other controls for such instances as full-screen game play or video playback. Within the OS it may be possible to have the Annunciator Row show as translucent, thereby allowing viewport content to be seen through the Annunciator Row.

Examples