Head Shake

L’élément tremble rapidement d’avant en arrière sur un seul axe.

Ajoute un effet « Shake » (aussi appelé error shake ou invalid input shake) sur [où].
L’élément doit trembler rapidement de gauche à droite quelques fois et s’arrêter exactement à son point de départ : rapide et ferme.
Joue-le une fois à chaque erreur plutôt qu’en boucle, et associe-le à un message d’erreur visible pour que le sens ne repose pas uniquement sur le mouvement.

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 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 se déforme d’un côté à l’autre avec une amplitude décroissante, comme une gelée qui tremblote.

Ajoute un effet d’attention « Jello » (aussi appelé jelly) sur [où].
L’élément doit se déformer d’un côté à l’autre comme une gelée qui tremblote : fort au début, puis se stabilisant rapidement.
Joue-le une fois au déclenchement et conserve l’encombrement de l’élément pour que le contenu voisin ne bouge pas.

L’élément grossit et rétrécit selon un double battement, comme un cœur qui bat.

Ajoute un effet « Heartbeat » (aussi appelé heart beat) sur [où].
L’élément doit gonfler puis se relâcher en un double battement rapide, puis marquer une courte pause avant le suivant, comme un cœur qui bat.
Fais-le tourner en boucle sans coupure en gardant la pause entre les battements, et arrête-le si l’utilisateur a activé la réduction des animations (prefers-reduced-motion).

Une copie de l’élément s’agrandit et s’estompe en boucle, comme une onde de radar.

Ajoute un effet « Ping » (aussi appelé radar ping ou pulse ring) sur [où].
Une copie de l’élément doit s’agrandir vers l’extérieur et s’estomper, encore et encore à un rythme régulier, pendant que l’élément lui-même reste immobile.
Dessine l’anneau sur un calque séparé pour qu’il ne modifie jamais la mise en page, et arrête la boucle si l’utilisateur a activé la réduction des animations (prefers-reduced-motion).