Creating Symbols and Instances in Adobe Animate

Hi. In this video we're gonna talk about, uh,  creating symbols and instances. Now, explaining symbols and instances  before we get, uh, an actual see  what they do is a little tough. So let's go and make something, convert it into uh, a symbol  and then work with the instances  to really demonstrate what it does. It's about keeping file size down. Um, is one of the big reasons.

So we're gonna create a new HTML five canvas. I'm gonna save this one. I'm gonna save it into this one. It's gonna be called 19 a  19 A is members just my uh,  sequence that I'm using for my videos. And I'm gonna call this one  Symbols Instances. Great.

It's the first thing I'm gonna do. I'm gonna change my, we're gonna  be drawing a little space alien. I'm not sure why, but a spacey  kind of blue for the background. Great. We're gonna draw with, we draw  with the pencil tool before. Now we're gonna draw with the paintbrush tool.

The difference is, is that this one here,  the paintbrush tool actually paints around with strokes. This one here, very similar to the pencil tool. And we're gonna use the brush tool. This brush tool paints with fills. Okay? So we're gonna kind of like fill in the center  mass of our lal.

I'm gonna pick a fill color, make sure there's no  stroke and brush size. Okay. You can see it's probably starts off down  here where it's quite thin. Um, and I'm going to crease it up so it's quite big,  even thicker than that. Okay. Maximum size.

So can I go any bigger? No, that's about it. Okay. That's big enough size for me. And the smoothing is 50 just means it's gonna kind  of watch this when I let go. It just eases off the edges here.

Actually I'm gonna go to a hundred. Yeah, try  and make it, uh, look as nice as I can. So I'm gonna draw a little Lian. Uh, okay. It's pretty exciting. Now I could go and paint this all in,  but I could use the fill, okay, the paint bucket tool here,  it's gonna fill the same color.

Just fill that center in and go back to my paintbrush. There's a little gap there. Okay, I'm gonna give it little antenna. I'm gonna give them some feet and I'm gonna give him an eye. I'm gonna paint straight over the top. Am I gonna use the circle tool?

No. I'll use the paintbrush tool all the way through. I'm gonna draw a circle  and I should be drawing it separately, okay? And drawing this on afterwards, but I'm not  grab that color. Black the center. Let's go back to white.

Gimme this little sparkle Look. Okay, so little aliene thing. Okay, next thing I want to do is I'd like  to convert him into a symbol. Why are we gonna do this? I'm gonna select them all  and transform 'em, make him smaller. 'cause he's a bit bigger at the moment 'cause I  want lots of them on the page.

So I'm gonna go to my free transform tool. Yours might be hidden under the gradient transform tool. 'cause we used that earlier in the course. So you might have to click and hold it. Hold, hold and grab the free transform tool. What key do I hold down to reshape it?

The height and width sticks. That's right. Shift. Okay. And I'm gonna drag it down so there's a bit more,  a smaller part of this, um, document here. I'm gonna go back to my selection tool.

And what I want to do is I want to use 'em loads and loads  and what I could do is I could copy and paste 'em. So I go to edit copy and edit paste. Okay? And I could keep pasting these ones and have lots of them. The problem with it with Adobe Anime is that it's gonna be,  um, the computer's not gonna see them as the same. They're gonna be separate things  and they're gonna be, say this one here is one kilobyte.

This one here is gonna make it two  kilobytes and three kilobytes. It's gonna kind of multiply by how many times you paste it. So what we wanna do is use a trick  where we use something called a symbol and an instance. So what we do is we select them all, okay? And we go up to here to modify  and we go this one that says convert to symbol. Okay?

And um, most  of the time we're gonna use this one called a movie clip. So make sure it's said to movie clip and nothing else. We're gonna name it, okay? It's really common as well. Call it Mc at the beginning then underscore. Okay, so Mc is for movie clip.

You don't have to add this,  but it's really helpful later on when  you're trying work out who is what. Okay, so movie clip and call this one alien. And actually, no, I'm gonna call him Bob. And so he, what's happened now is  that he's been converted into what's called a symbol. And that symbol only exists in your library here. So I switched to my library and there is mc bob.

Okay? So he sits in my library. And now there's one instance of Bob on my desktop here. It's like a parent and child relationship. So in my library is the symbol, he's the parent, the one  that are on my stage. Here are the children or they're called instances.

And the cool thing about it's you can drag  by dragging this little icon here,  the little gear icon, okay? You can drag out lots of instances of Bob. Now the difference between what we did  before, um, from copying  and pasting is that, um, what Adobe animates are able  to do is that it can reference the same. So it loads Bob, okay, mc, bob, um, as this, uh, as a symbol  and say it is, let's say it's three kilobytes  for, um, argument's sake. Now it's able to replicate Mc Bob as instances of them, um,  loads and loads of times without multiplying  how big the three kilobytes from Bob. So it'd be very minimal in terms of I could put a hundred  of these out here and it wouldn't be multiplying  that three kilobytes over and over again.

That's one of the big reasons we have these things called  symbols and they're instances on the stage. There's a couple of things we can do to instances. 'cause at the moment they look very samey. So there's some things we can do to it  and there's the things we can't do to it. So we can rotate it, change the color,  change the how, the transparency. We can do that no problem.

Um, because it's essentially the same thing  with a little bit of a filter on top. What we can't do is we couldn't have, um, one  of the aliens looking like this  and another one with a mustache, another one with a hat. Why? Because they're physically different. You'd need different symbols in here. So the instances can only be like topically  changed when they're on the stage.

Now, when we'd use a symbol instance,  and there's a couple of things, uh,  obviously when it's being used more than once,  so even if it's just twice, okay,  we're gonna have this big limit when we get  to publishing in terms of file size,  it's about 150 kilobytes  and that's a real big pain if you're using images. So we're gonna try and use as much as we can  or reuse some of these symbols to keep the file size down. So that's one use. The other reason we'd use, uh, um,  movie clip, um,  or the symbol instance is that, um, we have  to use it when we're doing a classic tween  and doing animations in the next video. So if we wanna animate anything  that's not a shaped tween like we did any, uh, earlier,  wanna move 'em across the screen, um,  we have to use this one. So there's you pretty much everything  gets converted into a symbol.

Um, but these are the perks that keeps the file size down. All right, let's go to the next video where we look  to adjust these guys, um,  to make them look a little bit more unique.