HTML5, WebGL and Javascript have changed the way animation used to be. Past few years, we can only achieve extraordinary web animation by using Flash and Java Applet. It's possible to create insane effects and crazy animations with scripting and render it on the browser. There are a few reasons that make this achievable:
- Poweful processing power. Our computers are too powerful and sufficient enough to render most complicated animation.
- Modern browser and web technologies. Modern browsers such as FF, Chrome, Safari and IE10 and support of new web technologies such as Canvas, SVG and WebGL.
- Fast Internet connection. Some experiments require live streaming of data and preloaded resources.
We have found 8 stunning effects made with WebGL, HTML5 Canvas and Javascript. They are simply mind-blowing, crazy and very creative. For example, sticky thing demonstrates the gravity physic! However, keep in mind that these are experiment only and probably you won't see it used commercially because legacy browsers won't able to run it, and the web technologies are quite new. Anyway, it's good to see what the web capable to do, and certainly look forward what will happen in a few years time. Best view with Chrome and you can try it with Safari, Firefox and IE10 as well.
- Sticky Thing
Throw it and see if it sticks.
- Animated Volume Particles
Use float textures and frame buffer objects to simulate 3D particles flying through the volume an animated animal. Click and move the mouse!
- Voxels Liquid
3D representation of this classic 2D water effect algorithm.
- Pulpo
WebGl & tree.js Rules! Animated Star ray.
- Wormz
HTML5 Canvas Experiment with all tiny little worms
- Crazier Tentacles
This is a physics-based version of Crazy Tentacles. It uses the same formula to generate the target shape and elastic rod physics to make it go towards that shape.
- Visual Random
Multiple levels of random: where the voxel drops, the color of the voxel, the highest stack generated by the random drop. All of these things combined create an interesting perspective of what random actually looks like.
- Conductor
At www.mta.me, Conductor turns the New York subway system into an interactive string instrument. Using the MTA’s actual subway schedule, the piece begins in realtime by spawning trains which departed in the last minute, then continues accelerating through a 24 hour loop. The visuals are based on Massimo Vignelli’s 1972 diagram.
