Motion Design
Ogni pixel ha un motivo
Le animazioni sbagliate rallentano il sito e infastidiscono chi naviga da mobile con dati limitati o preferenze di accessibilità attive.
Micro-interazioni GPU-accelerated, parallax narrativo, transizioni fluide a 60fps — sempre con prefers-reduced-motion rispettato. Il motion guida l'attenzione, non rallenta la pagina.
Gerarchia dell'attenzione
Decidiamo cosa deve notare l'occhio per primo, il motion segue quella gerarchia, non il contrario.
Micro-interazioni
Hover, transizioni tra stati, feedback immediato: dettagli che si notano anche se non si spiegano.
Performance-first
Animazioni su transform/opacity, mai su proprietà che causano reflow: 60fps anche su hardware modesto.
Accessibilità
prefers-reduced-motion sempre rispettato: chi lo richiede vede il contenuto, non l'animazione.
- —Micro-interazioni GPU-accelerated (transform/opacity)
- —Parallax e reveal narrativi allo scroll
- —60fps verificati, non assunti
- —prefers-reduced-motion rispettato ovunque
Per chi vuole che il sito comunichi cura anche nei dettagli minori, non solo nell'hero.
Non per chi preferisce zero animazioni per principio — anche quello è legittimo, e costa meno.