The nuts and bolts of Flashy presentations

Last week we received even more responses to our call for what you want to read in this column. Thanks. Keep the ideas coming.

This week we’re going to start looking at a phenomenon of the Internet: Macromedia Flash, one of the key technologies that have defined how the Web looks and feels.

Flash has appeared all over the Internet in everything from advertising to complete interactive GUIs. It is without doubt one of the most useful and flexible graphics presentation tools available and, according to Macromedia, can be used by 98% of all Internet users.

Interestingly, the use of Flash also has attracted lots of criticism because it has led to more aggressive advertising content and has been overused for content-free front-end pitches on many corporate Web sites.

So why is it that Flash has become so dominant in a marketplace positively overloaded with competing tools? The answer lies in the sophistication and performance of Flash graphics and audio presentation, the excellent Flash development tools and cross-platform applicability backed by the not inconsiderable Macromedia marketing machine. Add to that third-party vendors that provide many tools to extend and augment Flash development.

Flash, acquired by Macromedia in 1997 and originally called Future Splash Animator, grew from a relatively simple animation program into a huge suite of tools and services. Under the hood, the Flash player is a programmable vector-based object-rendering engine that displays Flash “movies.” While the player handles raster (aka bit-map) images, much of its success comes from the performance advantage that vector display provides in terms of animation speed and decreased data size (vector images are usually considerably smaller than bit-mapped ones).

Another significant improvement, particularly important for Web content delivery, comes from streaming – the Flash player’s ability to start rendering content before the complete content is downloaded. This allows for faster start-up.

The Flash MX application is where you develop content. At the heart of this is a comprehensive vector graphics editor that also can edit and incorporate bit-mapped images. You construct images in the “stage,” on which groups of graphical elements (lines, curves and so on) that make up the image are placed. Images can be further organized into layers to allow animation of the content of a specific layer.

You create the animation against a timeline by specifying “keyframes,” which are key steps in the animation sequence where changes in the stage contents occur, and regular frames, which continue the same content as the previous keyframe.

To animate a bouncing ball, for example, you would create the ball in a keyframe, then add enough regular frames to cover the duration of the movement – the higher you set the frame rate the smoother the ball’s movement but, of course, the trade-off is a bigger output file.

Next you turn all the regular frames into keyframes and modify the position of the ball in each to create the path of the ball. That’s the hard way. The easy way is to use “tweening”: You create a keyframe with the object to be animated and then another empty keyframe separated from the first by the required number of frames.

Now select all the frames including the keyframes and use the Create Motion Tween command to link the keyframes. Then, by moving the object in either keyframe, Flash will move the object incrementally to its position in the other keyframe when the animation is played. If you select any regular frame between the keyframes and move the object in that frame to a new position, the frame will be converted automatically to a keyframe. You also can tween shapes, that is, convert one shape into another, morphing its colors and textures at the same time.

Flash MX includes an overwhelming number of tools and techniques that take considerable time to master, although you can develop good results with just the basics. The software allows for transitions and animations such as fade-ins, fly-ins and spins, and supports behaviors that do not require programming, such as links to a Web site and playing movie clips and triggering data sources. It is a phenomenal feature list. Next week, we’ll look at ActionScript and Flash content deployment.

Present your thoughts to gearhead@gibbs.com.