November 14, 2011

Check out Flash Pro generating HTML5

Let’s get a lot more people making animated HTML5 content. To do that, we need to lower the barriers to entry. ┬áThat means making content run reliably across browsers, and letting the hundreds of thousands of people with Flash skills apply those skills to a new output format.

Because HTML is so broadly useful (Web pages, mobile apps, magazines, etc.), there’s no one-size-fits-all solution. In this 10-minute demo, Adobe VP Paul Gubbay shows:

  • Animating in the new Adobe Edge app (download it from Labs)
  • Turning that output into an app using PhoneGap [jump]
  • Using Flash Professional to export animation as HTML [jump]
  • Running CSS Shaders in WebKit [jump]
  • Enabling “liquid layout” from InDesign [jump]

 

 

I find the Flash Pro HTML export demo especially exciting, because it helps you reach your audience across configurations (e.g. letting an ad run with or without Flash installed), and it helps migrate content from Flash into HTML.

I should emphasize that this technology remains a work in progress, but here’s some of what I’ve learned:

  • This path will be most useful for relatively simple pieces–think ads, microsites, & other animated branded experiences, not complex games.
  • Output will be editable in Edge where it can be choreographed with other Edge motion content and where you can add interactivity in JavaScript. Flash Pro can play to its strengths, such as frame-by-frame character animations, feeding these into Edge.
  • The Flash Pro team is experimenting with converting ActionScript to JavaScript, again with ads being a key use case.
  • Sprite sheet export (see separate demo) will be useful across a variety of tools & runtimes (CSS, Canvas, Starling, and more).

I find all this extremely exciting. What’s your take? Anything else Adobe should be doing here?

 

PS–This demo was excerpted from last week’s Adobe financial analysts meeting. You might find some of the complete recordings & slide decks interesting. (Paul spoke during the David Wadhwani segment.)

11:34 AM | Permalink | Comments [18]
Copyright © 2014 Adobe Systems Incorporated. All rights reserved.
Terms of Use | Privacy Policy and Cookies (Updated)