Background Colour and Shape Problems

Alright, this video is all about changing the background colour and then learning about shapes and drawing basic shapes. Now you’d be inclined to skip this one because it seems quite basic. But there are some issues when it comes to flash and the way it draws objects that you should probably check out.

So were going to create our first document, we could go to file new or we could use this create new. Just make sure it says HTML5 campus. Were going to save it, I'm going to put it onto my desktop I'm going to make a new folder called adobe animate, project files, I'm going to give it a name. When you're naming your files, there's a bit of a naming convention, so I'm going to call this one drawing shapes, but were going to call it drawing and you have to use underscore shapes or hyphens. Its up to you but don’t leave spaces in there, it causes problems later on.

Great, so the first thing I'm going to do is change the background colour, is easy enough to do, its called the stage over here. You have to have nothing selected so if you’ve got something on your stage you might not see this, so you deselect by clicking in the background using this black arrow here, so I'm going to click on the stage and you can walk your way through these, these are the premade swatches, if you’ve got a specific brand colour that you're going to be working with then you can click this little rainbow wheel in the top right, click on him and you can type in your RGB colour or your hexadecimal number if you know it. I'm going to cancel. I'm going to pick a random colour, that’ll do for me. And what id like to do now is do some basic drawings so I'm going to grab the rectangle tool and you’ve got stoke which is the line around the outside and the fill so that’s going to be the center of my rectangle. So what Id like to do is get rid of the stroke, I don’t want a line around the outside. And to do it you use this small little icon here, this little one that has a red line through it. Click on that, so there's going to be no stroke and the fill colour I'm going to use, a darker grey, I'm building a city nightscape thing, just because it uses really simple shapes.

So I'm going to draw the building, great. And it all seems very normal until you start doing some other things, so say I now want to draw some windows. So I'm going to use some windows, they're going to be black. Say I start drawing them straight on the building here, great. Nothing really happens, except when I want to move it, watch this, if I use the black arrow, which is called the selection tool, if I click this. And now move it off, can you see its left a big hole in my original rectangle which is a bit weird if you're used to other programs like illustrator or Photoshop. So they like to fuse together, so I'm going to go undo, edit, undo, so control Z or command Z, undo, undo, undo. Until I get back till its gone.

So to get round that is a couple of things. The easiest way is to group it, so if I select you and go to modify group, now if I draw something over the top it wont get joined, it also does something else a little weird. Watch this, if I draw my rectangle, it doesn’t seem to appear. So what happens is things that are grouped are always on the top so you can see there he is, hello. He’s underneath so what you tend to do in flash is that instead of, so I can group him now. So I'm going to use my shortcut, which is command G or control G on a PC. And now hell be there, which is great. Or what I tend to do is this. So open this, I just draw them on the side here and move them on afterwards. So draw it, select it, using my selection tool, then go to group and then move it on afterwards. You could use layers which were going to do a little bit. But you just need to realise a couple of things. One is that if they're not grouped, they’ll slice out of each other and if they are grouped, and you’ve got things that aren’t grouped, they end up hiding underneath, so just some interesting things before you go off and start drawing stuff in flash.

Another interesting thing is if I draw a shape, lets say I draw another little building down here. And, ill grab my selection tool and move it down a little bit, and watch this, if I hover above this line, can you see my icon changes, the little arrow gets a little bent line around it. It means I can do weird stuff like this, can you see I can start dragging this, I have no idea what kind of building this is now. But it means you can do some weird stuff where you can grab the corners and start adjusting it, because this is an ungrouped shape. Once its grouped, you cant do those things, you could ungroup it and do it, that’d be fine but just one of the, would you call it a benefit, yeah its kind of handy. I tend to draw all of my stuff in illustrator first and bring it in to adobe animate. That’s totally fine, there's nothing wrong with that. Or you can draw straight into adobe animate. There's nothing wrong what that either. Just whatever you're quickest, where you're most comfortable with the tools.

Alright so before I go I'm going to go through and duplicate this guy, so I'm going to go copy, paste, I'm just using copy paste, control C, control V on my keyboard and I'm going to line these up. Now I'm going select all of these, there's an alignment tool, so I'm going to window, we go align and I'm going to use one here, distribute centres, great. I'm going to grab them all and just bump them across. I'm using my arrow keys on my keyboard, just using the little arrow keys to bump it left and right. Another cool trick in adobe animate is that I can hold down the alt key on my keyboard or the option key if you're on a mac and watch this, when I start dragging it can you see it made a duplicate so I'm going to hold alt and drag these guys down so we've got a bunch of them. Those are the windows for my very basic building. Alright, lets go to the next video.