Manuals / Motion for Product / Chapter 8

C · Judgment · advanced · Week 3 · Chapter 8 of 9

When NOT to animate

Dense data, urgent errors, reduced-motion users, low-end devices, rapid repetitive actions — stillness can be the feature.

Path progress
89%

Step 1 of 1

Don’t-animate checklist

Write team rules. Examples: no animation on table sort for >100 rows; no page-wide parallax.

Don’t-animate checklistDrag stickies · tap for tips
Study mapDrag stickies · tap for tipsKeep it shortdrag · tap →Name the waitdrag · tap →Scope locatorsdrag · tap →Trace when stuckdrag · tap →One browser firstdrag · tap →Isolate statedrag · tap →Assert the UIdrag · tap →Retry wiselydrag · tap →Seed datadrag · tap →Close the loopdrag · tap →Keep it shortdrag · tap →Name the waitdrag · tap →Scope locatorsdrag · tap →Trace when stuckdrag · tap →One browser firstdrag · tap →Isolate statedrag · tap →Pathwise hackdrag · tap →Don’t-animate checdrag · tap →Try thisdrag · tap →Follow the dashed drag · tap →

Do this now

Publish a 8–10 line checklist. Apply it to kill one existing animation.

Was this step clear?
Chapter learning outcomes
  • Kill criteria
  • Motion budget

Clear these before you leave