Concept cluster

Wait and track progress

Compare unknown waiting time, measurable completion, and a layout preview while content loads.

Which one to choose

Is duration unknown, measurable, or should the content shape be preserved?

Spinner: Spinner communicates an indeterminate wait; Progress bar shows measurable completion, while Skeleton previews the shape of content still loading.
Progress bar: Progress bar represents completion over a task and exposes a measured value when available; Spinner is a compact busy indicator, while Skeleton represents the eventual content layout.
Skeleton: Skeleton previews content shape; Spinner communicates unknown work compactly, while Progress bar reports measurable completion.

Try it

Compare all three behaviors

Shared comparison scenario: A workspace waits for content or an operation to finish and communicates only the progress it can measure honestly.

This context stays fixed. Switch concepts to observe the mission, edge case, and specimen specific to each behavior.

Spinner

Spinner communicates an indeterminate wait; Progress bar shows measurable completion, while Skeleton previews the shape of content still loading.

Your task

Start saving, verify duplicate activation is blocked, read the busy status, and wait for the final status.

Edge case to verify

After a long threshold, the interface adds explanatory text and a cancel or retry path instead of spinning forever.

Mission

Start saving, verify duplicate activation is blocked, read the busy status, and wait for the final status.

Primary state: The button exposes Saving, prevents a duplicate request, and shows a redundant animated indicator.

The document is ready to save.

Select a numbered marker on the schematic, or use the list below, to see its role. The schematic shows the concept's representative state.

Status icon

A redundant visual cue for the message type, never the only cue.

These descriptions fit every concept in the cluster, so none of them is enough to decide.