3D INTERACTIVE EFFECT & PARTICLE SYSTEM
The Most Difficult Three.js Effect (So Far)
Glowing, Morphing, Interactive Particle Madness
01
Engine systems
01
Real-Time systems
01
Data systems
03
Interface systems
cosmic-travesseiro-fb27d7.netlify.app
The problem worth engineering
An experimental Three.js + GLSL project exploring the limits of real-time particle systems. Thousands of particles morph between 3D models while reacting to mouse gestures in real time, creating a glowing, holographic, slightly chaotic visual experience.
Built with custom shaders, additive blending, procedural noise, and precise vertex mapping, this effect blurs the line between interactive art and technical sorcery.
- Engineered a particle morphing system that seamlessly transitions between different 3D models while maintaining identical vertex counts for smooth interpolation.
- Implemented a Raycaster-based interaction system allowing users to 'paint' invisible forces on a hidden canvas, influencing particle behavior in real time.
- Applied additive blending and a custom Fresnel shader to create vibrant, glowing particle clusters with dynamic brightness.
02 — Deep-Dive Modules
How it was built, system by system
01 / 07
Interface documentation
Click any screen to inspect it full size.
Related Projects
Explore more of my work
Goods&U | Full-Stack Bilingual (Arabic-RTL) E-Commerce Platform
Polary | Cinematic 3D Narrative Landing Experience
Diagnostics Elite | Cinematic Bilingual MedTech Platform (WebGL + Sanity)
Fix Vision | Interactive High-Performance Creative Agency Platform
IQ Academy | Full-Stack Arabic EdTech Learning Platform
TMT Eye | Enterprise Intelligent Transport Operating System
Goods&U | Full-Stack Bilingual (Arabic-RTL) E-Commerce Platform
Polary | Cinematic 3D Narrative Landing Experience
Diagnostics Elite | Cinematic Bilingual MedTech Platform (WebGL + Sanity)
Fix Vision | Interactive High-Performance Creative Agency Platform
IQ Academy | Full-Stack Arabic EdTech Learning Platform
