It’s dark. Suddenly there’s a flash of lightning
followed by the rumbling sound of thunder. As you wait with bated breath, out of the
distant darkness there comes the text scrolling out. And the darkness gradually fades into
a bright and cheerful scene.
No, we are not describing the opening sequence of some
video game or a multimedia CD-ROM, but a Website. Yes, you read it correctly–a
Website. And we didn’t wait for more than 30 seconds for this sequence to download
and play out in its full majesty.
Well, let’s end the suspense. This Website has been
created using Flash 3–a program from Macromedia for creating vector-based animation
on the Web. And in the hands of creative artists around the world, it’s fast emerging
as the third-generation Web publishing tool (HTML and DHTML being the first and second).
Complete Websites are now being created using Flash. Some of them so amazing in their
content and presentation that we are sure even the folks at Macromedia never envisaged it.
Flash started out as Future Splash by a company called
FutureWave, way back in August 1996. FutureWave Software was acquired by Macromedia in
January 1997. FutureSplash animator was renamed Macromedia Flash. Presently Flash is in
its third version.
Web authoring using Flash
The user interface of Flash is different from any other Web
authoring tool you might have ever used, and a first time user might find the interface a
bit confusing. Your work area is called the stage. You work along a time-line in which you
have to insert frames. It’s same as an animation or multimedia-authoring program. In
Flash you create movies. The objects that you work on are known as symbols and are stored
in libraries. Symbols can be created using the tools provided by Flash or can be imported
using any of the wide variety of file formats supported (including GIF, JPG,
PNG, etc).
The trace bitmap feature in Flash also gives fair results. The symbols thus created can be
assigned the behavior of graphics, buttons or movie clips. Movie clips are special
symbols, in the sense that they themselves can be complete animation sequences placed
within your main movie. Symbols are placed within your movie after inserting key frames.
Key frames are special frames where you can define events or the action to take place.
face="Arial" size="2">Reference sites for Flash |
You can join the Flasher mailing list by sending an e-mail Also, we have some samples on the PCQ CD. with step-by-step instructions on how to make them. |
Take a very simple example. If you want your symbol
to travel from point A to point B over a period of, say, 12 frames, you have to first
insert a key frame at frame 1. Now place your symbol at point A. Next insert a key frame
at frame 12 and place your symbol at point B. To complete the animation you set the tween
property for motion, and viola! when you play the movie, your symbol will smoothly travel
from point A to point B.
The operative word here is tweening–short for
betweening. Tweening allows you to determine the frames between the two key frames without
actually having to draw each of them. You can also tween along a path and rotate your
symbol along the way. Shape tweening allows you to morph your symbol between two shapes,
such as changing a circle into letter S and so on. You can use any TrueType font available
on your computer and Flash will convert it to vectors for use on the Web (when you publish
it). You also have full control over attributes like word, line and paragraph spacing,
justification, kerning, etc.
Interactivity is added to a flash movie by defining symbols
as buttons. A wide variety of actions can be assigned to these for various mouse events.
With these you can make your usual buttons, menus and some of the most unusual user
interfaces on the Web. Sounds, streaming or more can also be added.
For publishing on the Web, the Flash movie has to be
exported as a Shockwave file and then embedded in an HTML document. The Aftershock utility
provided with Flash does a very good job of automatically generating all the necessary
code for cross browser embedding. But if you wish to do complex things like controlling
movies across frames or via HTML links, then you’ll have to dirty your hands with the
JavaScript code.
face="Arial" size="2">What is vector-based graphics? |
A computer stores the picture of a triangle in two ways. It either stores information about every dot (pixel) which makes up the picture–this is a raster or bitmapped graphics. Or it just records the information about the three corners (vertices) of the triangle and stores it as mathematical formula–this is a vector-based graphics. As is obvious, the data to be stored for a vector-based graphics is much less than that for a raster or bitmapped one. |
To view works created by Flash you require either the
Shockwave plug-in or the ActiveX component, which are very small (by today’s
standards), are easily downloadable and install without any user intervention.
Netscape has already incorporated Shockwave as a native
file format in its browser. The Linux version of the Flash plug-in for Netscape Navigator
is also available. Macromedia has made the Shockwave file format an open file format (to
find out more visit www.openswf.org).
Meanwhile most developers are making two versions of their
sites. Flash and HTML, and have a small detection script direct the user to appropriate
page. However, you still can’t completely do away with HTML because one thing that
Flash is sorely lacking is form elements, or more precisely, the text input field (which
is high on the wish list for version 4).
There’s a general perception that Flash sites are
slow. Well, rather than argue for or against this, we’ll like to state that a Flash
site need not be slow at all because Flash is a streaming media. For example, a movie or a
site need not be downloaded completely before you can start showing it. You can start the
introductory text in the first few seconds itself. Flash also has several tools that allow
you to preview how the movie will stream at various modem speeds without having to upload
your server. It also has a bandwidth profiler which can give you frame by frame report on
bandwidth usage. So by intelligent placement of elements on your site, you can ensure that
visitors need not wait.
You can convert your Flash movie into Real Media. But doing
that will rob it of all its interactivity.
Flash Generator
Any Flash movie can be adapted for use as a Generator file.
Flash Generator is a Web server-based application that automates the creation of
data-driven Flash and GIF graphics, such as real-time headlines, weather maps, and
personalized user interfaces. Generator dynamically composites data—such as in a
stock-ticker text or in sports scores—to a Flash movie that has been prepared and
exported as a template file.