Canvas Header

The original header to this website is an image of me holding a chameleon from the Rwenzori rain forest (Uganda). In the enhanced version of the header, the chameleon slowly changes colour and occassionally blinks at you.

This kind of animation would be very simple using flash and actionscript. Fortunately it is still relatively simple using javascript as all the main flash gurus (Grant Skinner, Green Sock, Lee Brimelow, etc) have been transporting their knowledge and tools over to Javascript.

I have created this subtle animation using EaselJS, PreloadJS and GSAP-js. GSAP-js has plugins which allow you to tween the color filter values within EaselJS.

Note: I not fully tested cross browser support for this yet. I have successfully tested on all the modern browsers including on serveral smart phones
As this is a progessive enhancement, I have completely turned off support for older Internet Explore browsers (IE6 - IE8), they just get the original header

Skill set: Photoshop, Javascript, CreateJS, GSAP-js, modernizr, html, canvas, css

Create JS

CreateJS is a suite of modular libraries and tools which work together to enable rich interactive content on open web technologies via HTML5. These libraries are designed to work completely independently, or mixed and matched to suit your needs. The CreateJS Suite is comprised of: EaselJS, TweenJS, SoundJS, PreloadJS, and Zoë.