Design system
Références : Kode Immersive pour la couleur unique, le titre énorme et l'objet 3D ; Loomere pour l'histoire racontée en chapitres au scroll.
Couleurs
Vermillon#FF5A36, encre dessus 6,0:1
Encre#141210, papier dessus 15,3:1
Encre 2#1E1B18, surfaces
Papier#EDE8E1, texte sur encre
Gris#9C958C, texte secondaire 6,3:1
Encre douce#3A1510, secondaire sur vermillon 5,2:1
Typographie
SillonMot-marque, Clash Display 600, clamp(96px, 24vw, 420px), interlettrage -0,045em
Une face, un seul sillon.Titre de chapitre, Clash Display 600, clamp(40px, 6vw, 88px)
Basse continueTitre de disque, Clash Display 500, 20 à 26px
La spirale court sur des centaines de mètres sans jamais se couper. Tout l'album tient dans ce trait.
Texte, Switzer 400/500, clamp(16px, 1.3vw, 19px), interligne 1,5Boutons
Pochette
Au survol, le disque sort de la pochette.
Règles
À faire
- Un seul objet focal par écran : le disque.
- Un titre, deux phrases, un bouton au plus par écran.
- Angles droits partout, seuls les disques sont ronds.
- Chaque animation guide, confirme ou raconte.
À éviter
- Une deuxième couleur d'accent.
- Des sur-titres en capitales au-dessus de chaque section.
- Les numéros de section, les tirets longs.
- Le mouvement sous prefers-reduced-motion.