1
Open the Animation Shop3 and, in the tool bar, click the "Banner Wizard" icon (or File/ Banner Wizard). Look the icon:

2
In the opened window (Banner Wizard - Background), set the fields as follows (having in mind that we'll use this exercise to reproduce the same procedures that was used for the banner on the top of this page):

in this case was chosen the item 'background image' - click on "Browse" to find your file ".GIF"

3
The following window, BW - Size: the first field, "Use a standard banner size", presents a list of standard sizes for banners - select the field and click the little arrow on the right side to open the options list. The second field, "Same as the background image", if activated, will adjust the banner's size to the image that was chosen for the background (in this case, 160 x 128px) - if you haven't defined any image for the background, that field will be inactive. The field "As defined here" presents the option to set the width and height you want for your banner: for this exercise I defined 220 x 140. Look the graphic:

4
In BW - Timing you will be able to set how many frames will be displayed by second and its time of exposition (you can redefine it later). Set also the condition of the animation: if it will have a "loop" or how many times it will 'run'. See the graphic:

5
In BW - Text you will be able to set the text that should be 'animated', in your banner - for so much, click the button "Set Font" and, in the box "Add Text" make all the definitions you find necessary. Look the graphics bellow:

6
In BW - Text Color you will define with which color to fill the text (in our exercise I defined 'white' - if you want to change the color, click inside the box with the color 'white' to open the colors palette), and/or an image or texture. See at the first graphic, the option "Opaque text", and at the following graphic, the option of an image as the text fill, in "Image text" (click the button Browse to find the image you want). Look the graphics:

the banner will have an opaque text, 'white'

you will see the result of this option "Image text" below, on this page

7
In BW - Transition you will choose which effect, among those available, you want to 'animate' the text - for so much click the arrow at the right side (under the item "Transition Name" ), make your choice, and see the result in the "Preview" box. If you do not like the effect, choose another one. Click the button "Customize" (in case of the effect that I had choose for our banner: Wheel) to opt for which side the text will 'roll'. Look the graphics:

the available effects

8
Click in "Conclude" to finalize this step and return to the AS3 work area with your new banner ready to be visualized in action, and to receive the last finishing touches, If it will be the case. In our exercise, notices that I inserted a Text-signature in the center of the banner.
If, in the step "6", you choose insert an image as the text background (see the second graphic of the item"6"), your banner will have a different look.
The graphic:

9
Other options can be quizzed and prepared by you, using the resources that you already learned how, in the AS3 as much as in the PSP. See another example of banner, prepared with the effect "Bouncing", opaque background, and with an image filling the text:

10
Notices that the text "walk" over the image that fills it, or be: the background image is static in the banner, and the text, empty, walk over the image exhibiting it during its movements. The same happens in the example of the item"9".
Personally I do not like transparent backgrounds in the making of my GIFs - nearly always I opt by define for them the same background from the page in that they will be exhibited... but if that is not the case, and you prefer a transparency, it is enough to define it during the making of the banner (see the field "Transparent background" in the graphic of the item "2" of this tutorial).
See two more examples, both with the effect "Drop Shadow" (see item "7" of this tutorial). Notice that the second banner presents a text in the up side of the animation, that was dislocated below with the meaning to make the shading 'disappear' in the lower margin of the banner (the extra text was added after creation of the banner in the Banner Wizard, by the method "Propagate Paste", explained in the tutorial "20")

Very pleasant making banners, don't you think?
Come on, folks! Work a lot and...

Have fun!

Guacira Sampaio Rocha rights reserved