N° 01
L’encre de ce site
La plaque de notre page d’accueil n’est pas une vidéo. Ce sont les maths du marbrage : chaque goutte déplace tous les anneaux déjà sur le bain, et deux anneaux ne se croisent jamais.
Alex Colls Outumuro
Cofondateur et CTO · · 3 min de lecture
Sur la page d’accueil de ce site, il y a une plaque ronde d’encre marbrée. Elle se dessine au chargement de la page, puis elle est à vous : touchez pour faire tomber de l’encre, glissez pour la peigner. Ce n’est pas une vidéo et elle ne tourne pas en boucle. Elle suit, dans votre navigateur, les maths d’un bain de marbrage.
Une goutte déplace tout
Dans le suminagashi, la façon japonaise de marbrer, on pose un pinceau sur une eau calme et l’encre s’étale en anneau. La goutte suivante, au même endroit, repousse le premier anneau vers l’extérieur. L’eau claire déposée entre deux gouttes laisse les bandes pâles.
Les maths viennent d’un article de 2012, Mathematical Marbling, d’Aubrey Jaffer et de ses collègues. Une goutte de rayon r tombée en c déplace chaque point p de chaque anneau déjà sur le bain :
p′ = c + (p − c) · √(1 + r² / |p − c|²)Deux choses découlent de cette seule ligne, et c’est grâce à elles que la plaque a l’air juste. L’encre garde son aire, et deux anneaux ne se croisent jamais, quel que soit le nombre de gouttes qui suivent.
Deux anneaux ne se croisent jamais, quel que soit le nombre de gouttes qui suivent.
Peignes et stylets
Un stylet tiré le long d’une ligne décale chaque point dans ce sens de z·λ/(d + λ), où d est la distance du point à la ligne. L’encre juste sous le stylet fait tout le trajet, et la traction s’affaiblit avec la distance. Un peigne de vagues fait glisser chaque point d’un sinus de sa position à travers le peigne. Ce sont les gestes de la partition qui dessine la plaque au chargement, et ceux de votre pointeur quand vous glissez.
Empêcher les anneaux de tricher
Chaque anneau est un polygone fermé, dessiné du plus ancien au plus récent. Quand une goutte étire un anneau, des trous s’ouvrent entre ses points : on ajoute donc un point partout où un côté dépasse 9 unités d’un bain de 1 000, et on fusionne les points là où l’anneau est comprimé. Les anneaux qui finissent hors de la plaque, ou sous un anneau qui la couvre entièrement, sont oubliés. Sans cela, le bain ne ferait que s’alourdir à chaque goutte.
La partition puise dans un petit générateur aléatoire à graine, donc la plaque sort identique à chaque chargement. Avec les animations réduites, la plaque est travaillée hors de vue et montrée une fois, finie. Sans JavaScript, vous avez quelques anneaux immobiles.
La goutte de votre pointeur
Ailleurs sur le site, un fin anneau autour de votre pointeur compte cinq secondes, puis une goutte tombe. Cette encre suit un autre modèle. Ce n’est pas un bain mais une feuille de papier qui boit la goutte : une percolation d’invasion sur un champ de bruit, pas une simulation de fluide. L’eau court devant le long des fibres, le pigment suit moins loin, et la tache s’effiloche en cheveux, puis sèche en laissant une auréole là où l’eau s’est arrêtée.
Les estampes de ce blog
Chaque article de ce blog a son estampe, tirée du même bain. Une courte partition de gouttes et de peignes est jouée à la construction du site, les anneaux sont découpés à la taille de la feuille et écrits en SVG, et la page les livre comme de simples dessins. Celle-ci est un suminagashi : des anneaux, laissés comme les gouttes les ont faits, et un seul trait en travers.
Alex

