Une seule courbe d'easing

La plupart des sites mélangent les courbes d'animation au petit bonheur : un ease-out ici, un rebond là, une transition linéaire ailleurs. Résultat, un mouvement qui part dans tous les sens et une interface qui semble nerveuse sans qu'on sache pourquoi. Mon site n'utilise qu'une seule courbe, partout.

cubic-bezier(0.22, 0.61, 0.36, 1). C'est tout. Une contrainte que je m'impose comme un peintre choisit une palette réduite : moins d'options, plus de cohérence.

Une contrainte unique

Cette courbe démarre franc et finit en douceur, sans jamais dépasser ni revenir en arrière. Pas de rebond, pas d'élastique. Elle a une qualité cinématique : le mouvement glisse vers sa fin au lieu de s'y cogner. Une fois fixée comme variable globale, elle s'applique à chaque transition du site sans réflexion supplémentaire.

Où elle s'applique

Partout où quelque chose bouge. Les entrées d'éléments, les survols de liens et de boutons, les révélations au scroll quand un bloc apparaît. Comme tout obéit à la même loi, l'œil reconnaît le mouvement d'un écran à l'autre. L'interface acquiert une démarche, et cette démarche est constante.

Pourquoi pas de rebond

Le rebond attire l'attention sur l'animation elle-même, il rend l'interface joueuse, presque enfantine. Ça casse l'ambiance clair-obscur que je cherche : sobre, posée, un peu solennelle. Une courbe lente et sans retour laisse le contenu parler. Le mouvement accompagne, il ne se montre pas.

La signature

Limiter le mouvement à une seule courbe, c'est transformer une contrainte technique en signature. On ne saurait pas la nommer, mais on sent que tout le site avance au même rythme. C'est ça, une identité de mouvement : invisible, et pourtant partout.