Une ouverture qui passe la main au produit
Un passage de main conduit par le défilement : l’énoncé s’écarte, quatorze mandats partent en trois vagues, et le bureau entre à taille constante.
Tout tient à une seule variable. Un composant qui ne rend rien s’abonne au défilement et au redimensionnement, bridé par une trame d’animation, et écrit un unique nombre entre zéro et un sur la section. Le CSS interpole le reste.
La discipline à l’intérieur de cette trame compte plus que l’idée : une lecture, puis deux écritures, et rien entre les deux. Une lecture qui suit une écriture force un recalcul de mise en page au milieu de la trame, et c’est ce qui transforme un défilement en saccade. Rien ne traverse React, une mise à jour d’état par trame ferait soixante rendus par seconde pour une valeur que le CSS interpole seul.
#Aucun zoom, jamais
La fenêtre mesure exactement la même largeur au premier et au dernier pixel de la course, 893 px à 1440, 1 184 à 1920, 353 à 375. Seule l’abscisse bouge. Une capture agrandie devient molle, et un produit qui grossit sous l’œil est un effet plutôt qu’une démonstration.
#Quatorze trajectoires, pas une
Chaque mandat porte son propre délai de départ, son cap et sa hauteur d’arc, tous dérivés de son rang plutôt que tirés au hasard, un tirage au rendu divergerait entre serveur et client. L’arc lui-même est un sinus : à mi-vol le hibou est au sommet de sa courbe, aux deux extrémités il est sur la ligne. C’est ce qui sépare un vol d’un glissement.
#Trois compositions ont été mesurées, puis écartées
- Un arc de quinze visages autour de l’énoncé en posait six sur le titre en 1440 par 900.
- Une bande basse en posait trois sur l’appel à l’action.
- Un énoncé centré laissait 430 px de texte posés sur la capture de l’application.
L’hôte n’est pas dans la bande. Il est la marque, et il tient le centre du bloc. Voilà la hiérarchie lisible : un visage en grand, quatorze autour.
#Sources
- Deskworth Landing, commit history of the Liquid Glass passDeskworthDocument interne, non publié
Read next