Adobe Flash CS4

Adobe Flash CS4 is the ultimate tool for designing robust multimedia projects for the web. For you beginners out there before you become the next Steven Spielberg of the Internet, you should learn the basics first. Here is how you change the color of your stage in Adobe Flash CS4.

1. Open Adobe Flash CS4 and when the opening splash screen appears, select “Flash File (ActionScript3.0)”. This will open up a blank stage for you to work with.
2. Step 2

   You will notice that it defaults to white which is the most common stage color. However as your needs and creativity changes you will want your stage to be different colors. Click anywhere on your stage so you can make it “active”. Locate your properties window. If you do not see your properties window, click on “Windows” from the main menu at the top in Flash, then click on “Properties” on the submenu.

3. Step 3

   Now that you have your properties window open and it is active for your stage, changing the color is as simple as a couple of clicks. On your properties window locate at the bottom the label “Stage:” with the white box next to it and click the white box.

4. Step 4

   You should now see the color pallette as shown in the picture associated with this step. Select your color of choice to change the stage color and you are done.

You are more than likely using Adobe Flash CS4 to create animation in your projects. Well you are in luck because Adobe Flash includes a variety of motion animations and tweens that can implement into your porject. These include, bouncing, fades, drops, swooshes and so much more and the best part is they are all customizable for your needs. In this tutorial I will show you how to implement one of these motion tween templates on a very basic object that you will draw. Here is how you Apply a motion preset in Adobe Flash CS4.

1. In this tutorial we are going to start a new project with a blank stage. If you have a project already that you could use a preset motion tween on then go ahead and load your project, the concept is the same. However if you want to follow along in this tutorial and the associated pictures with each step then use a brand new project. So go ahead and select “File” then select “New”. When the window appears as to which project type select “Action Script 3.0″ as shown in the picture.
2. Step 2

   The motion presets live on as you might have guess the motion presets panel. Chances are you currently do not see this panel so we first need to display it. To do this simply click on “Window” on the main menu at the top and then in the submenu click “Motion Presets” as shown in the picture.

3. Step 3

   Before we go any further we need to put an object on our stage. You can choose any object and colors for that object that you wish but for this tutorial I chose a circle and just colored it red.

4. Step 4

   Next we need to select the shape. It will look grayed out and look exactly like in the picture associated with this step.

5. Step 5

   In your presets window select the preset motion that you wish to use and click the apply button. You will notice that it has applied it to your shape.

6. Step 6

   Go ahead and test your new motion by selecting “Control” from the main menu at the top and then select “Test Movie” from the submenu that appears. Or you could hit CTRL+ENTER if you are using a PC. Sorry I don’t know what the shortcut is on a Mac.

Adobe Flash CS4 has come a long way from its early days as a simple animation tool. Now combined with the programming language ActionScript 3.0 you can do some pretty amazing things. In this tutorial I am going to show you how to create an event listener. An event is something that occurs such as the user clicking the mouse and the listener is the function that will execute when that event takes place. Here is how you create an event listener in Adobe Flash CS4 with ActionScript 3.0.

1. Launch Adobe Flash CS4 and select Create New Flash File (Action Script 3.0).
2. Step 2

   
   

   Rename your layer “actions” by double clicking the layer name in your layers panel.

3. Step 3

   
   

   Now we start creating our code. Click on frame 1 on the actions layer, then select “Window” from the main menu at the top, and then select “Actions”. This will bring up the action script window.

4. Step 4

   
   

   Type in the code as it is shown in the picture associated with this step. The first line reads stop();. That tells flash to not loop our program when we run it.
   The second line:
   stage.addEventListener(MouseEvent.CLICK,buttonClickListener);

   registers a mouse click event called “buttonClickListener” to the stage. So everytime we click the mouse on the stage the event buttonClickListener will execute.

5. Step 5

   
   

   Now we write the code of our event listener in this case “buttonClickeListener”. This function says that when the user clicks the mouse we will print the words “button clicked” in our output window. To see the code you have to look at the associated picture with this step.

6. Step 6

   In the function the parameter “e” can be named anything you want but it must be of type “MouseEvent”. We set our return value for our function to “void” since we do not need or expect a return value.

   Now run the program by clicking the “CTRL+ENTER” keys on your keyboard, and then start clickin on the stage.

Adobe Flash CS4 can enhance your website by adding movies and videos that any Web browser can open. Most people are familiar with Flash’s ability to create animation on Web pages, but few utilize the power of creating video with Flash. Flash CS4 now includes a media encoder so that you can convert your movie taken with a video camera into a Flash compatible movie. You can use this video to enhance a website or easily share videos with friends and family.

1. Open Flash CS4. Select “File>New>Flash File (Actionship 3.0).”
2. Step 2

   Set dimensions. Select “Windows>Properties> Edit.” Change the size to the desired size for the Flash video.

3. Step 3

   Import background. Select “File>Import to Stage.” Browse to the background image. Then, select “Modify> Convert to Symbol.” Name the background symbol and select “Movie Clip” from the “Type” drop-down menu.

4. Step 4

   Import Video. Select “File>Import>Import Video.” Select “Browse” and locate the desired video.

5. Step 5

   Convert the video to FLV. If the video is not already in a Flash format, you can convert the movie within the import dialogue box. Click “Launch Adobe Media Encoder.” Select “Start Queue.” Adobe Media Encoder will convert the video. Browse to the FLV video file in the “Import Video” dialog box.

6. Step 6

   Select “Load external video with playback component” and click “Continue”.

7. Step 7

   Add a skin. A skin is the controls for the video including the play and stop buttons. Select the desired skin from the “Skin:” drop-down menu. Click “Continue” and “Finish.”

8. Step 8

   Position the video. Move the video to the desired position on your background.

9. Step 9

   Export video. Select “File> Export>Export Movie.” Select “SWF Movie” and click “Save.”

Adobe Flash CS4 is a powerful tool that gives you the ability to create robust animations. Its ability to let you layer tasks makes it that much more impressive.

Here is how you use the basic functionality to work with various layers in a single Flash CS4 project.

1. Launch Adobe Flash CS4 and create a new project.
2. Step 2

   
   

   The first layer task is to insert new layers. To do this right click on “Layer 1″ in your timeline and select “Insert New Layer” from the pop up menu as shown in the picture associated with this step. Insert two new layers. They will automatically be named “Layer 2″ and “Layer 3″.

3. Step 3

   The next ability you have is to move layers around. As you can see when you inserted layers in step 1, the system did not put them in numerical order. You can do this by dragging them into the order that you want. Simply left click on the layer name and while holding down the mouse button, drag the layer in to the position where you want it.

4. Step 4

   
   

   Finally there will come a time when you just don’t need a layer and when that occurs you can simply delete it. Select the layer from your layers panel that you wish to delete, right click on it and select “delete layer” from the pop up menu.

With any animation or drawing, background, wallpaper, etc., it all starts with the colors you choose. Adobe Flash CS4 gives you 216 colors by default without you having to do anything else. However you can create your own colors if one doesn’t exist that you need. Here is how you can create your own custom color in Adobe Flash CS4.

1. Open up Adobe Flash CS4 and click ActionScript 3.0. You want a new project with a blank stage. The stage is where your entire animation gets placed. If you are unfamiliar with some terminology in this tutorial please see my other How-To articles to get up to speed.
2. Step 2

   From the main menu located at the top of the Flash window, select the menu option “window”. A submenu will appear. On this submenu you will see an option for “color”. Select the “color” option. This will load the “Color Window”. See the picture for visual details of this step.

3. Step 3

   Now that you have the “Color Window” in front of you you can begin. Select the fill icon or stroke icon. I have circled them in red in the picture associated with this step. If you are looking to fill object with your new color the select fill, if you are just doing an outline or some other simple drawing then you want stroke.

4. Step 4

   Select your custom color. You can do this by moving the color picker (the cross in the window of the colors) around until you get the color you want, typing in the values for R,G or B (red, green, blue), or typing in the exact hexadecimal value in the box underneath the color.

5. Step 5

   Once you have your custom color selected, choose a drawing tool from the tools panel and draw an object with your new custom color.

If you are new to Adobe Flash the must understand that the stage is where all of your creativity for designing robust animations will begin. Just like any other animation software program, Flash defaults your stage to a sepcific size. However, Flash also gives you the ability to make the stage any size that you want (ok well almost any). Here are the steps to change the size of your stage.

1. Open up Flash with a new blank Flash document.
2. Step 2

   On the white area of your stage, right click the mouse to bring up the stage’s pop up menu as shown in the picture associated with this step.

3. Step 3

   In the pop up menu you will see an option labeled “Document Properties”. Click on it.

4. Step 4

   The document properties window will appear. You will notice at the top a section labeled “Dimensions” (I have circled it in red in the picture associated with this step. Changing the width and height properties will alter the size of your stage. So go ahead and type in the stage size that you wish to work with.

5. Step 5

   Once you have your dimensions set, go ahead and click the “Ok” button.

6. Step 6

   Notice how the size of you stage has changed to meet the new dimensions that you have entered.

Adobe Flash CS4 gives you the nice ability to rotate and skew objects that you create. This ability allows you to turn them to the exact angles you need for your movie clips, backdrops and so on. Here is how you can rotate or skew your objects.

1. Open up Flash and select Flash File Action Script 3.0. This example is performed in version 10 of Adobe’s Flash software. Earlier versions may need different steps in order to achieve the end results.
2. Step 2

   From the toolbar panel select an object to draw. I am using the rectangle tool. You can use any of the other objects that you wish, although rotating the circle object really doesn’t produce different results

3. Step 3

   After selecting the ibject you wish to create go ahead and draw the object on your stage. The size, coloring etc. of the object is irrelevant to this tutorial. I happen to have red selected as my fill color.

4. Step 4

   As noted in the picture, click on the selection tool and then click on your object to make sure it is selected. You will know that your object is selected as it will be covered in what looks like grayish, transparent pixels. Look at the object in the associated picture with this step to see what I am talking about.

5. Step 5

   Now that your object is selected, select the Free Transform Tool from the tools panel as shown in the picture. The free transform tool looks like a bo in which the outline is dashed (- -).

6. Step 6

   Once you have selected the free transform tool you will notice at the bottom of your tools the rotate and skew option becomes available. Click on the “rotate and skew” tool as shown in the picture.

7. Step 7

   using your cursor you can now rotate and skew your object. Grabbing and moving any of the corners of your object will rotate it, grabbing any other point on your object will skew it.

In Adobe Flash CS4 they have introduced a great new version to create various types of animation, called the motion tween. In just a few clicks you can take your images and transform them into wonderful arrangements.

In this tutorial I show you how to use a motion tween by creating a simple fade in affect of a simple object. You would create a motion tween for any other type of animation the same way.

Here is how you create a motion tween in Adobe Flash CS4.

1. Launch Adobe Flash CS4 and create a new ActionScipt 3 file.
2. Step 2

   
   

   Draw a simple object on the screen. As you can see in the picture associated with this step I placed a rectangle onto the stage. Color and size do not matter for this tutorial.

3. Step 3

   
   

   Now click on the black arrow in the tools panel, then click on your object drawing to select it. Press the F8 key on your keyboard. We need to change the object to a movie clip. The window shown in the picture is what you should now see.

4. Step 4

   
   

   On the convert to symbol window, give your object a name. I called mine “My Rectangle”. Then in the drop down box labeled “Type” select “Movie Clip” and then click the ok button.

5. Step 5

   
   

   Down in the timeline panel, on your layer, click the white empty box under the frame marked 25 and press the F5 key on your keyboard. This will create 25 frames.

6. Step 6

   
   

   Right click your mouse anywhere between frames 1 and 25 and on the pop up menu that appears, select “Create Motion Tween”.

7. Step 7

   
   

   The timeline for the layer has turned to a light blue (cyan) color. Now all we need to do is add our fade and we are done. To do that click frame 1 in your timeline for your layer.

8. Step 8

   
   

   Click on your object. On your properties panel (viewable by clicking window->properties or CTRL+F3) you will see color affect. Select “Alpha” for the style and then set the Alpha slider to 0%. In frame 1 it will make your object look like it has disappeared.

9. Step 9

   Now go to frame 25 and using the steps above, set the alpha for your object to 100%. You are now done. To run your animation, press the enter key.

Adobe Flash CS4 gives you the ability to add any type of video to your Flash program, well sort of. What I mean is before you can use a video in Flash you must encode it so that Flash has it in the format that it can handle. If you have Adobe Flash CS4 installed on your computer then you already have the utility needed to encode the following video files: .mov, .avi, .mpg., .mpeg, .dv, .asf, .wmv

To Flash’s format of .flv or .f4v

This utility is called the Media Encoder, and here is how you use it to encode your video file to the Flash video format.

1. Launch Adobe Media Encoder CS4. This was installed when you installed Flash, and it runs as a separate program.
2. Step 2

   
   

   Click the “Add” button to bring up the dialog box where you can search for your video files on your hard drive.

3. Step 3

   
   

   Now that you have added your video file it will appear on screen as something similar to the picture associated with this step. Under the column “format” choose “FLV F4V” if it is not already displayed.

4. Step 4

   
   

   The next step is to click the “Start Queue” button. This will take the video you have selected and encode it into the flash format you have chosen. You can add as many video files to the queue at one time as you would like. In fact it is recommended that you do all of your videos at one time since the process could take a while.

5. Step 5

   
   

   Once you click the button in step 4, media encoder will begin the process of encoding your video. The larger the video the longer it will take. You will know when a video file is done being encoded when you see the green checkmark under the status column.