feat(registry): Three.js shaders catalog — 4 new GPU effects + showcase project

[miguel-heygen]

Summary

New three-js category for the registry with 4 original GPU compositions, plus a showcase project that assembles all shader effects for the tech article video clips.

New blocks

Block	Duration	Technique	Render (SwiftShader)
vfx-cinematic-camera	16s	DamagedHelmet GLTF + 4 camera moves (dolly zoom, crane, orbit, rack focus)	108ms/frame
vfx-god-rays	8s	Screen-space radial blur post-process, occluding pillars, dust particles	107ms/frame
vfx-particle-field	10s	8k GPU particles morphing: text → sphere → torus with additive blending	167ms/frame
vfx-ray-march	8s	Pure GLSL SDF raymarching — infinite tunnel with fractal folds + octahedron pillars	117ms/frame

Techniques

Cinematic Camera — Four classic cinema moves applied to a 3D scene containing the KhronosGroup DamagedHelmet (CC-BY 4.0). Each move demonstrates a different camera technique:

• Dolly Zoom: Camera pulls back while FOV narrows — Hitchcock vertigo effect
• Crane Shot: Rise from below, arc over the subject
• Orbit: Smooth 216° orbit with vertical sinusoidal variation
• Rack Focus: Punch in tight, hold, pull out dramatically

Volumetric God Rays — Multi-pass screen-space post-processing:

1. Render scene normally
2. Render occlusion map (black occluders, white sun)
3. Radial blur from sun position through occlusion → god rays
4. Additive composite with warm tint

Particle Field — Custom vertex + fragment shaders for GPU point rendering. Particles lerp between 5 target shapes (text bitmap sampling, sphere, torus, noise) with smooth morphing transitions. Additive blending + per-particle size attenuation.

SDF Ray March — Single-pass fullscreen fragment shader. Signed distance field scene with:

• Infinite Z-repeat for tunnel effect
• smin() smooth minimum for organic geometry blending
• Morphing octahedron pillars with per-cell rotation
• Chromatic coloring from surface normal + position
• Exponential fog + vignette + Reinhard tone mapping

Showcase project

packages/studio/data/projects/threejs-shaders-catalog/ — master index.html composes all 17 effects (3 flagship VFX + 14 shader transitions from existing blocks) into a 112s renderable reel. Each composition is also individually renderable.

Test plan

• All 4 new blocks render successfully on SwiftShader (no GPU)
• Cinematic camera loads DamagedHelmet GLTF and all 4 camera moves animate
• God rays post-process composite produces visible light shafts
• Particle field morphs through all 5 target shapes
• Ray march produces visible tunnel with fractal geometry
• Existing registry blocks unmodified
• Render on GPU hardware for production-quality output

🤖 Generated with Claude Code

— Magi