Loading: what to show while waiting

Ask what the user is doing and what they fear, then decide what goes on screen. Visual tricks do not fix structural problems.

Task: Blank screens while the API is slow.

[Before you start, do three things]
1. Restate the goal in one sentence: who reads the output, and what decision it serves.
2. If I have not given you the following, ask me. Do not assume:
   - latency per call
   - preloading possible
   - distribution of wait times
   - page type
3. Say how you plan to do it (at most 5 steps) and wait for my go-ahead.

[Go through each of these]
- separate predictable from unpredictable waits
- skeletons instead of spinners, stable layout
- after three seconds, show progress or explanation
- which waits can be removed

[Process]
1. State the single job of this screen
2. Answer the user's current worry first
3. Order by information priority and delete
4. Design empty, loading and error states
5. Give a minimal usability test

[Output]
One job, priority, three states, test plan.

[Do not]
- Never two primary actions on one screen
- Do not test with lorem ipsum
- Never ignore the empty state
- Never use colour as the only signal