Strata Resonance
Descendre dans le temps plutôt que dans la page. Une affiche stratigraphique où la typographie se comprime sous le poids de millions d’années — et où chaque strate révèle un fragment de géologie générative.
→ Faites défiler : la variable font passe de wght 700 à 300 et s’incline vers l’italique, comme écrasée par les couches géologiques. Strates, spirales et ondulations sont générées par le code.
La technique derrière le design
Cette affiche éditoriale fait du temps géologique son principe de composition. Le titre est une police variable (Cormorant Garamond, spécification OpenType 1.8) dont les axes wght (700 → 300) et ital (0 → 1) se déplacent au scroll : la typographie « s’amincit » et s’incline sous la pression des strates supérieures. Cinq strates traversent l’histoire de la Terre, chacune avec sa pièce générative : des strates procédurales en SVG (sept couches, PRNG Mulberry32 à graine fixe), une spirale de phase Lotka-Volterra (dynamique proie-prédateur), une grille d’Op Art à la Bridget Riley en douze ondulations, et un atlas des ères du Précambrien au Cénozoïque. Révélations au scroll via IntersectionObserver, « mouvement réduit » respecté. Zéro librairie, zéro CDN, fichier unique autonome. Intégration en 5 minutes.
Idéal pour
Palette — sienna, ocre & parchemin
Questions fréquentes
Qu’est-ce qu’une police variable ?
Introduite en 2016 dans la spécification OpenType 1.8, une police variable contient, dans un seul fichier, un espace de design continu. Au lieu de fichiers séparés pour chaque graisse, un axe wght interpole entre les épaisseurs et un axe ital entre le romain et l’italique. Ici, ces axes sont pilotés par le défilement.
Les visuels sont-ils vraiment générés par le code ?
Oui. Les sept strates, la spirale de Lotka-Volterra et les douze ondulations Op Art sont dessinées algorithmiquement en SVG, avec un générateur pseudo-aléatoire à graine fixe (Mulberry32) — uniques mais reproductibles. Aucune image exportée.
Quel est le rapport entre stratigraphie et typographie ?
La stratigraphie lit le temps dans l’empilement des couches de roche. Cette pièce transpose l’idée à la page : descendre dans le document, c’est descendre dans le temps profond, et la typographie se déforme comme une couche sédimentaire comprimée. La forme épouse le concept.
Est-ce intégrable, léger et personnalisable ?
Oui. C’est un fichier unique autonome (un bloc HTML, intégration en 5 minutes), sans librairie ni CDN. La palette, les polices et les paramètres génératifs se règlent en tête de fichier ; tout reste fluide sur desktop comme sur mobile.
Ce que vous recevez
Le kit complet : widget autonome (un seul fichier, intégration en 5 minutes), fragment WordPress copier-coller, art génératif injectable, charte design (tokens couleur, échelle typographique, composants, colorways) et SVG vectoriel animé. Usage commercial illimité.
Voir toute la collection → Tout l’art génératifÀ découvrir aussi : Lithograph Engine · Lacquer Manifesto · Suprema Grid · Oscillator Sublime · Accueil