Skip to main content

Search rules

Search all UI Guides rules by name, category, or source

aestheticsSkills

Extra Animation Is an AI Tell

SHOULD

SHOULD: Use IntersectionObserver for scroll-triggered reveals. Stagger animations with animation-delay (100-150ms intervals). Keep animations subtle (translate 10-20px, fade 0 to 1). Use motion-safe: to respect reduced motion preferences. Transform passive browsing into active discovery.

Reveal-on-scroll everything and the page reads as generated — animate only where motion carries meaning

Bad

Good

Why it matters

This principle used to say the opposite — that scroll-triggering should "surprise and delight." Upstream now names delight-maximalism as the tell: when every section fades up, every card lifts on hover, every number counts itself in, the motion stops meaning anything and starts reading as a generator's default. Reserve the reveal for content that genuinely benefits from being staged, and let the rest of the page simply be there when the reader arrives. A page that animates one thing is read as confident; a page that animates everything is read as machine-made.

Built by Gleb Stroganov, design engineer at Evil Martians.

The rules come from other people's skills and guidelines — Vercel, Rauno Freiberg, @Ibelick, impeccable, Emil Kowalski, Tailwind, RAMS — each one credited on the Sources page. The work here is extraction and wiring: every rule is pulled into one corpus, given a good and a bad example you can operate, a MUST/SHOULD/NEVER rule an agent can paste, and a link back to where it came from.