Unwoven: An Infinite Loom of Threads
As a branding content curator, I rarely recommend demos so wholeheartedly. Clément Grellier’s Unwoven unravels photos into an endless woven strip that feels alive. Each card is split into 26 ribbons, each ribbon moves at its own random pace. The result is tactile motion, elegant frays, and whitening that reads like paper becoming light. Technically, it is instructive and compact, using a single HTML file, two shaders, Three.js, and GSAP. You get practical lessons about why separate thread geometry matters, and how to avoid rubbery meshes. Read on for shader snippets and playful levers to tweak the look and feel.
This piece balances craft and code, offering immediate creative payoff for designers. It explains the tear metric, per-thread randomness, edge fading, and whitening with clear rationale. The writeup shows how small knobs like 60.0 plus rnd times 420.0 change the material from comb to hair. You can copy patterns, tune thread counts, and reshape transitions that feel handcrafted. For anyone curating brand motion, or shipping delightful micro interactions, this is a must read. Dive into the demo, inspect the one file build, and borrow ideas to elevate interfaces now.
Source: tympanus.net