Full Star Trek Animation

28.5.2009, 15:30
Submited in: Flash | Total Views: 11671

In this thoroughly explained, detailed flash lesson, I will explain to you how to create on a simple way advanced star trek animation. To make this animation, you have to use action script code and star trek image. You can use this animation for flash banner, or for some flash header. Using this lesson, you will also learn how to import any image into a flash stage and use it as flash background, how to draw circle shapes, how to apply action script code and much much more! Let's start!


Step 1

First, save the image below that we will use for this lesson.

Step 2

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

Step 3

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

Step 4

Choose now File > Import > Import to stage (Ctrl+R) and import the image that you just saved in step 1 into a flash stage. While the image 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

Create a new layer above the layer background and name it circle.

Step 6

Select the circle layer, take the Oval Tool (O) and draw a circle shape about 4x4px like it is shown on the picture below!

Step 7

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

Step 8

Select now new made movie clip (circle) on the stage and hit delete key on the keyboard to delete it.

Step 9

Go now to the Library panel (Ctrl+L), choose right click on circle_mc and select Linkage.

Step 10

In the Linkage Properties window, select Export for ActionScript and for Identifier type circle and click ok. See the picture below!

Step 11

Create now a new layer above the layer circle and name it action.

Step 12

Select the first frame of layer action and go to the Action Script panel (F9). Then, enter this code inside the actions panel:

var circles = 170;
var maxSpeed = 15;
var minSpeed = 7

for (var i = 0; i<circles; i++) {
 var circle = this.attachMovie("circle", "circle"+i, i);
 circle._x = random(Stage.width);
 circle._y = random(Stage.height); 
 var size = random(2)+0.7*(random(5));
 circle._width = size;
 circle._height = size;

this.onEnterFrame = function() {
 for (var j = 0; j<circles; j++) {
  var s = this["circle"+j];
  if (s._y>0) {
   s._y -= random(maxSpeed-minSpeed)+minSpeed;
  } else {
   s._y = Stage.height;

Test your movie now (Ctrl+Enter).

We're done!

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