PLACEHOLDER — Motion que explica, não que enfeita

PLACEHOLDER — A pergunta antes de qualquer animação é curta: o que ela esclarece? Se a resposta é “fica bonito”, provavelmente é latência disfarçada de personalidade.

PLACEHOLDER — Continuidade acima de duração

PLACEHOLDER — O olho perdoa uma transição rápida demais; não perdoa um elemento que aparece do nada em outro canto da tela. Continuidade espacial vale mais que curva sofisticada.

01.card {02  /* nunca anime width/height: layout thrash garantido */03  transition:04    transform var(--dur) var(--ease),05    border-color var(--dur) var(--ease),06    box-shadow var(--dur) var(--ease);07}08 09.card:hover {10  transform: translateY(-4px);11  border-color: var(--border-strong);12}13 14@media (prefers-reduced-motion: reduce) {15  .card { transition: none; }16}

PLACEHOLDER — Duas durações bastam

PLACEHOLDER — Três valores, uma curva. Quanto menor o vocabulário de motion, mais o produto parece uma coisa só.