Adobe today announced the first public preview release of Adobe Edge, a new HTML5 web motion and interaction design tool that allows web designers to bring animation, similar to that created in Flash® Professional, to websites using standards likes HTML, JavaScript and CSS. Because of rapid changes around HTML5, the company is adopting an open development methodology for Adobe Edge and is releasing the software on the Adobe Labs site much earlier than normal in the development process – before it even reaches beta – in order to allow user feedback to help shape the final product.
While in public preview, Adobe Edge will be a no-charge download that web designers are encouraged to explore and provide feedback on, to help shape future preview releases.
Adobe Edge, first shown at Adobe MAX 2010, is for designers who want to leverage Web standards like HTML to create Web content with motion and transitions. Adobe Edge is being designed as a fast and lightweight professional-grade tool that complements Adobe’s existing Web tools, such as Adobe Dreamweaver CS5.5, Adobe Flash Professional CS5.5 and Adobe Flash Builder 4.5 software.
“Over the last year Adobe has delivered on several significant HTML5 milestones including contributions to jQuery, submitting code to WebKit, and enhanced HTML5 output in Creative Suite 5.5,” said Paul Gubbay, vice president of Design and Web Engineering, Adobe, in the press release. “Now, with Adobe Edge, we’re taking our HTML5 tooling to a whole new level and look forward to getting some really useful feedback from the community over the next few months, as we refine the product.”
The Adobe Edge preview works natively with HTML. It enables users to add motion to existing HTML documents without hampering design integrity of CSS-based layouts, and it also enables users to easily create visually rich content from scratch, using familiar drawing tools that produce HTML elements styled with CSS3. Users can import standard Web graphics assets such as SVG, PNG, JPG and GIF files and style them using CSS3. The design stage utilizes WebKit to enable design, preview and manipulation of content with incredible fidelity. The innovative timeline feature is both familiar for creative professionals and breaks new ground in animation productivity to enable users to define and customize motion applied to HTML elements with extreme precision. Content created with Edge is designed to work on modern browsers including those on iOS and other smartphone mobile devices as well as Safari, Firefox, Google Chrome and Internet Explorer 9.
This Adobe Edge public preview is available today on Adobe Labs as a free download for anyone wanting to explore adding motion and animation to their HTML workflow or HTML animation to their skill set. The Adobe Edge preview is expected to be updated regularly as new functionality is added.
This summer Adobe is sponsoring the Expressive Web Tour HTML5 Camps in cities that include San Francisco, Tokyo, New York City and London to continue providing further support to people interested in HTML5. In addition, Adobe has launched a new online resource showcasing some of the newest and most expressive HTML5 and CSS3 features being added to the modern Web. The new site, which was released today in beta, was created using new HTML5 and CSS3 features.
Adobe Edge is immediately available worldwide for Mac and Windows platforms via a free download on Adobe Labs. For more information including system requirements, visit www.adobe.com/go/edgepreview.
Source: Adobe Systems Incorporated
MacDailyNews Take: Good to see Adobe is now seriously following Mr. Jobs’ advice instead of quixotically fighting it:
New open standards created in the mobile era, such as HTML5, will win on mobile devices (and PCs too). Perhaps Adobe should focus more on creating great HTML5 tools for the future, and less on criticizing Apple for leaving the past behind. – Steve Jobs,April, 2010
Flash is dead.
Related articles:
Pandora dumps Adobe Flash for HTML5; takes cues from Apple iPad – July 12, 2011
Study: iOS users view 80% of mobile video – May 23, 2011
Adobe releases Creative Suite 5.5 with HTML5 authoring – May 3, 2011
Adobe capitulates to Apple, releases Flash-HTML5 convertor – March 8, 2011
Adobe’s Flash on Android is ‘shockingly bad’ (with video) – September 1, 2010
Adobe Flash hobbles Android use of BBC iPlayer versus iPhone – August 29, 2010
Adobe CEO Shantanu Narayen believes his firm doesn’t need Apple or the iPad – August 16, 2010
Apple marginalizing Adobe’s proprietary Flash as companies, designers shift to open HTML5 – May 21, 2010
H.264 has already won, makes up 66% of online videos, and Adobe Flash encoding plummets – May 02, 2010
Steve Jobs posts rare open letter: Thoughts on Flash – April 29, 2010
Try a native Mac App from the App Store: Hype. It’s $29 and is pretty darn good.
Thanks! I haven’t downloaded it, but I’ll certainly remember that. It looks very good.
f Adobe.
This is all well and good but it needs at least a basic tutorial to make sense of much of it.
Yes, I have been using it and it’s really good. They are planning to add WebGL capabilities too..
was referring to Keith’s comment above
No word on where Adobe hides its tracking super cookies.
Finally! I liked what Flash could do with some websites but we need a tool that professionals could use that takes their content across all platforms.
We’re in the post PC era and this shows that Adobe is waking up that reality.
Again Adobe hoping not to get beat to the punch by ppl like Hype. Similar to them releasing free Lightroom after Apple created Aperture. These dicks don’t do anything unless they’re forced to. Then find a way to tie the user back to their CS crapware.
Excellent take there, MDN.
This web developer is very impressed!
Unlike Hype (the only other HTML5 visual editor out there with some clout), Adobe Edge generates serviceable code.
Hype compiles animations into giant mess of computer generated gibberish, that no one can’t possibly edit without going back to the Hype editor.
Just by looking at the code a Hype project generates, I already have a very good technical understanding of how Edge executes an HTML5 project:
– jQuery is imported.
– The Adobe Edge JS framework is loaded. This is a less < 4KB JS file written as a standard jQuery plugin.
– Keyframe and Symbol information is written in a JavaScript file in JSON style syntax.
– Some elements created in the Edge editor are written in HTML as divs with semantic names.
– Other HTML elements are generated at runtime based on Symbol information written in the previously mentioned JSON.
– Elements are styled with standard CSS, heavily favoring CSS3 syntax with browser prefixes.
The editor itself is lacking many features, but what they have now is a solid framework. This is exactly how an HTML5 editor should work. Elements can be laid out visually, animations are keyframe based and laid out on a timeline. The code it generates at the end is as good as machine generated code gets – human editable and following established best practices.
Still prefer Hype
Hype’s generated code is garbage.
The fact that you need Hype to edit Hype projects basically makes it just as proprietary as Flash, and just as hard to work with for developers.
You can go ahead and prefer what you want. Some people still think Internet Explorer is the best browser. Some people juggle geese.
Edge is the barest of bare-bones software.
Functionally it is near useless. I can’t re-order items. I can’t create a looping animation. The tools lock you in to a foolish set of restrictions (try scaling an image without the sliders).
As far as Hype goes, I used it to create a slide show animation with custom graphics for my photography business… I was done in 20 minutes and dropped all the assets in to squarespace with no trouble. Who needs to get to raw code when it works the way it is?
It’s not bare-bones software, it’s a 0.1 developer preview. It’s not beta yet, it’s not even alpha. Missing features are to be expected.
I think it’s safe to assume it will let you loop animations by the time it’s released, and it won’t be hard to do.
All true, but it is bare-bones. Given it’s current feature set there was really no reason to release even a preview.
OK, it does what it does NOW, but this could have been a press release with a more full-featured release in 3 months. As it stands what Adobe has released is not going to sell anyone.
Let us make sure this is perfectly clear to everyone, lest someone get way too excited.
HTML5 cannot replace Flash and its feature set. There is no chance Disney can transcode their entire ‘PlayhouseDisney.com’ site into HTML5 and deliver all those interactive games that way.
Just a reminder for some people here; Flash is an entire virtual platform, with a fairly powerful SDK for development of complex interactive software solutions deliverable on the web. There is no way HTML5 can deliver a fraction of that.
However… With Adobe’s entry into HTML5 content development, it is clear that Flash will finally be put into its place: as a specialised platform for delivery of complex applications online. Right now, that type of content represents only a very small percentage of all Flash content online. The vast majority of Flash content out there falls into three basic categories: animated advertising banners, online streaming video, and picture galleries/slide shows of various sorts. In addition to these main three, there are plenty of situations where it is used as a crutch to perform some basic function (authentication, fetching/displaying some dynamic content, etc).
Vast majority of Flash content functionality (as well as visual appearance) of today can easily be replicated using HTML5. With Adobe’s introduction of this tool, they are positioning themselves right in the middle of the movement to port all that Flash content and functionality over to the technology (HTML5) that can be seen on iOS, which is rapidly carving out greater and greater share of the web browsing audience. Once this move is complete, what is left of Flash content will be in Flash only because Flash is the best platform for such content.
Everything that Flash does “better” can be explained by the fact that they have a decade head start on HTML5. They’ve had a lot of time to work things out, perfect tricky things like smooth animation, typography, video, audio, layer blending, cross-platform kinks, and hardware acceleration.
There is nothing that Flash can do that is in some way beyond what HTML5 is capable of. It’s just going to take time for HTML5 features to be implemented, refined, and reach ubiquity.
HTML5 is on a rapid ascension, while Flash has been stagnating by the wayside. Within five years, I predict HTML5 will have performance and feature parody with Flash, and then it will surpass it.
HTML5 is a future standard version of HTML. Flash does not have a ten year head start on HTML.
I agree completely. The first time I saw a company contact information in “Flash” and I couldn’t copy it, I knew something was very very wrong.
I love my iPad and iPhone, and I’ll take the trade off of longer battery life and no useless advertisements for “missing” content any day of the week.
ALL COMPANIES should realize that iPad users have disposable income and ask themselves “do I want to piss off Apple users”?
It just seems to me the solely HTML5 ecommerce sites will load faster, perform better and lead to higher sales. Don’t let the IT geeks or “designers” tell you different. iOS and the iPad is how real people want to use their computers.
With or without tones of useless and crapy lines of script, one will have to erase or change by hand?
Before you all get excited, remember where this POS is coming from. Adobe. Now pause and think back and remember how these Aholes considers Mac users and what they think of Apple & SJ.
Now do you still want to support these guys?
This isn’t about Mac community supporting Adobe in their effort to deliver a HTML5 authoring tool. We already have another tool for that.
The significance of this story is that Adobe (the same company that makes Flash) is now offering a development tool that is to be an alternative to Flash for all those Flash developers (many, if not most, in the Windows world), and we should all try and encourage as many of those Flash developers as possible to switch to an HTML5 authoring tool for their interactive, multi-media solutions, even if it means switching to another Adobe product.
The ultimate goal is NOT supporting Adobe; it is moving all that Flash crap into HTML5. It may still be crap, but it will at least drain much less battery…
Really? Please do tell. What do Adobe think of Mac users? Without citing examples, you post is mindless drivel seemingly perpetuated by “Apple is good, everyone else sucks.” Adobe is more than “the flash company” but somehow that point gets missed on everyone who doesn’t work in the creative industry.
If Adobe didn’t care, why are their major applications (Photoshop, After Effects, Premiere, etc) rewritten for 64-bit on the Mac? You don’t go through that kind of trouble for a platform you don’t care about.
Smart, at least logical, move- or attempt.
Incredible, marvelous blog site data format! The way very long are you blogs intended for? you’re making running a blog appearance quick. Your entire peek of your respective web site is astounding, seeing that beautifully because the content!