Web designers usually are very creative and resourceful. That is why it is no wonder that you can sometimes see fluttering butterflies, flying elephants (yes, flying elephants, we really mean it!) or funny smileys, when you visit a website. How are these butterflies, elephants and smileys made? To create them, web designers use flash and GIF animation technologies for the Web.
And what is flash and GIF animation? Let us take a closer look at both kinds of animation.
GIF animation in website design
GIF animation is a kind of animation based on the capability of bitmap image format GIF (Graphics Interchange Format) to store several images in a single file. These images make up frames; the sequential change of these frames creates the animation effect. It is very easy to create an animation in GIF format. The most widespread way to create a GIF animation is to use a graphics editor in combination with animation software.
The principle of creating a GIF movie clip is the same as the principle of creating traditional (hand-drawn) animation. First you should create an image in the graphics editor; then you should use animation software to create animation frames that contain the modified image. Then these frames are arranged in a certain sequence. Having arranged the frames, you have to set the time for which each frame is displayed. The movie clip is ready! If you want to create smooth and realistic enough movement effect, the duration for which every frame is displayed should be about 0,2-1 sec.
If you are going to use an animated movie in web projects, its size must be not more than 25 kilobytes; it means, that you have to optimize it. The size of a GIF file considerably depends on the number of colors used in the image; to optimize a file means to reduce this number. It is possible at the expense of removal of the colors which do not influence on the quality of display of a GIF movie clip in web projects. Such optimization allows to “pack” a GIF file.
GIF animation is used for various purposes:
- for creation of web banners;
- for creation of advertising short movies;
- for creation of animated slogans, buttons;
- for creation of electronic greeting cards.
Flash animation in website design
Flash animation is a more advanced technology of animation in web projects in comparison with GIF animation. The operation principle is the same – the animation effect is created due to sequential change of frames. However, the main difference between flash animation and GIF animation is that flash animation has vector format, and GIF animation has bitmap format. What is the difference between these two formats? Let us give an example. Let us assume, that you need to draw a segment of a line that has certain width and color. A bitmap file will store information about all dots that comprise this segment in the form of their coordinates and information about the color of this dots; whereas a vector file will store information about the vector that makes up this segment: the coordinates of its initial point, its direction, magnitude, color and width of the segment. Thus, vector format is knowingly more compact, therefore it provides wider opportunities for creation of animation in web projects.
Flash animation is created with the help of a special editor. The most widespread editor is Adobe Flash (Macromedia Flash). In contrast to GIF animation, you cannot set the time for which each frame is displayed when creating flash animation in this editor. Instead you can set the speed of frame change for the whole sequence of images; this speed is equal for each frame. We should also mention such feature of flash animation creating as the use of symbols. These symbols are subdivided into three kinds: graphic, buttons and movie clips. The symbols are located in the special library; they possess inbuilt typical functions (transparency, color shading). Why is it convenient to use symbols? It is enough to create a symbol (for example, blinking eyes) once, and then you can use it in different parts of the movie clip or even in another movie clip; it means, that you will not have to waste time drawing one and the same object several times.
The sphere of usage of flash animation is wide. Flash animation is often used for creation of:
- flash sites;
- presentations;
- animated buttons and menus;
- visualization of processes and site navigation;
- banners;
- advertising movie clips;
- games;
- animated logos;
- electronic greeting cards.
Thus, animation effects make the site more vivid, interactive, attractive for the user. What to choose? Simplicity of GIF animation or wide opportunities of flash technologies? The choice is up to you. However, if you have decided to add GIF or flash animation to your web project, you should remember: the more the “weight” of loaded pages of your site is, the longer the process of loading lasts, and most Internet users can hardly be called patient.
Flash and GIF animation is actively used in creation of flash sites for getting various animated effects: animated menu and background, tooltips, animated banners etc. A flash site allows to attract clients thanks to its singularity and dynamism. However, a flash site must first of all be functional; sometimes it loses its functionality because of the user's browser settings, that is why during creation of flash sites it is highly recommended to create an alternative HTML version too.
TAGS
website design,
web design,
web animation,
flash,
gif animation,
flash animation,
bitmap graphics,
vector graphics,
banner,
advertising movie clip,
internet advertising |