This site is now just an archive over the rise and fall of Flash. The domain flashmagazine.com is available for sale
Login | Register

What is Flash?

Flash has come a long way since the days of Punch the Monkey and Win advertisements. Flash 7 (known as MX 2004 at retail) is a modern interactive platform, with a powerful design and animation authoring tool, an object-oriented type-safe dynamic scripting engine, bitmap rendering with antialiasing and subpixel precision, and advanced video and audio playback features.

By Scott Bilas, Oberon Media, Inc. "Flash" is actually three components: the player, the file format, and the authoring tool/IDE.

The Player
Everyone knows what the Flash Player is. Nearly every computer on the internet has Flash - according to NPD, its penetration is higher than Internet Explorer's, at 96%. We load Flash in our browsers every time we visit web sites with irritating advertisements. For the version 7 Player, it's a 1 MB ActiveX control (OCX) that compresses to 560K, usually installed in C:windowssystem32MacromedFlash.

The player consists of:

- A virtual machine. This interprets and executes bytecode for ActionScript, Flash's scripting language. As with any managed environment, the system uses a garbage collected memory manager. The VM's execution engine can be fairly slow - more on how to work around this later in the paper.

- A hierarchical frame-advancing visual object model. Flash maintains a hierarchy of MovieClip objects (and Graphic and Button, but those are less useful) in a layered display list, where each object has its own frame-subdivided timeline, and layers map onto z-order. The clips can be laid out in the IDE, or created and rearranged from code based on exported symbols in the library. Each has a parent, which eventually goes out to _root. MovieClips can also be loaded dynamically from external SWF's into anywhere in the hierarchy.

- A set of media decoders. Flash can decode and play back multiple streams of compressed audio and video simultaneously. It has decoders for ADPCM, MP3, and NellyMoser (for voice). For video it supports Sorenson H.263 and Sorenson Spark. Because of the ubiquity of Flash on the web, and the quality of Spark, many sites such as Amazon are starting to use Flash for video playback instead of the traditional Real, Windows Media, or QuickTime players.

- Rendering algorithms. Flash has a set of fairly advanced algorithms for rendering vector graphics, including lines, splines, gradients, and antialiased, filtered bitmap fills. Flash is a vector engine, but its support of bitmap fills means it's also a bitmap engine - when a bitmap is dragged onto the stage, Flash actually creates a four-sided shape then attaches a bitmap fill with an identity texture transform matrix. Each shape fill can have a texture transform as well as a simple shader for playing with the color and alpha of texels as they are rasterized. There are many examples online using Flash to render simple 3D objects in this way.

- A framework library. Much of this is just the standard library we would expect from any JavaScript implementation - basic string functions, arrays, sorting, math, etc. Flash also adds support for TCP communications (no UDP unfortunately), asynchronous loading, XML, and more.

The File Format
The Flash file format is known as SWF (from Shockwave Flash, pronounced "swiff"), which has gone through many revisions over the years. SWF is a tag-based binary format designed for streaming, with zlib compression on top to keep it small. It's important not to confuse Flash with SWF - while the Flash environment has a closed FLA document format (more on this later), and the Player is closed source code, SWF as a file format is free and open - the spec is complete, and easy to find on Macromedia's site:

http://www.macromedia.com/software/flash/open/licensing/fileformat/

Here is a more programmer-friendly version:

http://sswf.sourceforge.net/SWFalexref.html

Many apps have been created that output directly to SWF, such as vector drawing programs, charting programs, screen capture software for demos, presentation software, and enterprise frameworks such as Flex and Laszlo. There is even an MSIL-to-SWF compiler by Robin Debrueil that lets us write code in C# or VB.NET and compile into SWF.

There are a few potential alternatives to SWF that meet some of our requirements, but not nearly enough:

- SVG from the W3C. Scalable Vector Graphics is a standard popular with the open source community, but not much of a competitor to SWF, primarily because of the tools available to build SWF's. The only SVG authoring tools currently available are very primitive - they are today where Flash was 5 years ago.

- XAML from Microsoft. This hasn't been released yet, but it looks like a good, comprehensive system. However, until we see an authoring tool, we can forget about it. There is at least one SVG-to-XAML converter (from Xamlon), but that doesn't solve the problem with the authoring tool. Not that it matters much anyway - XAML and the composition engine to render it cannot be considered standard on desktops in the casual audience for ten years, at least not if the number of people running Win98 today is any indication of how people drag their feet on upgrades. And when it's released, it will likely have the same problem as the .NET Framework does today (even worse, as "Avalon" requires .NET) - the redistributable size will be in the tens or hundreds of megs, overwhelming the download size of the game.

The Flash player is available on Windows, Mac, Linux, and PocketPC. For mobile phones the Flash Lite player is increasingly supported, although this player only supports relatively primitive Flash 4 level scripting.

The Authoring Tool / IDE
This is the equivalent of Visual Studio for composing Flash content, and it's what Flash developers spend most of their time using. Contained within its integrated development environment are the following major components:

- A code editor. Don't use it, it's terrible. Better than Notepad, but nowhere close to a tool like Visual Studio. At Oberon we avoid using Flash's built-in code editor for anything over 10 lines of code, and instead use PrimalScript by Sapien (www.sapien.com). PrimalScript supports standard features we've all become accustomed to, like IntelliSense, unlimited undo, source control integration, etc. Despite it being buggy and overpriced, it's worth using. Because of the dynamic nature of JavaScript, it's easy to mess up and spell something wrong, or pass the wrong parameters into a function, without the compiler catching it. The IntelliSense feature helps to avoid these silly mistakes, which can save a lot of debugging time.

- An animation editor. This is one of the most powerful features of Flash. Animations are done using familiar tools like layers, tweening, onion skin, easing in/out, etc. Most people are familiar with Flash's vector animation abilities, but the same system works with bitmaps as well, which are simply treated as fills on vector shapes (i.e. textures with transforms).

- An editor for vector art. While most of the art is likely going to still be bitmaps, it's frequently useful to use the vector engine for drawing the gradients, line art, and fills that are so common in game UI's. And when it comes to prototyping something quickly, it's trivial to bang out some decent looking programmer art in a few minutes.

- A compiler. Flash's scripting language is called ActionScript 2.0, which is actually an advanced version of JavaScript based on the ECMAScript 4 draft spec. This version takes the dynamic JavaScript language and adds features such as static typing, classes, interfaces, and type safety.

- A content build system. This is the compression and packaging step, converting bitmaps and audio into JPG and MP3. Code and content are wrapped up into a SWF, which is Flash's packaged file format. Versions since 6 have supported zlib compression of the SWF, so the files can be very small.

- A debugger. This is probably one of the worst features of Flash. The debugger supports standard features like breakpoints, watching variables, and a call stack trace, but don't let the feature set fool you. It is poorly implemented, has terrible usability, and is almost criminally slow and unreliable. When projects get over a certain size, the debugger becomes impossible to use, and the only choice is to fall back to "printf debugging" (i.e. debug via log analysis). Most of the time this works well enough, and the tough-to-debug cases can be handled by copy-pasting a subset of elements into a test file and debugging from there (more on this later).

- A help system. Flash stores all its help in HTML files, but the interface to it from the IDE is pretty awful compared to a viewer like the MSDN Library uses. Some tools such as PrimalScript can index this content and provide a better viewer for it, but only slightly. It's good for context-sensitive F1 style help, but that's about it. Fortunately there's a great workaround: the Flash Resource Manager, which is a free tool that integrates help from Flash with a decent interface, but also will search a variety of online resources such as the amazing FlashCoders mailing list, Macromedia Tech Notes, Fullasagoog, and many others. It can be found at http://www.markme.com/mesh/archives/004700.cfm.

· A content manager. Flash has a good system for managing content. It will import art and audio stored in most major formats into its "library", which is organized as a tree structure. This is convenient for developers - artists and composers can store their assets in version control in whatever folder structure they like, and engineers integrating it can organize it in the library in a format that is more convenient for them.

The IDE manages FLA files, which are the source for creating SWF's. All art and audio used by a FLA are stored directly inside of it in a lossless format. The FLA also maintains a reference to the original file on disk, so when the asset changes on disk, it can be updated in the FLA. The disadvantage of this is that assets must be updated manually (although this can be automated as part of a scripted build process). Artists working on bare PNG's can't simply check in new art and expect to see it, unless they tell an engineer to update it in the FLA. Artists working on FLA's directly will need to remember to update their libraries to get the art they just changed in. But on the other hand, the advantage of this process is that assets can be updated only when the engineer is ready for it. There are no problems with someone checking in new assets that accidentally break the build, because the integrating engineer will have to know about every change that is made.

"Publishing" the FLA initiates the build process, and will result in a SWF, usually with graphics compressed to JPG and audio compressed to MP3. The type and level of compression are configurable on a per-asset basis, as well as with global defaults.

Flash's IDE is scriptable via a language called JSFL, which is JavaScript plus a DOM for the environment. The library for JSFL can be extended with DLL's written in C. Nearly every feature of the IDE can be used from JSFL. In fact, any command the user performs is recorded in a history buffer for undo/redo, and most commands have a JSFL equivalent. It's trivial to drag-select a set of commands in the history and save them as a JSFL function. This is a convenient way to learn JSFL coding - just do the operations manually, then save the code and make adjustments from there.

Panels and custom tools can be created in the IDE that look and operate just like the UI that ships with the IDE. The UI for these is (unsurprisingly) implemented as SWF's configured with an XML language.

Flash MX 2004 Pro costs $700, which is on par with most IDE's. It uses a product activation system that permits two installations per copy, which is convenient for working on Flash at work on the workstation or at home on the notebook. It's available on Windows and Mac - the interface is nearly identical on both versions, and the FLA format is the same, so files can be interchanged. In the few places where a path can be stored in a FLA (such as for publish settings), each platform will accept path separators from the other platform.
Advantages of Flash >>>

 

Next tutorial:
Advantages of Flash

Previous tutorial:
The Development Platform

Get new stories first

Click to follow us on Twitter!

 

Comments

No comments for this page.

Submit a comment

Only registered members can comment. Click here to login or here to register