Animate With Adobe Edge
Quick Summary Animating with HTML5 and CSS3 can be a great way to add some movement and interaction to your website or web application. It can also be very difficult. Adobe recently released a new application called Edge, which allows us to use a graphic user interface to create animations and export html, css and js files. […]
Animating with HTML5 and CSS3 can be a great way to add some movement and interaction to your website or web application. It can also be very difficult. Adobe recently released a new application called Edge, which allows us to use a graphic user interface to create animations and export html, css and js files.
Here is a really stupid example of how you can animate with Adobe Edge. I created it in about 5 mins, so dont judge:
The interface is similar to After Effects. So if you’re familiar with AE, you’ll have no trouble creating really awesome animations. Check out Adobe’s website for some really beautiful demos: http://edge.adobe.com/showcase.html
The best part is that all of the animations work on iOS and Android devices. And Adobe claims browser support for all major browsers, including IE9
From the adobe website:
“Adobe Edge is a new motion and interaction tool that allows designers to bring animated content to the web using HTML5, JavaScript and CSS. It is currently in public preview and is designed to be powerful yet approachable and easy to use. Edge is currently available in the the Adobe Creative Cloud™ or as a complimentary download on Adobe Labs.”
I dont know how optimized the code is, which Edge spits out, or if this is an ideal solution. But it’s a really quick way to get animations on your websites, without writing any code.
Let me know what you think of Edge.
—
John
