Netscape Client User Interface Group
Date created: March 4, 1998
Date Last Modified:
This document describes design goals and principles of the animation/logo
Table of Contents
The animation provides visual feedback of network activity
The animation/logo can provide branding, and allow the user to identify
The animation/logo can provide easy access to a web-site about the product
The current animation/logo is a permanently enabled button at the far
right of the top-most toolbar.
Animation frame number and size:
For best visual results, we recommend that the number of frames not
exceed 40. The current animation in Netscape Communicator has 38 frames.
Animation resting frame
The current animation is in two sizes: 30 x 30 pixels and 16 x 16
pixels. These two sizes are designed to accommodate the Toolbar's "Picture
& Text" mode (30x30), and "Picture only" or "Text only" modes (16x16).
The 16 x 16 pixel animation is also used on the Location Bar or the Personal
Toolbar when either of these are made the top-most toolbar.
The animation has a resting frame, which is the image shown when the
animation is not running.
When the animation runs, it starts with the resting frame (frame 0)
and then goes to frame 1, 2, 3, etc. until it reaches the end. The animation
then goes to frame 1, skipping the resting frame, and continues to loop.
The animation begins when a document starts to load and ends when the
document is completely loaded. In many situations, this is within a few
seconds, so it's very common for users to only see the first 10-20 frames
of the animation. For this reason, the sequence or one of the sequences
has to be shown in the first 5-8 frames in order for users to see the motion.
A sequence that builds up to approximately 20 frames is inappropriate.
The animation generally runs at 6-10 frames per second, but many things
can affect this speed: network traffic, user events, etc. The animation
does not have as high a priority as other events in the product, so it's
entirely possible that a single frame can be frozen for several seconds.
Therefore, any given frame of the animation should look acceptable.
Animation color palette
The animation files for each platform should use the same color palette
that applies to the specific platform. (See Color
Animation file format for different
Two animations should be delivered, one for each size. The animations
should be delivered on each platform as follows:
Mac: image should be placed with sequence number as Mac resource file.
The large version of the animation can be placed in ICL8 (8bit) and ICL4
(4 bit), and small size of the animation can be placed in ICS8 (8bit) and
ICS4 (4bit) of resource file. (sample)
Windows: the animation frames should be placed in sequence on a horizontal
strip in a .BMP bitmap file (sample).
Unix: each frame should be an individual .gif files (sample).