Weave rendered in relief. Vertex displacement maps data onto a woven surface — sculpted by oblique lighting that reveals every thread.
// Data Rug 3D — vertex displacement + lumière sculpturale const geo = new THREE.PlaneGeometry(8, 5, 128, 80); const positions = geo.attributes.position; function displace(time) { for (let i = 0; i < positions.count; i++) { const x = positions.getX(i); const y = positions.getY(i); // Value noise 2D seedé + animation temporelle const n = noise(x * freq + time, y * freq, seed); positions.setZ(i, n * amplitude); } positions.needsUpdate = true; geo.computeVertexNormals(); } // Lumière rasante (Es Devlin) const keyLight = new THREE.DirectionalLight(0xffffff, 1.5); keyLight.position.set(4, 1.5, 2); // angle bas → relief dramatique
How does the oblique light angle change what data patterns are visible? Try mapping different data sets — which one creates the most visually striking relief?
Data as material — sculpt meaning with code
Book a session