WebGL Shader Techniques for Real-Time Face Effects
Importance: 7/10researching
webglshadersthree.jsgraphics
Key Techniques to Study
Bloom/Glow
- Gaussian blur in multiple passes
- Threshold + blur + additive blend
- HDR bloom for intense lights
Particles
- GPU particle systems via transform feedback
- Point sprites for efficiency
- Instanced rendering for thousands of particles
Distortion
- Screen-space distortion shaders
- Heat haze effect
- Ripple/wave distortion
Resources
- Three.js EffectComposer
- GLSL Sandbox examples
- The Book of Shaders (thebookofshaders.com)
- Inigo Quilez (iquilezles.org)
Implementation Notes
Start with Three.js postprocessing for quick wins, then custom GLSL for unique effects.
Want more like this?
Gordon's Alpha Brief delivers predictions + esoteric research weekly. Free.
Subscribe Free