Join Jake Ströh for an in-depth discussion in this video A history and comparison of Flash and Edge Animate, part of Migrating from Flash to Edge Animate.
While the animated GIF certainly pioneered simple animations on the Web, it wasn't too long before Flash became a preferred alternative offering more options and techniques for animating on the Web. Being able to add vector and raster imagery while adding sound to animations was a dream come true for beginners and pros alike, who wanted to express their ideas within this relatively new medium. Creative output accelerated in sites dedicated to short-form animation began to proliferate while influencing an ever-expanding Internet culture.
Online animations, game development and websites built entirely with Flash began to show up everywhere on the Web. In 2003, Macromedia developed the Flash Video Codec to better distribute video on the Web via its Flash Player. This new codec offered a way to stream video on the Flash Player. Quickly, Flash video became the preferred format on the Web for consumers and producers, alike. Then, when you factor in the timing of the launch of YouTube and their quick adoption of the Flash Video Codec, you suddenly had a new video revolution and a video standard to support it.
In response to the demand for language better suited for larger and more complex animations, Macromedia released ActionScript 2.0 in tandem with the release of Flash MX2004 and Flash Player 7. This version of ActionScript also conformed partially to the ECMAScript draft specification. In 2005, Adobe purchased Macromedia, and Flash became Adobe Flash. In 2006, ActionScript 3.0 was introduced with a fundamental restructuring of the language that conformed completely to the ECMAScript for draft specification.
It extended the capabilities far beyond preceding versions. In 2007, the iPhone was released. And as we all know, the device and its operating system did not include the ability to consume Flash content. Initially, it seemed as if it was a minor oversight on Apple's part, and many criticized the iPhone for not offering the full Web experience. In 2010, when the iPad was released, there was still no way to consume Flash content or Flash video on the iPhone, or on this new, more powerful device that many considered an alternative to a laptop.
Competitors began their claims of new products forthcoming that would offer an alternative to the broken devices that Apple had made. This became the beginning of the battle between Apple versus Adobe, as well as fever-pitch debates between Flash versus HTML5, and open versus proprietary. Days later Steve Jobs issued his open letter, Thoughts on Flash. He explained why Apple would not ever integrate Flash into its iOS devices. He cited reliability, security, performance and especially battery life issues.
Adobe decided to adapt to what the Internet culture wanted in terms of content development and consumption, and the development of Adobe Edge Animate again attempts, and I'd say succeeds, to make the complex simple for creatives. What's more, for those of us who have a history with the Flash platform in development, is that Adobe clearly has considered those of us considering to create HTML5-based animation and interactivity.
Jake Ströh explains how the web has evolved away from Flash, while pointing out key similarities and differences in Edge Animate that make migrating at times both smooth and challenging. He shows how to re-create a simple Flash banner ad inside of Edge Animate, walking through tasks that should be familiar to Flash developers, like keyframing parameters and working with symbols and nested timelines. Text, audio, and video work differently in Edge Animate, so Jake also spends time on those techniques. Then he'll work through the process of developing an interactive mobile prototype that accepts input from touch screens. When you're done, you should have the tools you need to migrate to Edge Animate and start building web projects that live up to modern standards.
- Understanding the history of Flash and the evolution toward HTML5
- Comparing the interface, keyframing, and asset management
- Re-creating a Flash project in Edge Animate
- Working with web fonts and CSS font styles in Edge Animate
- Working with HTML5 video
- Developing for touch screens
- Converting SWFs to HTML5 with third-party tools