Adobe Edge Preview 1 and jQuery

Adobe recently released Preview 1 of Adobe® Edge, a new web motion and interaction design tool, on labs:

Edge allows a designer to create animated content for websites, using web standards like HTML5, JavaScript, and CSS3. To get an idea of the types of animations you can create, be sure to check out the “Getting Started” video and samples:

jQuery is one of the key components in Edge’s implementation. It is used both internally, within the application itself, and within the final animation output it produces, to evaluate selectors and manipulate/traverse the DOM.

The animation output produced by Edge does not make use of jQuery’s $.animate() function. Edge uses its own declarative representation and implementation of timelines and tweens. This representation is designed to be highly flexible yet toolable and human-readable.

Edge Preview 1 uses jQuery 1.4.2. Succeeding Previews will use newer versions of jQuery, and the next release is expected to use version 1.6.2.

Please keep in mind that this is a preview, not a beta, or finished product so there is still quite a bit of work to be done on the product itself. Also, the Edge team is aware of the many ways to animate content with open web technologies (JS, CSS3, Canvas, SVG, etc). For this preview, the focus was on basics, specifically, animation of elements within the HTML document DOM. We’ve heard loud and clear from the community about their desire to animate content within canvas and SVG elements. I assure you that the team has already thought about support for content inside these elements, and so there are already implementation requests for these features in the Edge product backlog.

Give Edge a whirl and send any feedback, questions and requests to the team via the Edge forum: