Animate Your Web Site
Six Tools to Shake the Shareware Doldrums
By Gary Barker
Remember Woody Allen's analysis of a healthy relationship in Annie Hall? "A relationship, I think, is like a shark ... it has to constantly move forward or it dies. And I think what we got on our hands is a dead shark." He might just as easily have been talking about the animation mania that's taken the Web by storm. Like it or not, if your Web pages aren't in constant motion, you may have a dead shark on your hands.
For simple animations, shareware staples such as GIF Construction Set for Windows and GifBuilder for the Macintosh are more than adequate for compiling simple flip-book-style movies from a series of individually drawn images. These "GIF anims" can be viewed by just about any browser on almost any platform. But simple GIF anims are just the beginning. If you want to create more sophisticated, interactive output, you may need to add some commercial tools to your animation arsenal.
Tools in the new wave of animation generally fall into two categories: programs that offer a slew of extra features to help you more easily create GIF anims, and programs that help you create dynamic, Java-based animation applets without any knowledge of coding. These Java applets offer a more powerful range of interactivity options than mere GIFs. For example, sounds and actions can erupt during mouse glide-overs, and different URLs can be associated with each of a Java animation's individual frames.
What else do the commercial tools have to offer over their shareware cousins? They all trumpet ease-of-use, and include tutorials and powerful control palettes. Most offer a broad range of output file formats, including GIF89a, as well as proprietary formats that create smaller files that will download faster. Some offer drawing tools to help you build the individual frames in your animations, instead of requiring you to compose each frame in a separate drawing program.
While these tools raise the bar for Web-based animations, they also raise the barriers. Before choosing any of these tools, bear in mind a few caveats. Not all visitors to your Web site will have Java-capable browsers. The universe of non-Java browsers includes Windows versions of Navigator prior to 2.0 and Internet Explorer earlier than 3.0, as well as many UNIX browsers. In addition, although current Mac browsers claim Java compliance, they are notoriously shaky. Also, while non-standard animation file formats can provide benefits such as faster viewing, they may also require special plug-ins that most users will need to download before viewing your handiwork.
We've rounded up six commercial animation tools that claim both to streamline the process of creating animations and to expand the range of possibilities of what you can create. We've included both Windows and Macintosh products. (Some are available on both platforms. But we've included only products that target non-professional animators, by virtue of their affordable price, their ease of use, or both. We've listed each product's list price, although you'll likely find street prices to be 25% to 35% lower.)
Nota bene: Once you've chosen the right tool, you have a moral obligation not to litter the Web with gratuitous animation overkill-unless, of course, you're creating the "Gratuitous Animation Overkill" page. (Bear in mind another classic Annie Hall line: "In Beverly Hills ... they don't throw their garbage away. They make it into television shows.") To help you produce animations that walk that fine line between wowing your visitors and giving them motion sickness, be sure to check out the accompanying sidebar for some aesthetic dos and don'ts for your animation masterpieces.
Price $79.95
Company Anawave Software, http://www.anawave.com, 714-250-7262
System Requirements Windows 95, 486 or better, 8 MB RAM, 3.7 MB disk space, Java-capable browser
The Egor product mascot is a mad scientist who runs giddy with excitement throughout the user's manual and on-screen dialog boxes. After a few minutes with this program, you might be giddy, too. Anyone who has ever tweaked a GIF file can quickly master Egor, creating Java-based animations with soundtracks and associated URLs in no time flat. Indeed, it took very little effort to grab some clip art from the installation CD, animate a disembodied giraffe's head, have it bounce along a path, and switch between 8-bit and 1-bit color for a weird strobe-light effect.
The user interface, though it consumes too much screen real estate, is simple and intuitive. To add an element to your animation, simply click the Add button. To remove elements, drag them, as a mad scientist would, to the guillotine. (Yes, the program's kitsch quotient borders on excessive.)
Any element in an Egor animation can be associated with an effect or behavior. For example, each frame in your animation could link to a different URL for a random "roulette wheel" effect: Click on the animation and get sent to any one of 20 different Web sites, all depending on the luck of your draw. You can even mix and match, associating a sound with, say, your third frame, and an URL with, say, your sixth frame. You're the boss: You decide what moves, how it moves, where it moves, how fast it moves, and how many times each sequence repeats before stopping. And Egor offers this fine-tuned timing control with millisecond control.
Because you're actually creating a Java applet, your Egor masterpiece won't be Internet-ready until you've clicked the Compile button. After compiling, simply upload your work to your Internet account and shout, "It's alive! It's alive!" (a little demented cackling at this point wouldn't hurt).
A small preview window lets you check your work before you commit to compiling it, and you can check your work with any Java-compatible browser.
Getting Started Egor's manual is a tiny little thing that could blow away in a strong wind. But after you've glanced at it just once, you may never need to look at it again. A quick run-though of the tutorial may be all most users need to feel proficient.
The Bottom Line Egor is easy to use, in part because it's so basic; it would be a good introduction to multimedia content development for someone with no prior experience. In addition to the animation program, the Egor CD-ROM comes loaded with PaintShop Pro, Sound Gadget Pro, a trial version of the HotDog Pro HTML editor, and Netscape Navigator, all of which aid in the creation of a fully buffed Web site. The full installation of all these extras brings the required disk space up to just under 15 MB. The program's most glaring drawback is that it produces animations in only a single file format. All in all, Egor is a great way to graduate from GIF89a to Java.
The Upshot Facilitates animation and clickable interactivity.
The Downside Both you and your visitors have to be Java-capable.
The Skinny If Java is the future (and it is), Egor offers a painless path to the animated world of tomorrow.
Price $199
Company PowerProduction Software, http://www.powerproduction.com, 310-937-4411
System Requirements Macintosh 68030 or better, System 7 or later, 4 MB RAM, 2 MB disk space, Java-capable browser
Another Java-based multimedia program, WebBurst lets you create dynamic, interactive animations. Unlike Egor, it's a much more versatile applet-creation tool than a toy for weekend hobbyists. Still, it's almost as easy to use as Egor (even without a cute cartoon character to guide you through the interface), and it supports more file formats.
You'll use a three-step process to produce an interactive animation. First, you select the images and sounds you want to manipulate. Next, you select when interactivity will occur among your elements. Finally, you specify what type of interactivity will occur. For example, you could take a logo, animate it to your heart's content, and then specify that every time visitors glide their mouse over the logo, your system responds by playing a sound file. Try doing that in GifBuilder.
Java tools also offer more interactive alternatives than pure animation programs. You could, for example, create a Java-powered image map by incorporating the logos of all the major search engines into a single image, and then building an applet that shoots you to the appropriate URL when any of the logos is clicked. It's so easy to build an image map in WebBurst, you may find yourself never again using a more difficult shareware tool, such as WebMap.
To help you get started, WebBurst comes with a library of simple animations with which to experiment, such as a galloping horse and a flying bird. Creating your own WebBurst animation library requires nothing more complicated than dragging a folder full of PICTs from your Finder into the open WebBurst applet design window. A new library will appear before you, with image after image filling in automatically. Adding or deleting images from an existing library is only a little more difficult than creating a library from scratch.
WebBurst supports conditional branching (a hierarchical nesting of IF/THEN statements), and its applets can work cooperatively with other Java classes, providing limitless extensibility. WebBurst also comes with an application programming interface (API) that lets programmers write Java code and run it from any WebBurst applet.
Getting Started WebBurst boasts a terrific tutorial and, just as with Egor, you'll feel competent and productive after only a few minutes. Complete mastery of the program takes only about an hour or so of focused use.
The Bottom Line WebBurst is available only for Macintosh, and it faithfully follows the standard Mac user interface, without any of those ugly symptoms typical of Windows ports. Unlike many other programs, WebBurst is actually fun to use, fostering creativity rather than obstructing it.
The Upshot User-friendly and surprisingly powerful.
The Downside Advanced features require a strong understanding of Java.
The Skinny Costs more than Egor, but offers extra flexibility.
Price $249
Company FutureWave, http://www.futurewave.com, 619-552-7680
System Requirements Windows 95, Windows NT, 486 or better, 8-16 MB RAM, 10 MB disk space; Macintosh 68030 or better, System 7.5 or later, 8-16 MB RAM, 10 MB disk space
FutureSplash is an all-in-one solution that integrates drawing and manipulating vector-based animations in one package. Its vector-based format results in very small file sizes for the animations it creates. But its economic file size comes at a price: Visitors will need to download and install the FutureSplash plug-in before they'll be able to view the animations on your site.
The folks at FutureWave weren't born yesterday, though, so they include a program that can save Export options include QuickTime, GIF89a, AVI, and a seemingly endless litany of other graphics format, both static and animated. (However, FutureSplash doesn't yet include support for sound or Java, although the company plans to support these in a later version.) A sample two-frame, 8-bit color animation we created was smallest when saved in the native FutureSplash format (3 KB), grew larger as an animated GIF (11 KB), and bloated larger still when saved as a QuickTime file (15 KB).
But where FutureSplash is parsimonious in its file sizes, it's lavish in its array of integrated drawing tools. In fact, because these tools are so simple to use, and because it's possible to export your illustrations in the Adobe Illustrator format, you may decide to switch to FutureSplash for all your basic drawing projects. And you can forget all that nonsense about Bezier curves and their ridiculous points that have to be pushed and pulled hither and yon. The FutureSplash drawing tools are much simpler than most more fully featured drawing programs, with no blatant trade-off in control or quality.
FutureSplash also includes an interpolation feature that lets you specify the just first and last frames of an animation; the program then takes over and creates all the in-between frames. For animations of more than a few frames, this feature alone makes FutureSplash a significant time-saver worthy of your consideration.
Getting Started FutureSplash has by far the steepest learning curve of any of the programs reviewed in this article. While it does come with extensive online help and a manual that could hardly be more specific, it lacks a hands-on, step-by-step tutorial like those provided with other animation programs. FutureSplash is capable of so many things that a little hand-holding would be welcome, allowing you to gradually grow comfortable with the program instead of having to dive in head first.
The Bottom Line FutureSplash may be more difficult to master than its competition, but it also offers a richer payoff. With its integrated drawing and interpolation tools, and a choice between standard file formats or its own proprietary-but-petite format, FutureSplash provides a complete animation solution. Although it doesn't yet support Java, it does allow you to associate hyperlinks with any animation saved in the FutureSplash format, which is one of the primary benefits offered by the Java-based competition.
The Upshot Complete tool set; range of output options.
The Downside Its unique approach imposes a steep learning curve.
The Skinny If you're looking for one tool for soup-to-nuts animation creation, FutureSplash is the wave to catch.
Price $725
Company Dimension X, http://www.dimensionx.com, 415-243-0900
System Requirements 486 or better, Windows 95, Windows NT, UNIX, 16-24 MB of RAM (depending on platform), 10-12 MB disk space, Java-capable browser
Another player in the Java-applet creation tool market, Liquid Motion lets you enter the wonderful world of Java-based animation without any previous knowledge of code. Once you've built your original artwork in a drawing program, such as Photoshop, Illustrator, or Fractal Design Painter, you save your individual animation frames as GIFs or JPEGs, and then bring them into Liquid Motion. Now it's just a matter of dragging-and-dropping elements into the proper windows and assigning frame rates, looping parameters, start and stop times, and element paths. Once you're happy with your project, you hit Publish to Web Server, and your animation will be FTPed into the directory of your choice.
Like the other applet creators reviewed in this article, Liquid Motion facilitates dynamic animations that respond to glide-overs, trigger sounds, and shoot you to other URLs.
Getting Started Liquid Motion's learning curve is steeper than that of Egor and WebBurst, and part of this stems from a weak tutorial. In fact, it was impossible to finish the tutorial exactly as designed, because one of the tutorial elements provided during installation was in a format that Liquid Motion Pro couldn't recognize. (It should be noted, however, that we were reviewing a late beta version of the application.)
The Bottom Line So what exactly does the steep $725 admission price get you? Liquid Motion shines in its friendliness toward Java programmers. But for creating basic animations, Liquid Motion Pro is harder to use than its far less expensive competitors, and doesn't offer any significant advantages over them. You'll do better to go with a cheaper Java tool, or return to GIF89a entirely.
The Upshot Java junkies who already write code may find this app liberating.
The Downside It's more expensive and difficult than competing products.
The Skinny This is not the alternative to GIF89a you've been looking for.
Price $445
Company PaceWorks, http://www.paceworks.com, 415-855-0900
System Requirements Power Macintosh, System 7.5 or later, QuickTime 2.0, QuickDraw GX or the GX Graphics Library, 16 MB RAM, 11 MB disk space
While Dancer does indeed output to Java, it doesn't trumpet itself as an applet-creation tool. Instead, total animation control is this program's self-proclaimed forté. Use Dancer to execute and fine-tune animation events, sound sequencing, and dynamic text manipulation (which specifically requires Apple's QuickDraw GX technology). When you're all done, you can save your projects to GIF89a, QuickTime, and, of course, Java.
The program's user interface seems to borrow a bit from Adobe Premiere, so Premiere users will have a leg up in getting started. Dancer supports importing of both vector-based and bitmap-based images, Premiere movie files, Photoshop files, MIDI files, and many other media formats.
Getting Started Dancer ships with a tight tutorial, and is fairly easy to use. It's also fairly easy to crash: None of the other tools reviewed in this article crashed during testing; Dancer crashed twice. Dancer's Java also seemed to run slower than Java originating from any of the other products.
The Bottom Line When Apple releases the final version of its GX Graphics system extension, Dancer will be able to use that instead of QuickDraw GX to achieve the same results. Resolving problems with unreliable and cumbersome Java code will be a much more difficult battle.
The Upshot Produces nice results in animated GIF and QuickTime.
The Downside Java implementation needs an upgrade.
The Skinny Powerful features, but not a tool for novices.
Price $99.95
Company Totally Hip Software, http://www.totallyhip.com, 604-685-0984
System Requirements Macintosh 68020 or better, System 7.0 or later, QuickTime 2.1 or later, 4 MB RAM, 4 MB disk spacex
WebPainter is an animation and conversion tool that supports Totally Hip's proprietary Sizzler animation format, as well as other popular formats, including QuickTime, GIF89a, Java, ActiveX, and PICT. (A soon-to-ship Windows version will also support BMP and AVI.) Sizzler files are much bigger than their QuickTime or animated GIF counterparts, but they appear on screen faster due to streaming and interlacing.
Getting Started Upon launching WebPainter, the first thing you'll see is the Create New Document dialog box; here you can specify bit-depth, frames per second, and cel size. Confirm your settings, then click OK. You'll now see the first cel window of an untitled animation. Just as the PageMaker publishing program uses traditional paste-up as an operational metaphor, WebPainter comes closest to mimicking traditional animation techniques. For novice animators, WebPainter looks a little intimidating at first glance, especially if its palettes are all open at once. But don't be misled. Despite its power, this is a friendly program-sensible and orderly.
The Bottom Line Foolproof HTML export, interlacing and streaming, and sundry file format options make WebPainter a useful tool. It will probably be a favorite among those with traditional cel animation experience.
The Upshot Old-time film animators will right at home.
The Downside The non-standard Sizzler format requires a browser plug-in.
The Skinny An easy program that outputs to popular file formats.
BIO:
Gary Barker, systems administrator in
the journalism department at San
Francisco State University, is a freelance Web page designer.