We’ve been working on a set of tools for creating web based WebGL animations, but since we’re not quite finished yet, we decided to release a demo of something fun.
Ginger is a facial rig that utilizes 25 or so morph targets that get powered by three.js in WebGL. The facial features of the model can be shifted into different forms and expressions using the jQuery UI sliders (we originally had html5 range inputs, but wanted to get some love for Firefox out there which doesn’t quite support them yet).
The demo works pretty well in the latest versions of Chrome and Firefox (sorry IE users…no WebGL for you).
While the demo offers simple functionality, the overall toolset that we’re working on has to deal with creating easier animation tools for the cutting edge of the web in canvas and WebGL. But we’ll get into that later.
In the mean time, enjoy playing with the demo, and stay tuned from some cool tools in the pipe!
NOTE: if the demo isn’t loading (and in certain cases with video drivers being blacklisted in Chrome/Firefox that will be the case), you can see the demo in action in the YouTube videos below. For comparison purposes, we did videos in both Firefox and Chrome.