Updated: February 22, 2022

Feedback

Intro

Feedback provides users with timely responses to actions and information on the state or condition of the content. There are primarily two types of classification: system feedback and user-triggered feedback.

System feedback include the network activity indicator and the loading indicator, and as the name suggests, these are both system-generated. User-triggered feedback includes the progress indicator, processing indicator, and toast message, each of which provides information to the user in response to a specific action.

System Feedback

Network Activity Indicator

The network activity indicator is located in the status bar, and it rotates while information is being accessed by the system. When the network activity indicator is active, on-screen interactions remain available to the user.

Network activity indicator example only works for iOS 12 and under otherwise deprecated
Network activity indicator example only works for iOS 12 and under otherwise deprecated

Loading Indicator

The loading indicator appears at the center of the screen, and it is used to inform the user that app content is currently loading. Where possible, use an appropriate loading label to inform the user on what is loading.

When the user scrolls through a list, the inline loading indicator may appear below the current content to show that additional list content is being loaded.

Examples of loading indicator used in full screen and lazy loading
Examples of loading indicator used in full screen and lazy loading

User-Triggered Feedback

Processing Indicator

The processing indicator communicates that data is being processed by the system. Processing indicator should be used when the system is analyzing, sending or syncing information based on an action the user has taken. It can be displayed with an optional label.

Example of processing indicator flow
Example of processing indicator flow

Progress Indicator

The progress indicator helps the user understand the status of an action. It provides different visuals for the different states. In this example, user initiates downloading a document. Tapping on the ‘stop’ icon will abandon the loading process. 

Example of progress indicator behavior and interaction
Example of progress indicator behavior and interaction

Toast Message

The toast message is an indicator that appears briefly in the center of the screen in response to a user action. This type of feedback is intended to show that the user’s action has been processed and completed.

Example of toast message
Example of toast message