Commit 167e48d
committed
feat(shop): 3D t-shirt hero with cycling decal placements
Adds a Three.js hero to /shop with a realistic 3D t-shirt model that
cycles brand logos across multiple print placements (left/right chest
patch, oversized front, back neck, left sleeve). Each placement has
a tuned camera pose the shirt smoothly animates into.
- shirt_baked.glb model (MIT, from threejs-t-shirt project)
- meshPhysicalMaterial with procedural jersey-knit fabric texture
(canvas-generated V-pattern normal map + weave color map)
- Environment preset "studio" HDRI as primary light source
- Decal fade in/out transitions between placements
- Subtle idle camera drift (XY sway + asymmetric zoom breathing)
- Slow X-axis rotation drift on the shirt
- Aspect-ratio-aware decal scaling with per-placement maxWidth
- Dark mode: near-black shirt, reduced normal/env intensity
- Light mode: white shirt, warm gray background
- Lazy-loaded via React.lazy so Three.js doesn't block SSR
- Debug editor (toggled via const) with per-placement sliders +
clipboard copy for tuning1 parent 73efa5b commit 167e48d
2 files changed
+218
-334
lines changedBinary file not shown.
0 commit comments