PER-BOARD LIGHT GRADIENT: each 6-ft board face gets a baked top-to-bottom luminance falloff + faint warm specular sheen band (shared RGBA gradient overlay parented per-leaf, NormalBlending, low alpha) so boards read as physical objects in a lit room, not evenly-lit decals. Plus modest board-material specular (roughness 0.85->0.6, envMap up) so the picture-light grazes the face. Swatch colour stays TRUE + legible (neutral mid-band, never crushed). Works for pool AND focused loadWingBook materials. FPS 72, errorCount 0, specs intact (27x27, China Seas)

433800b32f3280a7c0a513bab9fce1dccce5571b · 2026-06-27 12:40:18 -0700 · Steve

Files touched

M public/js/showroom.js

Diff

commit 433800b32f3280a7c0a513bab9fce1dccce5571b
Author: Steve <steve@designerwallcoverings.com>
Date:   Sat Jun 27 12:40:18 2026 -0700

    PER-BOARD LIGHT GRADIENT: each 6-ft board face gets a baked top-to-bottom luminance falloff + faint warm specular sheen band (shared RGBA gradient overlay parented per-leaf, NormalBlending, low alpha) so boards read as physical objects in a lit room, not evenly-lit decals. Plus modest board-material specular (roughness 0.85->0.6, envMap up) so the picture-light grazes the face. Swatch colour stays TRUE + legible (neutral mid-band, never crushed). Works for pool AND focused loadWingBook materials. FPS 72, errorCount 0, specs intact (27x27, China Seas)
---
 public/js/showroom.js | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/public/js/showroom.js b/public/js/showroom.js
index c45aa13..da75932 100644
--- a/public/js/showroom.js
+++ b/public/js/showroom.js
@@ -364,7 +364,9 @@ function initTexturePool() {
       const canvas = generatePatternCanvas(patterns[p], color.hex);
       const tex = srgb(new THREE.CanvasTexture(canvas));
       tex.wrapS = tex.wrapT = THREE.RepeatWrapping;
-      const mat = new THREE.MeshStandardMaterial({ map: tex, roughness: 0.85, metalness: 0.0, envMapIntensity: 0.4 });
+      // roughness ~0.6 + a hint of envMap so the picture-light grazes the board face as a
+      // physical surface (soft satin sheen), not an evenly-lit decal. metalness stays 0.
+      const mat = new THREE.MeshStandardMaterial({ map: tex, roughness: 0.6, metalness: 0.0, envMapIntensity: 0.55 });
       TEXTURE_POOL.push({ material: mat, pattern: patterns[p], color: color.name });
     }
   }
@@ -1221,8 +1223,9 @@ function loadWingBook(pivot, onDone) {
   const src = imageUrl.charAt(0) === '/' ? imageUrl : ('/api/proxy/image?url=' + encodeURIComponent(imageUrl));
   const maxAniso = (renderer.capabilities && renderer.capabilities.getMaxAnisotropy) ? renderer.capabilities.getMaxAnisotropy() : 1;
 
-  // Low env wash + matte paper sheen so the pattern reads crisp and true-colour, not greyed.
-  const leafMat = (tex) => new THREE.MeshStandardMaterial({ map: tex, roughness: 0.7, metalness: 0.0, envMapIntensity: 0.12 });
+  // roughness ~0.6 + a hint of envMap so the focused board catches the grazing picture-light
+  // as a physical satin surface, while staying crisp + true-colour (not greyed).
+  const leafMat = (tex) => new THREE.MeshStandardMaterial({ map: tex, roughness: 0.6, metalness: 0.0, envMapIntensity: 0.18 });
   const apply = (cached) => {
     ud.faceL.material = leafMat(cached.left);   // left half U 0..0.5
     ud.faceR.material = leafMat(cached.right);  // right half U 0.5..1 — continuous

← b44c0aa auto-save: 2026-06-27T12:39:11 (1 files) — public/js/showroo · back to Quadrille Showroom · BOARD WALL DROP-SHADOW: each board casts a faint soft shadow ce3b7f3 →