Shooting Star Equalizer

WebGL project in Three.js realized during a workshop at Gobelins, l'école de l'image. The aim was to create an equalizer in 3D.

How seeing this

If you want to vizualize my project, please :

• Install (if you don't have them) :
  • Node.js: brew install node on OS X
  • Bower: npm install -g bower
  • NPM and Bower dependencies: npm install & bower install.
• Start with npm start to show my projet at http://localhost:3333/

Steps

• Create a class for my rays with a random rotation :

• Add a cylinder for the drag and began to manipulate vertices :

• Add old sphere positions saved in an array for each vertices of a cylinder :

• Linking the rays (or other ;-) ) with musical frequencies :

• Optimize drag effect, colors, velocity, easing and other parameters :

• Add toon shaderring and light :

• Add WAGNER post processing (Vignette & FXAA pass) :

• Create introduction :