Animation & Micro-interactions
Motion Principles
- Fonctionnel avant décoratif
- Rapide et non-bloquant (150-300ms)
- Subtil et cohérent
- Respect prefers-reduced-motion
Key Animations
| Animation |
Durée |
Usage |
| Hover |
150ms |
Buttons, rows |
| Fade in |
200ms |
Contenu chargé |
| Slide in |
250ms |
Modals, drawers |
| Toast |
300ms in / 200ms out |
Notifications |
| Checkbox |
150ms |
Toggle état |
Performance Goals
| Metric |
Target |
| First Contentful Paint |
< 1.5s |
| Time to Interactive |
< 3s |
| Interaction Response |
< 100ms |
| Animation FPS |
60fps |
