Back in the game...
Years ago I used to be pretty good with Macromedia Director, software that let you create animated and interactive projects on the computer. I could make things move and fade and react to mouseclicks in all sorts of interesting ways. Sadly Director has faded from the scene, mostly replaced by Adobe Flash.
I've had mixed results with Flash. I learned enough to create a website with it, but a few months later I found that I'd forgotten most of what I "learned." Truth is I've never been able to wrap my head around how Flash operates well enough to do anything beyond the basics.
Meaning I've been feeling completely crippled when it comes to creating interactive work for today's world. Now I'm seeing light at the end of the tunnel in the form of CSS3, HTML5 and Javascript.
CSS3 animation
Today I want to share just a few samples of CSS3 animations and transitions. Let's jump right in with this sampler of 39 animations that will make your eyes bleed if you click on "Animate All."
One downside to CSS3 as of April 2012 is that it only operate inside a web browser. With Director and Flash you could create self-contained projectors that work by themselves, no browser needed.
Oh. Did I mention that if you're using Internet Explorer 9 or earlier you won't see a dang thing?
That's problem #2, way more serious. Microsoft has been notoriously slow to adopt current web standards. At this point no version of IE will show these animations. The next version of Explorer, IE10 should handle all them just fine. We hope.
More elegant
Lest you think that CSS3 animations have to be a bit on the cheesy side, take a look at Blur Menu with CSS3 Transitions (view demo to see them in action).
Minimal, elegant... that's more like it.
