Shake

L’élément oscille de gauche à droite avec une légère rotation, comme une tête qui fait non.

Ajoute un effet d’attention « Head Shake » (aussi appelé headshake ou no shake) sur [où].
L’élément doit pivoter rapidement de gauche à droite avec une légère torsion, comme une tête qui fait non, chaque mouvement plus petit que le précédent jusqu’à s’immobiliser.
Joue-le une fois à chaque déclenchement, par exemple lors d’une action refusée, et empêche la mise en page autour de bouger.

L’élément tremble très vite par de petites secousses dans plusieurs directions, comme un téléphone qui vibre.

Ajoute un effet d’attention « Vibrate » (aussi appelé buzz ou vibration) sur [où].
L’élément doit trembler par de minuscules secousses rapides dans différentes directions pendant un bref instant, comme un téléphone qui vibre, puis s’immobiliser.
Garde un mouvement très faible pour que le contenu reste lisible, et joue-le une fois par alerte plutôt qu’en boucle.

L’élément oscille de gauche à droite en s’inclinant, comme un objet instable.

Ajoute un effet d’attention « Wobble » sur [où].
L’élément doit osciller de gauche à droite en s’inclinant, avec un grand balancement au départ qui diminue à chaque aller-retour jusqu’à s’immobiliser.
Joue-le une fois au déclenchement et empêche le contenu voisin de se décaler.

L’élément s’étire en largeur et s’écrase en hauteur par à-coups élastiques avant de reprendre sa forme normale.

Ajoute un effet d’attention « Rubber Band » (aussi appelé rubberband) sur [où].
L’élément doit s’étirer en largeur et s’écraser en hauteur, puis revenir par quelques petits rebonds élastiques avant de se stabiliser à sa taille normale.
Joue-le une fois au déclenchement et empêche la mise en page autour de se décaler pendant qu’il s’étire.

L’élément tourne en continu à vitesse constante.

Ajoute un effet « Spin » (aussi appelé spinner ou rotate loop) sur [où].
L’élément doit tourner en continu à une vitesse constante et régulière, sans easing entre les tours.
Rends la boucle continue, donne au spinner un libellé de chargement accessible, et ralentis-le ou arrête-le si l’utilisateur a activé la réduction des animations (prefers-reduced-motion).

L’élément se balance d’un côté à l’autre depuis son bord supérieur, comme un pendule dont l’amplitude décroît.

Ajoute un effet d’attention « Swing » sur [où].
L’élément doit se balancer d’un côté à l’autre comme une enseigne suspendue, avec un grand mouvement au départ qui s’amortit vite.
Fais-le pivoter depuis son bord supérieur plutôt que depuis son centre, et joue-le une fois au déclenchement.

L’élément grossit, se trémousse en pivotant puis reprend sa taille, comme pour célébrer.

Ajoute un effet d’attention « Tada » sur [où].
L’élément doit rapetisser légèrement, puis grandir et se trémousser de gauche à droite avec une inclinaison rapide avant de reprendre sa taille normale, comme une petite célébration.
Joue-le une fois, par exemple juste après une réussite, et supprime-le si l’utilisateur a activé la réduction des animations (prefers-reduced-motion).