Spinner
A spinner is an animated spinning icon that lets users know content is being loaded.
When to use
- A wait whose length you cannot predict and whose shape you cannot draw.
- A small in place wait, such as inside a button that was just pressed.
- A first load where there is no layout yet to make a skeleton out of.
When not to use
- A load whose shape you know. A skeleton holds the layout and tells the reader what is coming.
- Work you can report a fraction for. A progress bar says how much is left.
- A wait long enough that someone will give up. Explain what is happening instead of spinning at them.
- More than one place at once on the same screen, which reads as several unrelated problems.
Guidance
Do
Size the spinner to its surroundings and name the work it stands for.
Don't
Do not drop an oversized spinner into a small space, and do not label it Loading. It says nothing about what is loading.
Content
What to write, and what to leave out.
- Name the work. Loading conversations, not Loading.
- Use the present participle, since the work is happening now.
- Do not promise a duration you cannot keep.