∞ Adobe releases HTML5 Web Motion and Interaction Design Tool

Adobe on Monday released a new tool called Adobe Edge that will allow Web designers to bring animation to Web sites using HTML5, JavaScript and CSS.

[ad#Google Adsense 300×250 in story]”Our customers have said they are excited about what’s happening around HTML5, and we want to give them the tools they need,” Adobe’s Heidi Voltmer told The Loop.

Voltmer explained that Flash will continue to be focused on the top end content, while the company makes tools like this available for Web designers who need to input exciting elements in their Web sites.

Adobe Edge is being released to the public even before it hits the beta stage. Adobe said it wants to develop the software with the help of the people that will ultimately be using it.

Adobe’s Josh Hatwich said the interface for Edge will be very similar to After Effects and Flash Pro, so users will have some familiarity with it starting off.

“We wanted to make it approachable and familiar for people,” said Hatwich. “To take something that requires intimate knowledge of technology and allow people to harness it and take advantage of it.”

The first public release is limited in scope, but that’s a short term issue, while the team gets feedback from users.

“We focused preview one on animation, but we know that people will want more,” said Hatwich. “We are expecting to add a lot more functionality to the product.”

According to Adobe, Users can import standard web graphics like SVG, PNG, JPG and GIF files and style them using CSS3. The design stage utilizes WebKit to enable design, preview and manipulation of content.

Using the timeline in Edge, you can add motion to the assets, so you end up with a project that looks like it could have been built in Flash, but it’s built with HTML5 and CSS.

Content created with Edge is designed to work on modern browsers including those on Android, BlackBerry Playbook, iOS, HP webOS and other smartphone mobile devices. The content will also work with Firefox, Google Chrome, Safari and Internet Explorer 9.

Adobe Edge preview one is a free download, available from Adobe Labs. It comes in versions for Mac OS X and Windows 7.