Even more Flash

January 15, 1998
by David Calaprice

Director and Flash Unite

With the introduction of the Flash Asset Xtra, you can now use your Flash animations in your Director movies. Just being able to view compact, anti-aliased vector art from within Director and Shockwave is pretty handy-- but the Xtra actually provides a whole lot more than that: you can also composite your Flash movies with other sprites, embed them in your Director cast or stream them progressively from external files, and control practically every aspect of playback-- including rotation and scale-- with over 60 new Lingo commands.

What about Shockwave?

That's all fine and dandy, but if you can't use it with Shockwave, the whole benefit you get from reduced media size is for nothing, right? Here on the Project X team, we couldn't agree more. So, as Pat mentioned in his first article on the Xtra, the Xtra has recently been built into the standard Shockwave download. Anyone who downloads Shockwave after February 18, 1998, will get the Xtra automatically. To support those with earlier versions of Shockwave, however, I still recommend putting up an auto-installer button.. Roger Jones and John Dowdell have also done a wonderful job refining a handler to detect the presence of the Xtra (based on earlier work by Terry Schussler), which was posted to the Shocker list (thanks, guys!). Here's the basic script:

-- test for flash asset xtra
on isFlashXtraInstalled
  return (symbol("unique" & the ticks) + 0)¬
   >  (symbol("flash") + 0)
end

(Note that this particular function only returns a valid result the first time it is called in a session; after that, it always returns TRUE.) I recommend checking Narrative's Shocker Archive for more info on the topic of Flash Asset Xtra detection in Shockwave.

Tips & Tricks

Now that vector art can be incorporated into your Director and Shockwave movies, it's time to start thinking about the problems (and, hopefully, opportunities) that arise in production when combining these things. Here are a few tips that might be useful, based on my own experience from developing and playing with the Xtra. (Now if only there were more time for the "playing" part...!)

Performance

Keep performance in mind from the very beginning. Since the rendering of vector graphics can be much more computationally expensive than, say, displaying a bitmap, it's a good idea to think ahead when designing vector art for animated playback. Performance is also much more variable than with bitmap-based media, the speed depending on a number of different factors from color depth to geometry complexity. Toward the end of the Flash Asset Xtra ReadMe, I've provided a list of items to consider when optimizing for performance. I'll discuss a few of them here:

• Sprite size. Although Flash objects scale nicely, bigger sprites take longer to render. Use the smallest bounding box necessary to display your Flash movie. There's currently also a performance hit when animating the sprite size (i.e., stretching/shrinking the Director sprite over a series of frames) - so, in some cases, it may be better to leave the Director sprite bounding box constant and scale the content instead.

• Color depth. Most users have noticed a significant difference between 8-bit and 16/24-bit playback (typically 8-bit is much faster). Experiment with different color depths to make sure playback is adequate in all environments you expect to run in.

• Geometry complexity. The Flash animation engine is basically a 2D scan-line renderer, similar to interactive 3D renderers. This means that for every frame of your Flash animation, the engine is drawing the display a horizontal line segment at a time based on an abstract representation of the scene (in this case, a sorted list of 2D curves). Therefore, like in 3D, the more complicated your geometry is, the more processing time is required for the render. Keep the artwork simple and avoid unnecessary strokes.

• Fills. Solid color fills render much more quickly than gradient or bitmap image fills.

• Inks. The Flash Asset Xtra supports transparent ink-- however, it can be much slower than using copy, especially for large sprites.

• Quality. The default quality for Flash Assets is #high. By using #low quality, which disables anti-aliasing and bitmap fill pixel interpolation, you can improve playback speed by up to three times. This option can be set in the Flash Asset Options dialog, or via Lingo by using the quality of member or the quality of sprite properties. Consider changing this property dynamically depending on the size or motion of the Flash sprite for optimum playback.

Media Size

Media Size in Flash is really driven by three things: the complexity of the vector art, the number and size of bitmap image fills, and the number and size of embedded sound clips.

• Geometry (again). Tips from Performance section apply here too. Flash has a built-in utility for helping to optimize the geometry (Modify > Curves > Optimize...). Also, limit the use of text, if possible, as this can often produce a large number of curve segments.

• Bitmap image fills. When creating a bitmap to use as a fill, make the image as small as possible-- just large enough to give you the quality you need in your flash movie. Also, when exporting your Shockwave Flash movie, use the lowest JPEG quality you can to achieve acceptable results.

• Sound clips. Consider not including audio at all in your Flash movie - instead, put your audio in Director cast members and trigger them with "puppetSound" Lingo events from Flash. This can help because Director's SWA (MP3) compression can often yield much better results than Flash's ADPCM.

Memory

Like in Director, memory in Flash is primarily occupied by three things: the media itself, the off-screen compositing buffer, and sound mixing buffers. From Director, you can manage memory used by Flash assets the same way you do with built-in media types, using the Lingo preload and unload commands.

• Media. See Media Size section, above. Note that even though you may choose to stream your Flash movie in progressively, unless completely unloaded it always occupies the memory required for the fully loaded movie.

• Off-screen buffer. For each Flash Asset sprite, an offscreen buffer is allocated which is the dimensions of the sprite and the color depth of the stage. If the sprite changes in size over time, or the color depth changes, the sprite buffer is reallocated (this causes the small delay mentioned in Performance). Note that this allocation occurs per sprite, not per member-- so, when there are no sprites for the asset on stage, no memory is occupied; likewise, if you have 100 little Flash sprites on stage, you'll have 100 little offscreen buffers.

• Sound mixing buffers. Flash has its own sound mixer, similar to Director's MacroMix. For simplicity, version 1.0 of the Flash Asset Xtra continues to use this mixer, rather than funnel sound into Director's. If you choose high quality audio when exporting your Shockwave Flash movie, this will increase the size of the mixing buffers as well as the media size. Use the lowest acceptable audio quality.

Other Considerations

Graphics

• Rotation. If you're planning on rotating your Flash movies from within Director, be sure to account for this when designing your artwork. When an image is rotated, unless it is perfectly round, the bounding box it requires can become larger in at least one dimension. If the bounds of the movie you choose are not big enough, the edges of your artwork will get clipped as it's rotated. You can accommodate this by leaving a suitable margin of "white space" around your artwork at creation time. You can also deal with this at run-time by scaling down your sprite (set the scale of sprite ...), say to 70%, to prevent clipping.

• Resolution. The maximum image size of a Flash 2 movie is 2880 x 2880 pixels. Keep this in mind if you're planning on using the stageToFlash(), flashToStage(), and hitTest() functions, since these utilize only integer point types. Since you're limited to using integers to describe points for these functions, if you've scaled your Flash movie considerably, you may not find the point resolution adequate for your needs (i.e., one integer "point" unit in Flash coordinate space could easily become, say, 40 square pixels). Note however that several other properties, such as originPoint and viewPoint, also have floating point equivalents (originH, originV, etc.) for improved, sub-pixel accuracy.

Audio

• Mixing. Version 1.0 of the Flash Asset Xtra does not send Flash audio into the Director sound mixer. This doesn't cause a problem on the Mac, but on Windows it means that Director sounds will not mix with Flash Asset sounds. You can, however, mix audio from multiple Flash Asset sprites together.

• Streaming. We've received reports of there being problems using streaming Flash audio with the 1.0 Xtra. If this occurs, use normal sound events, or handle your audio streaming with SWA in Director.

So what's it good for anyway?

Well, I'm mostly just a programmer type, so that's really something for all of you to figure out... but here are a few things I like to use the Flash Asset Xtra for:

• Text. Create all of your text in Flash or FreeHand, export as a single-frame Flash movie, and display with the Flash Asset Xtra. It's anti-aliased, takes up very little space, guarantees pixel-perfect font fidelity on all platforms (and you don't need to worry about what fonts are installed), and you can do fun things like rotation and scaling. Speaking of which...

• Rotating and scaling stuff. There are other great Xtras which are better suited to this task for bitmaps (AlphaMania, for example, which gives you fantastic alpha channel support too). With the Flash Asset Xtra, though, you can rotate and scale any old Flash animation, control the quality at run-time for optimal performance, and stick your media either inside a Director cast or in an external .SWF file. Also, your vector art is anti-aliased and scales without any loss in quality.

• Bitmaps. What? I thought this was a vector thing! Mostly true - but you can embed bitmaps in your Flash movies. The benefit in Director: lossy JPEG compression. Make a simple Flash movie that contains nothing but a bitmap. This lets you trade off quality for enormous space savings. I used this technique to help fit my entire UCON '97 sneak demo on a floppy (including projector & 2 mins of SWA audio). Not a bad thing for Shockwave, either!

• Scrolling maps. Take a look at the Amaze demo for an example of using the Flash Asset Xtra to implement a 2D scrolling maze game. This shows how to integrate several Flash sprites into a scrolling environment, change rotation to match velocity, and implement simple collision detection among multiple Flash sprites. (Thanks, Mike Seery, for hosting these files!)

• Buttons. It's easy to create a multi-state button in Flash - now you can use them in Director to trigger Lingo.

• Gradients. Flash 2 supports both linear and radial gradients. These are great for presentation backgrounds and adding depth to objects. They're practically free bandwidth-wise and adjust well to varying color depths since they're rendered dynamically at run-time.

• Squash & Stretch. Traditional cel animation techniques such as squash & stretch are easy, since you can scale Flash sprites asymmetrically (different amounts in X and Y) while still retaining excellent quality. Set your scaleMode to #exactFit. Great for bouncing balls, logos, wild text effects, etc...

• 3D (well, 2 1/2 D) effects. Again, by setting your scaleMode to #exactFit, stretching your sprite asymmetrically, and rotating, you can achieve useful skewing effects that look kind of 3D. Try creating a simple rectangular shape in Flash (even a bitmap will do) with a white space border to allow for rotation. Import with exactFit, stretch it on stage (say, more in the X dimension than in Y), and add a spin behavior to rotate continuously.

Ok, now go crazy

The really fun part of my job comes when I'm actually done working (after shipping a version of Director or an Xtra ... and a little vacation away from my veal-fattening pen / radiation chamber, of course). That is, surfing around and getting to see what everyone does with the new chunk of code! Often, developers come up with all sorts of nutty things we never even dreamed of when designing the product. So, I'll be looking out for imaginative new projects created using the Xtra. Many of us on the Director team regularly scan Direct-L, Shocker, and of course, the DOUG User Showcase - so make sure to announce your work for all to see. Also, I'd be interested to know how, if at all, this Xtra alters your production process - and what new processes you invent to take advantage of vector graphics in Director.