The Art of Animation. Example 2: Flash animation

lash is a vector-based animation format by Macromedia which is very popular on today's Web. Its vector capabilities allow it to store resolution-independent, scalable graphics in a very efficient manner. Although it can embed bitmaps, most Flash graphics on the Web is built around vector objects whose shape and motion parameters are defined numerically. Although there exist sites that are built with Flash from ground up (such as the olympic.org already mentioned), more frequently Flash movies are used in more limited roles, such as an intro on a site's opening page. To view a Flash animation, you need to install a free plug-in from Macromedia, although newer versions of Microsoft's and Netscape's browsers come with that plug-in pre-installed.

The Flash format, besides its practical merits, is very instructive in how its mathematical inventory can nevertheless be used to create movies with a surprisingly live and casual feel. You may already have an idea of how difficult it is, when using a vector drawing program, to give your graphic the softness and finish characteristic of professional bitmap graphics. In "live" animated graphics, inherent vector rigidity tends to look even more disgusting. However, although Flash's editing tools are only a subset of those found in major vector drawing programs, it is still capable of implementing all of the delinearization techniques discussed above, such as acceleration or deceleration, color and transparency control, etc.

A simple example is the intro movie I've created for the site of my new web design book (in Russian). The only object featured there is the book's title (it reads "web design" in a big sans-serif and "dmitry kirsanov's book" in small serif font), and it is therefore very compact in size - about 6 Kb overall. Nevertheless, several animation techniques were used here to conceal the static character of the object and reveal the information it contains in a gradual and nonlinear manner.

At the most basic level, this graduality is controlled by the "blow up" effect of the title element being magnified. Then, its rotation makes it more difficult to grasp the message of the text and ensures that it is being read exactly in the order prescribed by the designer. Both rotation and size increase are nonlinear; note how it temporarily slows down when each of the two crossed lines approach horizontality. The final stage, where the central dot explodes into a white screen, emphasizes this nonlinearity by transforming the rotating object into something essentially new - which is especially pertinent at the end of the movie, when its main message has already been delivered and the viewers are therefore most likely to divert their attention.