Decision Cards

Make interface decisions you can defend in any design review.

27 more cards are on the way. Get each one in your inbox as it unlocks.

Or install the deck for your AI tools

Design Decisions · Q1 2027

Learn to make these calls on your own.

These cards are the first of many. The course teaches the reasoning behind each one, with practice rounds and teardowns of real products.

Get new cards as they’re released, and early-bird pricing at launch.

Coming next

State & feedback

Skeleton or Spinner

Do you know what’s coming, and how long is the wait?

Use Skeleton when

You know the layout that’s coming and the wait runs a few seconds. Holding the structure steady lets content land where the eye already is.

Signs it fits

  • Predictable layout: lists, cards, profiles
  • First load of a page or view
  • Roughly one to ten seconds
  • A layout jump would be jarring

Use Spinner when

The wait is short or the result has no predictable shape, like a submit or a search. Delay it by a few hundred milliseconds so fast responses never flash.

Signs it fits

  • Unknown result layout
  • An action in progress, not a page loading
  • Roughly one to three seconds
  • Small spaces, like inside a button

The numbers

Under 1 s: show nothing, and delay any indicator by about 300 ms so fast responses never flash. 1–10 s: skeleton if the layout is known, spinner if not. Over 10 s: real progress, and let people keep working.

Say this in review

This view loads in two to four seconds and we know its layout, so a skeleton keeps the page steady and makes the wait feel shorter than a spinner would.

When it flips

The exception

If the data usually arrives in under half a second, a skeleton becomes a flicker. Delay it, or show nothing at all.

See it work

Make the call

Card 2 of 15

Pressing ‘Pay’ takes about two seconds and returns a confirmation screen with a different layout each time. Skeleton or spinner?

State & feedback
The rule

Match the loading treatment to the wait: nothing under a beat, structure for seconds, progress for longer.

From the lesson “Loading & perceived performance”

ClickTap the card to turn it over

Install the deck

Bring every card into your AI tools, so they review screens and flows the way the cards do.

Agents can also read llms.txt, or any card as markdown by adding .md to its link.