Toxiclab.org

Advanced text banner in flash

20.2.2009, 18:57
Submited in: Flash | Total Views: 18180

Using this thoroughly explained, detailed flash lesson, you will see how to create advanced text banner in flash. Flash text banners are everywhere and it is the right time to learn how to create a modern text banner in flash. You don't have to use action script code to make this banner. You can use it for any web site, for advertising on the Internet... Using this thoroughly explained lesson, you will also learn how to convert any text into a Movie Clip, how to animate it, apply flash filters on it and much, much more!

Example:



Step 1

Create a new flash document. Press Ctrl+J key on the keyboard (Document Properties) and set the width of your document to 250 pixels and the height to 70 pixels. Select blue as background color. Set your Flash movie's frame rate to 42 and click ok.





Step 2


Select now the Text Tool (A) and go to the Properties Panel (Ctrl+F3) below the stage. Then, choose the following options:

1. Select a Static Text field,
2. Select Trebuchet MS as font.
3. Choose 38 as font size and bold it,
4. Select white as color,
5. As the rendering option, select Use Anti-alias for readability.



Step 3

While the text is still selected, press F8 key (Convert to Symbol) to convert it into a Movie Clip Symbol.



Step 4

While the new made Movie Clip is still selected, go to the Align Panel (Ctrl+K) and do the following:

1. Make sure that the Align/Distribute to Stage button is turned on,
2. Click on the Align horizontal center button and
3. Click the Align vertical center button.



Step 5

Call the current layer text 1. Double-click on its default name (Layer 1) to change it. Press Enter once you have typed in the new name!

Step 6

Click now on frame 5, 15, 30 and 35 and press F6 key.

Step 7

While you're still on frame 35, select the Selection Tool (V) and click once on the text to select it. After that, go to the Properties Panel (Ctrl+F3) below the stage! Then, select FIlters tab on the left side, click on plus icon and choose Blur. Make the adjustments as follows:

1. Blur X: 150
2. Quality : Medium



Step 8

After that, Select again the Selection Tool (V) and click once on the text to select it. After that, go to the Properties Panel (Ctrl+F3) below the stage. On the right, you will see the Color menu. Select Alpha in it and put it down to 0%.

1. Blur X: 28
2. Quality : Medium



Step 9

Go back now on frame 5, select the Selection Tool (V) and click once on the text to select it. Afte that, go again to the Properties Panel (Ctrl+F3) below the stage. Then, select FIlters tab on the left side, click on plus icon and choose Blur. Make the adjustments as follows:

1. Blur Y: 15
2. Quality : Medium



Step 10

Go back now on the first frame, select the Selection Tool (V) and click once on the text to select it. Afte that, go again to the Properties Panel (Ctrl+F3) below the stage. Then, select FIlters tab on the left side, click on plus icon and choose Blur. Make the adjustments as follows:

1. Blur Y: 100
2. Quality : Medium



Step 11

After that, select again the Selection Tool (V) and click once on the text to select it. After that, go to the Properties Panel (Ctrl+F3) below the stage. On the right, you will see the Color menu. Select Alpha in it and put it down to 20%.



Step 12

Select now layer text 1 and go to the Properties Panel (Ctrl+F3) below the stage. On the left side, you will see Tween drop down menu. Select Motion on it!



We're now done with the first text. Repeat this process alos for every other text in banner!

Have a nice day!

Download example

Are you a website owner?
Click here to register and submit your tutorials!

Browse by category


Most popular tutorials