Flash CS4

Transcript of the free preview lesson. Remaining lessons unlock with the full course.

In this first chapter, we're going to actually create a flash movie from scratch. It's going to be a very basic animation with just one shape moving across the screen and we're going to add a little bit of control to it. But it will give us a good overview of what's going on with flash. When we start at the program, we see this layout here with this welcome screen with a nice friendly red banner sitting right in the middle of everything. What we want to do is then create a new flash file because as we see all the rest of the interface here is grayed out, it's inactive until we start a new file. So under this create new column in the welcome screen, we're going to choose flash file action script 3.0. We'll talk a little bit more about action script later on. Now that we have a new file, we can explore what's called the workspace here. This is known as the Essentials workspace. Up toward the top of the program window, we see the word Essentials and this is a drop down menu where you can select different workspaces where all the different elements of the user interface are laid out in a different pattern. For this first chapter, Essentials is the one we're going to be using and that's the layout I'm going to use to explain all the different parts of what we see. This large area in the upper left is called the Stage. This is where everything that we're animating is going to go and it really forms the main part of what we're doing. Everything else is kind of in support of what's going on on the stage. Down at the bottom, we have the timeline. These numbers along the top of the timeline here are telling us what frame we're working with and then we also have an area here where it says Layer 1. We can add different objects on different layers and we'll get to that more in a later lesson. For now, we're just going to leave that as is. Over toward the right, we have an area called the Panel Groups. Panels are groups of information kind of put together that let us know different aspects of what we're looking at and give us control over certain aspects of our movie. The panel that we're looking at right now when we start the program is called the Properties Panel. If you're used to a previous version of Flash, it's known as the Properties Inspector as well. What we see here then, first, it just identifies our movie. Right now, it doesn't have a name. It's called Untitled. And just below that, in the same panel, we see a section called Publish. We're going to Publish our movie at the end. We'll talk about what that means. And we don't need to worry about anything here just yet. Down below that, we see a section that says Properties. So, yes, we have the Properties section of the Properties Panel, which is nice and confusing. Here it says FPS that stands for Frames Per Second. That tells us how fast the pictures in our movie go by to create the illusion of animation. 24 is about the speed of traditional movie film. If you want a smoother effect that looks a little bit more like television, which would be more like 30 frames per second, you might want to increase that. There's always a trade-off, however, in Frames Per Second, because the more frames we have, the smoother our animation looks, but the more storage it takes up and the longer it's going to take to load over a network connection. So, 24 is a pretty good default to stick with. Just below the Frames Per Second, we see the Size, 550 by 400 pixels. That is the Size of our Stage area. And if we want to edit that, we can click this Edit button. And we have the ability to change the size of our stage. Now, this is important because the size of our stage determines what is on-screen and off-screen when the movie is actually viewed. So, you want to keep in mind that you can put things on-stage or off-stage, and the size of the stage kind of tells you what is the viewing window. And we can also change the frame rate here and other aspects of the document, but we're just going to keep everything as it is for the time being. Just below where it says Size, we also see that it says Stage. And this is telling us what color is this background here. And I want to take this opportunity to show a panel that's going to come up a lot of different places and a lot of different situations. We'll take our first look at it here, and that's our Color Picker. You see this small white rectangle here called a Color Chip, and if I click on that, that brings up our Color Picker, which gives us this array of different shades of color. These are known as Web Safe Colors. They're kind of a default subset of all the possible colors that are pretty well supported by any browser that you might show your movie in. And in the upper right-hand corner, if you want a wider variety of colors, you can choose that and open this up, and it gives you the full range of all the different thousands of shades of color that you can use. But for now, we're just going to keep things as is. We're going to call attention, again, to the different shades of color here. We have a preview panel that shows us a larger thumbnail of what the color looks like. These letters and numbers here are what's known as the hex value of the color, and we're not really going to be getting into a whole lot of detail about what that means right now. I do want to call attention to this eyedropper tool, though, because this is very handy in a lot of situations, and I wanted to introduce it right off the bat. With the eyedropper tool, I can choose any of the colors that are in this panel here, or I can actually go anywhere on screen. So, for example, I like this color here, this orange color up in this icon here. I can just pick it up with the eyedropper tool that figures out exactly what the color is right away. This is very handy if I'm importing pictures that already have set color, and I want to match them within my movie. But for now, we're just going to keep our stage a basic white color, which is the default. And from here, we're going to move on into the next lesson, where we're actually going to explore the tools that we use to put shapes on screen.