How to Create an Animated Flash Banner

Written by arafat kazi
  • Share
  • Tweet
  • Share
  • Pin
  • Email
How to Create an Animated Flash Banner
Banner ads are like billboards for browsers. (banner image by Alexey Klementiev from

Adobe Flash is a powerful program with many possibilities. Flash can be used to make entire websites, programs, games, and user interfaces. Yet making the simple banner remains Flash's most popular use. Flash banners are omnipresent on the web. Most rich media ads are made with using Flash. This guide helps you create a simple one.

Skill level:
Moderately Challenging

Things you need

  • Adobe Flash

Show MoreHide


  1. 1

    Open a new Flash file with the dimensions of 468 X 60 pixels. This is the standard size of a full banner.

  2. 2

    Draw or type your primary element on the drawing area or "stage." This creates a keyframe in the first frame of your timeline.

  3. 3

    In your timeline, go to the frame where you want to show a change. If your animation is 1 second long and your framerate is 24 frames per second, then you will need to go to frame 24. Right-click on that frame, and click on "Insert keyframe." This will duplicate the first frame.

  4. 4

    Edit this second keyframe into what you want. If you want your text to move from side to side, move your text. If you want your shape to transform from, say, a square into a rectangle, do that.

  5. 5

    If you moved an element from one place to another, go to your timeline, right-click on the space between the keyframes and click on "Create motion tween." In Flash CS4, this command will be called "Create classic tween." If you changed one shape to another, go to your timeline, right-click on the same space, and click on "Create shape tween."

  6. 6

    In your timeline, create a new layer for each separate element that you wish to animate until you have completed your animation.

  7. 7

    Go to File/Export Movie and save your .swf (pronounced "swiff") file. This is your animated flash banner.

Tips and warnings

  • For each separate animation, add a different layer. So if you want to show a flower blooming, for example, you will have to treat each petal as a separate animation. This simplifies things later on.
  • Label your layers so you don't forget what they contain.
  • Remember to keep your files short.
  • Avoid complicating things at first. Flash has many possibilities that can be overwhelming if you attempt too much too fast.

Don't Miss

  • All types
  • Articles
  • Slideshows
  • Videos
  • Most relevant
  • Most popular
  • Most recent

No articles available

No slideshows available

No videos available

By using the site, you consent to the use of cookies. For more information, please see our Cookie policy.