Updated: June 13, 2017

Feedback

Intro

Feedback is an indicator type that provides users with timely responses to actions and information on the state or condition of the content. Feedback components fall under one of two types of classification: system feedback and user-triggered feedback.

Examples of 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, check out indicator, processing indicator, and toast message, each of which provides information to the user in response to a specific action.

Both system and user-triggered feedback help inform users of the app’s current state, understand the results of an action, and discover the next steps in a workflow.

Usage

Do’s

  • Whether it is system or user-triggered, be sure to apply the proper feedback to a screen.
  • Ensure that toast message always appear centered on-screen.

Don’ts

  • Don’t apply a long set of text in a toast message. Always keep the text short and concise.
  • Avoid using a progress indicator to suggest that a screen is loading.

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.

Loading Indicator

The loading indicator appears at the center of the screen, and it spins to inform the user that app content is currently loading.

Inline Loading Indicator

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.

User-Triggered Feedback

Progress Indicator

The progress indicator helps the user understand the status of an item currently being loaded by the system. Tapping on the ‘stop’ icon will abandon the loading process. 

Checkout Indicator

The checkout indicator appears after the user proceeds to the final step of a checkout flow. It serves to inform the user that the order has been submitted and is now being processed.

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.