Silhouette Shifter

Cylinder symphony

Thousands of cylinders dance together to form silhouettes that transform as you scroll. Watch shapes morph from one form to another through smooth, shader-driven transitions.
Double tap & Hold to interact

Techstack

Built with Three.js instanced rendering for performance, custom GLSL shaders handle the morphing transitions, and FBO (Frame Buffer Objects) manage the silhouette data across three different states.
Techstack
Built with Three.js instanced rendering for performance, custom GLSL shaders handle the morphing transitions, and FBO (Frame Buffer Objects) manage the silhouette data across three different states.

Credits

Inspired by the morphing silhouette work from Arqitel. Technical guidance from @akella_.
Credits
Inspired by the morphing silhouette work from Arqitel. Technical guidance from @akella_.

Contact

Design, development & web animation specialist. Ready to bring your vision to life with attention to every detail.