Quoted in Particles
A WebGL project driven by particles, built with Three.js and GSAP. It creates dynamic, animated visuals with smooth effects and interactive motion.
Particles, sarcasm, and visuals, packed into one fun experience
This project was born out of my curiosity about WebGL particles and how they can be a fantastic and powerful tool for creating visual web spectacles. The best part is that once built they are surprisingly lightweight. As for the sarcastic quotes, do not hold them against me. They reflect how I felt at the start of the pandemic but they do make a fun guide through the scenes. My original, first version is still available on CodePen.
This project features a WebGL-based particle system built with Three.js for 3D rendering and GSAP for smooth animations. Custom shaders handle particle behavior, transforming images and videos into interactive displays. It supports dynamic effects like texture transitions, mouse and touch interactions, and a flowing "tail" effect for interaction with particles. Performance is optimized with FPS limiting and throttled events, ensuring smooth visuals even with complex scenes.
During the rollercoaster of the Corona era, I kicked off this project as a creative escape.
In the early version, I tried animating particles purely with JavaScript, but I soon found a much better approach—using video textures as the foundation.
To keep performance smooth, the depth buffer for particles was disabled.
The images used in the project are from Freepik and the video is from Videvo.
