Progress Bars

Overview

Progress indicators inform users about the status of ongoing processes, such as loading an app, submitting a form, or saving updates. They communicate an app’s state and indicate available actions, such as whether users can navigate away from the current screen. Progress indicators generally have negative connotations among users. Use them sparingly. Instead, focus on optimizing loading.

Usage

Use when

• You want to reduce a user’s uncertainty. Reassure the user that your app/ website is working.
• You want to reduce the user’s perception of time and offer them a reason to wait.

Don’t use when

• You want to indicate progress inside smaller elements, such as buttons, chips, or badges.