Viewers: in countries Watching now:
Adobe Flash CS5 is the industry standard for creating dynamic, interactive graphics, and even entire websites. This workshop from expert trainer Kelly McCathran provides a solid introduction to Flash animation, beginning with a tour of the tools and interface. Plus, learn how to animate shapes and objects, create slideshows, incorporate other media into your movies, add keyframes, and much more. Each lesson takes a simple step-by-step approach—great for beginners and also helpful for more experienced users looking to develop efficient workflows—and some simple projects are included so you can test out your newly developed skills.
In this video, we're going to explore the Flash library panel. The library panel contains assets and symbols that you may use in your animations. Libraries can also contain raster or bitmap images, sounds, movies, vector art that you've drawn from scratch, imported illustrations and components. Before we start, I'm in my favorite classic workspace and I'm going to bring the library panel over, so it's one of my main group in the second column.
These double arrows that I'm seeing will expand at the panels. So now, I can click on Library and make it nice and large. And any other panels that are in my way, I can double-click to Collapse. And I can stretch the library panel looking for my contact sensitive icon. So this way when I click on My Library items I get a preview of what they are, and how I might use them on the stage. And then a fit in window and I've assigned the shortcut Cmd 0, Ctrl 0 to that.
And what we're going to do is build an advertisement. So, I'm going to start by dragging out this coffee image. I'll drag and drop it over and I'll double-click my Align panel and make sure align to stage is on. I'll center horizontally and center vertically. And you'll notice in this document, the 0505librarybegin, I've already created a background layer and that's where this coffee image will reside. There's even a little actions layer that we won't be using in this exercise, but it's helpful because this library contains a button.
And in order to make buttons go anywhere, they need actions tied to them. So, let me start early by saving with my initials, into my Practice Folder, and now I'm ready to continue assembling. So, I'm going to drag over, and I'll collapse the Align panel since I'm finished, I'll drag over this white rectangle. You can't really see what's going on because it's white on white, but I can drag and drop over and pop that down at the bottom.
So I'm just visually placing the elements. If you have a massive library, you can search your library items, or if the list is very long. I'm sorting by name alphabetically from a to z, I can click this arrow and go from z to a, so I can switch the sort order. And if I feel like my library is taking up too much room you can collapse panels a little bit more by dragging them over. The next thing I'm going to drag out is the caption, (LAUGH) one of the, what I call, Kelly quotes.
And I love to use my arrow keys just to nudge items left or right or up or down. In fact, sometimes it can be difficult to position looking at your stage and your gray area, the paste board that's when I use Cmd Return or Ctrl Enter. Now, I wanted to do that early to warn you that the actions layer we have is going to give us an error. So I'm going to go ahead and delete that layer, because we aren't going to be animating in this exercise, were just covering assembling with elements that are in our library.
So, now once I delete it, and hit Cmd Return on the Mac or Ctrl Enter on the PC no errors were produced. I'll close that up, now I am going to drag out a background for the logo and the logo itself, which is a placed Illustrator file, so when I imported that into the library it picked up that name. I'll collapse the timeline, so I get a little bit more territory and I will zoom out by hitting Cmd Minus or Ctrl Minus I'll use my Free-transform tool, and my Shift key to scale this proportionally. Now, this is where positioning can get a little bit tricky, because I'm seeing this larger white rectangle on the stage.
So this is when Cmd Return, or Ctrl Enter is kind of like a print preview, although you're not printing stuff. We aren't killing trees in the making of these videos. (LAUGH) We're doing everything for online distribution, so there we have it. Looking good, so far and that's the assembly of elements that were already added to the library. Now let's dissect these elements. We have a graphic symbol, this icon indicates graphics. I have a button that's waiting in the library that we're not going to use in this exercise, but it came from the shared library components. Window > Common Libraries > buttons.
In the buttons panel, if I expand these or scoot it over, I can see it came from the button's tube group and this was the tube gray which I elongated and edited to add my own text and made a real workable web link. So, there are built in items that flash has in Common Libraries, like Sounds and buttons and Classes. I'll close this library, and we have a captain which is also a graphic symbol that's been added, and simply a placed image, this coffee background started out as a JPEG.
The third type of symbol we don't have here, which is a movie clip, but let me show you a quick example of how something will need to be converted to a movie clip. If I wanted to animate this and this coming down. I select them both my using my Shift key and clicking on each one or I could mark select. But the danger of mark selecting is, I got my background in with it. So I'll click Away, click the White Rectangle, hold down shift and click the Logo.
I can group them, but what I'm going to do is simply right-click and choose Create Motion Tween. And when I create a Motion Tween, meaning I want to move it from one spot to another, it has to be turned into a movie clip symbol, or a symbol in general. It defaults to movie clip because they are the most complex and most open ended type of symbol that you might store in your library. So I'll hit Don't Show Again, and hit Okay. There's a symbol, and I'll go ahead and double-click to name it, and I'll name it logo and BG for background. There are other options, I can make a New Document.
And in a New Document, if I want all of these assets to build another ad, maybe with a different layout. I can click Back on my original file where I've assembled all the pieces. And where all of my library items where I can click the first item in the library, hold down Shift, click the last item. Right-click and choose Copy. You can also get to Edit and Copy, but sometimes Copy won't show up if my panels are collapsed and I select all of my items in the library. When I go to Edit, since they collapse, copy vanishes. So I do need to have my panels fully expanded for that to show up if you're not used to using the right-click.
I've already copied, but I'll do it again to be safe. I'll click on my New Blank Document, I'll right-click anywhere in the library panel and choose Paste and now I've got all the shared assets. And the last two things you may want to do is, if I go to the panel Maenu. The panel menu is four little lines with the down arrow and every panel has one, when I click it I can check for updates if any of the placed images that were in the library when I started have been modified, I see that my coffee image has been modified. So when I hit update I see a change in the contrast and color on the image and I will hit close, and just to take a last look at the library panel, I can build new symbols directly from here, I can organize them into folders. And one thing I often use when I'm finished with a project is I'll select all Unused items and then I'll hit the little trashcan at the bottom to Delete. So now, I only have the assets that I need.
The folder still remained even though the items in it are gone, so I'll click on the Folder, hit Delete again. And that is your tour of the Library panel, so practice along with this video and just eyeball it and see if you can create this simple add. We haven't finished the animation, so don't worry if it doesn't animate perfectly. All I want you to be able to do is pull things out of the library and arrange them.
There are currently no FAQs about Introduction to Flash Animation.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.