Join Michael Ninness for an in-depth discussion in this video Basic layered PSD importing into Flash 8, part of Photoshop CS2 and Flash 8 Integration.
- View Offline
In this first movie I'm going to show you what happens when you try to bring in a layered Photoshop file into Flash 8. And now before we jump into those applications let's just do a brief mention about the exercise files and how you can work with those in conjunction with this training title. If you've purchased this training on CD, then the exercise files are included on that disc and you can simply copy them from the disc to your desktop. And here I've done that here; there's a folder called PS & Flash exercise files. If you are a premium subscriber to the online training library at lynda.com then you can also download the exercise files as an archive. And if you're on a Mac or a Windows machine you either you stuff it or unzip to unstuff those and again I recommend leaving those on the desktop for the purposes of making it easy to access those files when you're in the applications you're going to be using.
If we take a look inside this folder you'll see that there is a another folder for every chapter in this training title and all the exercise files for a particular chapter are included inside that. So if I take a look at Chapter 1 PSD to flash. There's the three files that I'll be using during the rest of this movie. Now every once in awhile in a particular chapter there might be a start document; you know a document that I created to help you get started so that you don't have to create a basic document. Sometimes there will be a final document as well so you can see where something should've ended up if you're trying to follow along on your own. Now of course you can always use your own exercise files if you decide to go that route. These are the files that I use throughout the training, if you want follow along with those. Now for the rest of the movies I'm probably actually going to be using Adobe Bridge quite a bit to access my files.
Bridge is a separate application which used to be the file browser and it gets installed automatically when you install any of the Adobe Creative Suite products and it's just a nice way to interact with your files, you get nice previews and so forth. I've just created a shortcut in my Favorites panel to that exercise files folder on my desktop. All right, let's begin by taking a look at a typical layered Photoshop document. Here's the first document we'll look at portfolio.PSD, number one. And when we open it up in Photoshop, just briefly take a look at how this document was created and structured. Every element is on its own layer, and very important point, you'll notice that the layers are not generically named. It's not layer one or layer two or copy of layer 2 or final layer, file copy layer I really mean it, those type of things. Every layer has logical name that's going to become really important when you later bring this stuff into flash and want to convert these bitmaps into symbols so you can address them in ActionScript or animate them or whatever. So makes sure you use descriptive names. And you can see I can just turn elements on and off and um ah just to show you how I've built this document.
All right. So let's go bring this into Flash or attempt to bring it into flash and see what happens. I'm going to switch over to Macromedia Flash 8 and I'll go and click open and we'll just use that start document that I have in the Chapter 1 exercise files folder. It's nothing special, it's just a blank document. One important point to make though is that I have made already the size of the stage in the flash document the same size as the Photoshop mockup, just so things stay in register. So whatever your mockup size for the website that you're going to be creating in the flash project, just make sure that the stage size in flash matches the canvas size in Photoshop. All right, so let's bring that in by using file import to stage or control R on Windows or command R on the Mac.
And we'll navigate to that document. So there's the desktop and there's my exercise files, in folder number one. There's that same document that we just opened up in flash earlier, portfolio.PSD. Go and click open. And there's a subtle change here in flash eight. If you've have done this in previous versions of flash and at least on a Windows, the Windows version, what would've happened is flash would have thrown up an error message that said, basically I don't really know what a . PSD file format is, would you like to try to import this using QuickTime? So it's a nice change in Flash 8, you don't get that error message. Nothing else is different here, it's still doing the exact same thing it did earlier.
It just doesn't throw up that kind of confusing dialog box before showing you the actual image here. Now at first glance it looks like you successfully brought in this document. What you actually brought into flash is not the individual layers from the Photoshop document, but the composite of this document. So it's if you would flatten all the layers in Photoshop into a single layer and brought in that composite. Now it's doing this via QuickTime so if you don't have QuickTime installed on your computer, you won't get this result. Now on a Mac you don't worry about that. QuickTime comes in every single Macintosh. On Windows, it's likely that you have QuickTime installed already, if you don't then you would need to go to Apple.com and download the QuickTime installer.
Now if I move this document around you see the bitmap in here, that it's just one big giant graphic. Now this works because the Photoshop file had a composite of all these layers saved within the document and the good news is that happens by default in Photoshop. But that actually can't be changed so let's go take a look at what would happen or how this composite is being saved into the Photoshop document. So I'll go and delete this and jump back over to Photoshop. Under the Edit preferences on Windows or under the Photoshop menu on the Mac.
There are file handling preferences. We'll choose file handling, and there's a specific preference here called maximize PSD and PSD file compatibility. The default choice here set to ask, so every time you save a layered Photoshop document after you give it a name and choose a destination for it, you're going to get a secondary dialog box asking you about you know whether or not you want to maximize the compatibility. In plain English what this is really asking you is do you want to save a flattened version of your layered document inside that layered document. And that composite that's embedded inside the layered PSD file is actually what's getting placed inside flash. So the default is set to ask, you probably want to actually change that to always and uh I'll go and leave it on ask for a now so you can see you when we do a save as, what happens. Let's do a file save as, I'll just save it to the desktop, just something we'll throw away, and uh go and click save. And this is that dialog box I'm talking about, is maximize compatibility.
If this is turned off, then you will not have that composite saved within the document. There's actually, I cant think of really any reason not to do this. So what I do is actually go back to the preferences under edit preferences file handling, and I change this to always. Always save that composite. We'll go and click okay. If for some reason you've ignored my advice and you go back over to flash and we go try to import a Photoshop layered document that does not have that composite in it. And I've got one in your exercise files here to just show you this, we'll go and grab that document, number 2 portfolio no composite, click open.
This is what you're are going to get. You're going to get an error message embedded inside the document that says this layered Photoshop file was not saved with a composite image. So again really no reason not to do that. In the next chapter I'll show you how to start addressing the issue of getting in the individual layers into the flash document.