Subtitles of the Movie

As you can see, offline I've expanded this background and this is a somewhat painstaking process. Once you've done it once, you can use it for every solution you create, but I didn't want to take you through that process. I'll explain what I had to do to get here. What I did was I went into layout mode and approximated where I thought it should be. I thought the body should be down around about here and the right should be right about here. And then I went back to browse mode and I made sure my window was the size I wanted. As you can see, I've made, left a little space here and a little space here. Now, this isn't perfect for, you know, something like a dock or a taskbar, but I wanted to fill the whole space up for this example so we could have as much space to work with. You might decide to make a little bit smaller, but once you decide on the window size, you want to make sure if this is your window size right here, that you can't scroll right or down. And so what do you end up doing? Well, you go into layout mode and you move these things around. You move these all up a little bit go back into browse mode, is there a scrollbar? Yes, there is. No, there isn't. And so this is the painstaking process to get it just the right size to make sure that you're going to be able to allow for whatever you need to allow for. So, before you start this, you might want to make sure you do that and set it up for the type of screen you want; whether it's 800 x 600 or whatever resolution you might want you've decided on. For this one, if you want to copy exactly what I'm doing, if we go into layout mode, you want to use and show your object info. Ok? And these boxes right in here tell you the dimensions and location of every object. So we can click on the body part and we can see that that's 533 pixels tall. And if you don't have pixels, just click here and you can switch that. It'll toggle all the way through. So the right size I made it. I made sure that the graphic was covering the black border. I moved it instead of just down that far, all the way down there; just if you want to copy me exactly. And then you want to do the same thing over here. That is all the way to the right here. You can see the dimensions here. From the left it's 748. Now, if you're not using exactly the same graphics; in other words you copied and pasted from the Photoshop.jpg, well then you're not going to necessarily have exactly the same measurements here because you might have gotten a different size square here. But once you're done you probably want to go ahead and group these. Woops, a little bit too far there. See if we can do a little bit better there. Ok. Move that down there. Group it. Group this one as well. And then group this stuff down here. So let's use our background items. You really don't want to have them moving around, so I'm going to then, at this point, select all and then lock. Now they'll never move because they're in the right position and so spend all your time getting this just right so you can duplicate this layout for all your different layouts without having to think about is it going to fit or not? You won't ever have to come back and make modifications. Now, what we want to do next is add the different elements that go into here. What we want to do is go back to our reference. You can go back to the Photoshop.jpg and copy them out of there. What I'm going to do is scroll all the way to the top here and you can see the tabs here. There's the left part of the tab, a center and a center, two different size centers, and then a right. So we'll drag this over and then this over and then this one over. And then we can move back over here and start fiddling with them. Now, you can not resize these ends. There's a reason why they're split into pieces like this; because if I go ahead and resize this, you see how it distorts. So we're going to undo that. I can, however, resize this middle piece if I want. That's because all the pixels are horizontal and it won't distort that way. It's up to you how you do that. You can also duplicate the center piece if you want to. These actually happen to be just the size I want them. I'm going to move them in place right here, using the arrow keys. And one down. Looks like we got it. And move this up into place. Oops. One back. That looks pretty good. Once you're done, group them and now we have a highlighted tab. What we need now from the reference is an un-highlighted tab. So I'll drag these on there, move it right in there and you'll notice it has this red line right here. Now, this is kind of hard to explain, but when you create these graphics, we wanted this all white, a neutral color here. When we selected it, in order for it to select properly you need these red lines, but we're actually going to cover these red lines up with other pieces here. So you notice when we get them in there that'll cover it up and you'll never see these red lines. Now, in this case, you can see that this is on top of this graphic so we just have to send it backward. And then we can move it into place. And so you never see those red lines. And we're done. We group that. And then we move it right into place here. It might move a little bit later. That's how you move it into place right there. Ok? Now we need our bars and that's right next to the tabs here so I'll drag one of those in. Get it just to the right spot. Might want to fiddle with it a little bit to make sure it's in the right spot. That looks pretty good. And then I'll duplicate it. One, two, three, four, five, six. Move it up with the arrow key six pixels and then move it over with the arrow keys. Now, I could also use the mouse to move it. That would be just fine. As long as I don't deselect it, I'll still have smart duplicate, which I can do this way and I'll just use a keyboard command the rest of the way so we can do it faster. And we're almost there. And it's a little bit too long. Let me get this out of the way. Move that over. Got it just right and we'll go and select these bars, making sure I don't have anything else selected. I don't. You can group them. And even lock them.