Progress Indicators
Intro
Progress indicators display an undefined wait time or illustrate the length of a certain process to a user.
Usage
Progress indicators help users estimate the status of ongoing processes, like waiting for an app to load, submitting a form, or saving updates.
Variations
Linear Indicator
Linear progress indicators support both determinate and indeterminate operations.
A. Indeterminate indicators should be used when a process completion cannot be determined.
B. Determinate indicators display how long a process will take. They should be used when a process completion can be determined.

Indeterminate (A) and determinate (B) linear progress indicators
A. Indicator
B. Track

Anatomy of linear progress indicators
Circular Indicator
Circular indicators can be used within a component to communicate that a process is loading. This is most commonly used as a progress indicator to let the user know the current screen is being refreshed.
A. Indeterminate (use when process completion cannot be determined)
B. Determinate (use when process completion can be determined)

Indeterminate (A) and determinate (B) circular indicators
Circular IndicatorĀ Loading
Circular progress indicators are positioned in the center of the screen. It represents the initial loading of the screen’s content.

Determinate circular progress indicator
Specifications
Determinate Linear Progress Indicator

Width and height of linear indicators
Indeterminate & Determinate Circular Indicator

Width and height of circular indicators
Resources
Development: Fiori Indicator
Material Design: Progress Indicator