Transcripts
1. Introduction: Do you love the software? Adobe? Animate? And have you always wondered how to work with the tools and how to animates your own style In other be any meat than this course is the right course for you. Because with adobe any meat cc you can create all the kinds of animations that you want. And I'm going to show you how to but them from scratch and how to also create animations using images. So I hope you enjoy the scores.
2. Stage: So when you open Adobe Animate, you will see that you have the option to create a new canvas here or to open an already existing animation that you have created inside of Adobe Animate. So here you'll see that you can start a new file fast in case you want to create a specific type of animation. But I'm going to talk more about the character animation in this class. So here we are going to start a new file from scratch. So I'm going to go to file and press knew. When the window appears. You will see that you have several types of animations here that you can create as well, like gain, ads, et cetra. But we're going to focus on character animation more. So here you see that you have full HD, HD for k standards. So it depends on how big you want the stage to be. And here you can also change the width and the height to a specific one that you want in case you don't think that these are enough for you. So here you will see that in the frame rates, you will see that it is 24. But you can change it to another frame rate as well. I prefer 24 because it is the most commonly used and at this basket for having a smooth animation. In case you want a smooth one or a few are more a professional type. You can also choose for 30 frame rate per second because it is the frames that you will be using for 1 second. So in this case, I will be using 24 frames per second. That means that if I need one minute animation, I have to multiply this by 60 because there are 60 seconds in one minute. Okay, so we are going to use the platform type ActionScript because HTML5 canvas is more for creating advertising or banners for business purposes. So I'm going to create this one here you will see this is the stage. The stage properties. You can change the color of the stage depending on if you want a specific color of a background for different teams. And here, you can change the width or the height of the stage. Let's say incase, you want this to responder, you see that you can drag it to the left and if you want it to be bigger, you can drag it to the right. Okay? And this one, you can also change. So in case you want the height to be less, he changed it to spawner number and then you can rather to arrive for a bigger number. In case you want this to be the same ratio, you can then lock it here. You'll see that when I changes as we change it together with the height, so that they will stay the same radio. So here you see that you can change their frames per second. Usually it's more common with dirty frames per seconds, but 24 is also a really good number. Increased. You don't want to create really long animation. You can select the 24 frames per second. Here you have the snap to object option. Okay, So right now we have a line here. So basically what does that to object us is when you create another line here, you see the more you move it. It's not going to be attached to the line right now you see like you have to really drag it there. But if you have it on Snap to object, you will see that when you drag it here, it will then snap to the line here. So it will attach to it before you even drag it over there. That this was snapped to object us. So it does align when you create to a a figure. You see that when you move this around, it will then show you if it's the same eyes as the one that you created before. So in case you don't want this, you can then select this again. And you'll see that when you move it around is not going to show you if it's the same height as the one that you created before this. So this is a very essential icon. I recommend using it because it will help you a lot in knowing the measurements. And here you also have to ruler. So here you see at the top and as the left side of your screen, or how many pixels at this or harmony in the measurement at this, always change the measurements as well. If you go to Documents settings and you go to More Settings, you see here that you have pixels, inches, points, et cetra. So if you wanted to change from Azure ML, you can always change it from there. And then you also have the lock guides. So basically when you create a guide for any animation as well, then blockage for you so that you cannot change it afterwards. And I will explain later what it means when you create guys, it's basically a line that you create so that you can assign a specific route for animation. So the system, how you work with the stage properties. In the more settings here, you can then select where you want your anchor to be when you change the anchor here. But this only works in the older versions of Adobe Animate. And then you have the scale content, which will then enable the option to scale your stage when you are working on your animation. And you won't be able to select anchor if you have this one on. So this one also allows you to lock and hide the layers. So let us then the difference between these two. And here, you can match the contents by selecting this one. You'll see that it will then have the same ratio if you change the sizes, okay? And here you can also change the stage color and frame rate. You can make this default or just change it every time that you open a new Adobe Animate documents. So in the Adobe enemy of the year to 2021, you will also see like characters, backgrounds you can set. And here you can also add sound effects to your animation, which you can do it by dragging the sound over here to the stage. So when you run it to a stage, it will then add it to your layer for you. And it depends on which frame you are at the moment. It will then start from that specific frame where the blue line is from the timeline. You can then also change it with the friends. You can then starts the sounds later on. And you can also look at the salts. If you select the loop option in the timeline, you will be able to do that. I will go deeper into that later on because right now at this more important to learn the basics and the toast before start to work with the animation.
3. Timeline: Okay, So right now you see this is the stage. And right now you will see that you have the timeline at the bottom and you have a toolbox at the left side. The toolbox will show you all painting tools or the movements that you can do before you create your character or after you create your character as well. If you want to add tags, for example, or you want to use a specific tool to draw. But it is mostly when you are creating a character that you need to use the toolbox here at the left side, and here at the bottom, the timeline is where you will create your character by choosing a specific frame. So here you will see that you can insert a key frame. And the next one will say that you can insert a blank keyframe. They are basically not many differences. If you insert a normal keyframe, you will see that you need to still draw something or you have to insert a picture or a moving character, like with the body parts separated, for example, so that you can create your animation. If you use a blank keyframe at this to seem like right now, because I don't have anything right now in my Canvas, so I need to insert a character that I can animate. So here, for example, if I choose a character, you will see that here. This one will show that it is black, and this one will show that it is an empty frame. That means that this is a blank keyframe and this is a normal keyframe, like insert this keyframe here. So if I choose this one, you will see that it will add a light gray color to it because it means that I'm inserting the frame. When you want the animation to be longer, you can then insert frames here so that it will take more time to play. Like you see that the playback line here, Joe show, the animation will extend if you insert more frames and if you don't have the frames, you'll see that it won't go further like here where it's not light gray, it's not going further. So here you will see you can insert more frames, like here, 20 frames. And you'll see that the animation will keep going and going until it starts from the beginning again. And with the 24 frames per second, you will see here that the one seconds will be above the 24 frames. So you can time your animation. If you want it to be 10 minutes, for example, you have to then take into consideration how many seconds that is. That will be 60 seconds. So then 16 multiply 24, and then you will have your animation for one minutes. This one is to remove the frames, by the way, in case you don't want the frames anymore. So you have to have a frame that they are at the moment so that you can remove it. Otherwise it will be this Abel's like here you see, I don't have any frames here, so it will just be disabled. And the onion skin is basically to show how the movement of the animation is. So here you see you can extend this green S4, the future movements, and the blue is for the past movements. So if I M here, I shall be seeing the movement of the past and the future. So if you insert the keyframes, then you will see the blue color, which is the past keyframe, and the green color, which is the future keyframe. Like here, this is done the next action and this is then the next. And this is the end, the next. So it will show you one keyframe in advance and one keyframe in the past. Especially if you're in-between them, you will see a blue and a green as well. So this is done with the onion skin. Thus, if you're not certain how the movements are in-between, you can always use the onion skin to highlight it. So we have three types of twins here. And you can see on top of the timeline. And I'm going to talk about them explicitly in the next few videos.
4. Workspaces: There are several types of workspaces in Adobe Animate. And you can find them here at the top right corner, just right next to the buttons will minimize your window. And here you will see that you can press on this square here. And you can basically see suffer all defaults types of having the workspaces. So here you see the animator workspace. You see basic. You can see classic for example. And of course, you can also move the timeline and a toolbox around. Anything that has this button here that says you can expand the panels, can be moved around, so the timeline as well. So let's say if you want the timeline at the bottom instead of at the top, you can drag it here. Or you can also drag it here at the site. When you see this blue color, it means that you can drag it there and it will then stay there. Like so. And in case you want it to stay somewhere, you just drag it to the place and you can then left-click here on the right end of the timeline. And then you can select to lock it. So when you look at right now, you'll see that it is impossible to drag it around. In case you do that accidentally all the time. You can then lock it. This is then how you can move things around. And the same goes for a toolbox. You can always move it to here. For example. Like so. You can move everything around. And in case you find that This battle, to have the original workspace back, you can always select this button here at the ends of the defaults option. And you'll see that it will ask you if you want it to be the original layout and then you select Yes. In case you still want the other type of workspace that is not here or not default menu. You can always create your own workspace and then name it as well, and then save it. So for example, if I name this mine, and then you save it here. You will see that it will go here at the bottom. And then you can select this the next time you log in as well. And if you don't want it, you can always delete it or reset it again. So this is how you work with the different types of workspace. And there are differences between the workspaces like in the designer. They will fixate more on the colors being visible and on the essentials. You will see only the basic tools. And you can also go to Developer where you will see the coding and everything that you can do. So basically here, for example, you can then at the bottom. And here you can also add other types of interface for your websites because it's more fixated on the making of a website when you use the developer default. So the sustained the differences between different types of workspaces. So I'll just go back to basic. And in case you want to add more stocks, you can always go to the top here, where the top of the window is. And you will see here that you can open, for example, Brush Library, the layer of depth to the actions, the swatches. So swatches is also selecting colors. Like here you see different swatches. And you can also add the history two ears like here you see, when I opened my history, it will show me everything that I did from the beginning of opening the Adobe Animate. Right now, we have the workspaces covered. I'm going to explain to you in the next video how to work with the toolbar.
5. Shortcuts: So before I explain about the shortcuts that you can add it in Adobe Animate. I want to, I want to mention specific class that will be used very often in Adobe Animate. It will make it a lot easier if you knew these shortcuts. So first of all, one shortcut I use a lot is the copy paste one because it is easier when you have copy something and paste it. So let's say, for example, create a rectangle over here. And you see here at I have this rectangle. So I'll create a new layer. And I want the same rectangular there. It will be easier if I just copy this and then paste it over here. So I'll just copy. And here exactly our paste in center. And here you see, you will get to the scene. And in case you did a mistake, you can always press on Control Z or Command Z, which were then undo everything that you have done. So it can even under it until the beginning. Those are shortcuts that are, are really handy when it comes to Adobe Animate and 4. And in France, you can press F5 on your keyboard. You see here that it will add a lot more frames for you and add a keyframe. You can press F6. So right now you see it there will be an empty key-frame because I don't have anything on it. But in case, for example, here I create a rectangle again, and I go here, you will see that when I press F6, it will then create a keyframe for me. The difference is that this one is black inside of the circle. So that means that the keyframe has an object in it, or at least a character so that you can start any meeting it. Okay, so in case you want to insert a blank keyframe, that is F seven. And in case you want to convert an object to assemble like a graphic or a movie clip symbol. You can then press F8. That is also a really convenient since you will be working a lot with symbols if you work with the classic and the motion tween, but also any animation that will take longer to meet. And something else that you will want to work with us, wow, is Control minus or the command minor. So right next to the backspace key on the keyboard, you will see that there is a plus and a minus. So basically a few person Command or Control. And then the minus, it was on the stage or the converse. And if you press Control or Command Plus to zoom in the sage Canvas, this will help a lot when you are, for example, drawing or when you want to look at the animation properly. If it's moving correctly, for example, or here. If you want to use the rotation tool, it is also really important. So you can then press on. Shift H to move it around like so. Or if you want to turn it around. And also when you have your rectangle here, it is also really nice to be able to work with the Shift button so that you can scale it up and scale it down equally everywhere. That is also a shortcut that I recommend. If I want to move something to the other side, you will see that when I press it and I move it with the mouse, it can sometimes go up and down. You can use the arrow to drag it to the other side like so. So that you make sure that the top and the bottom is at the same position, but it's only the object is more at the right side. So now I'm going to show you how to use the keyboard shortcuts. Here you see that you have different types of commands that you can select from. And all these commands have for shortcuts or most of them. So in case you want to add a shortcut to any of these commands, you can click Add here by selecting the command. Or you can double-click here and the shortcut, and you can then add the lateral here. You see that nothing happens when I At any letter here because I have it on costume. So what I need to do is set it to default. And in case you already have it on default, then there will be no problem adding your shortcut. So let's say I select Shift D. You see here at the Charcot, Shift D was already a useful command to global transform. And it has been removed from that command. So you can either go to conflicts so that you know which command it is. So here it will bring you to the command that already has that. And they have eliminated the shortcut here because you use it for that shortcut. So you can either undo it, it will go back to the comment that it used to have. So these are two things that you can do when you already have that command. So it is not possible to have same shortcut F4 to commence. And that this then how you work with the shortcuts and incase you really want to add it. You just select Add here and it will then save it for you and add it to the Charcot of that command. Okay? And when you have selected something, for example, the rectangle here. And otherwise you can also go to the minuss here, and it will show you the shortcuts at the end of each of the function as well. Like so, like here, you can also insert new symbol here. And you can create the symbol from scratch instead of changing the drawing to a symbol leader on. That's also possible. Okay, so this is then how you work with the shortcuts.
6. Tools part 1: Selection tool, Free Transform, Gradient Tool and Lasso tool: So I'm going to explain the first three tools here in Adobe Animate. I'm going to create like a rectangle over here. We have the selection tool. And with the selection tool, you can just select everything. But you see right now that it has left an outline behind. It happens that when you create a shape, there will always be online unless you selected here and select Done. So. Here for example, select None and I create a new one. You see then this one won't have any outline. Okay? But if you have an outline in the square, you have to double-click it so that it'll select everything. And not only the inside of the square. That happens, especially when you have something as a rod drawing and have not used an object drawing mode or a symbol. So if you want to use the object drawing mode when creating this, always select the object drawing mode. So when you select here the square, you'll see that there is a object drawing mode here. And when you select it, you'll see that when you create the rectangle and you move it around, it won't affect the outline at all. Because here you see whether it is raw. It has these dots and here it will not have it. So that's the main difference when you use the cursor or the selection tool to select some objects. Okay, so the next one is the selection tool. The difference is that with the Selection tool, you can change the shape. So here, when you select it, you'll see that at the corners there will always be dots that you can extend. Like here. You can extend this more at the right side. And here you can extend this as well so that it will look like it is a another shape. All right, so, okay, so if you want to use the free transform tool here, you'll see that you can scale something up and down. So my scaling up, it means that you increase the size and by scaling down, it means that you decrease the size. Okay? So let's say here, when I scale it up, you'll see that it will become bigger like so. And in case you have in the middle, it will change all sides here equally and the height and the width as well. In case you want to change the width like this. You can also do it by having shift on. So if you have shifts, you see it will change the same size as well. But let's say if you have the center point or pivot anywhere else like here, you see that it will then change on all the other sides besides we are the preferred or center point, yes. So in that case, you can also use shift and you'll see that it will change our parts equally. And if not, it will then change only the other size dramatically and not the one we are. The center point is the same. If you have it here at the top, you'll see it will change all the other parts and not the center point here where the pivot is, unless you press on Shift and then it will change all equally. Okay, So that is how you work with the Free Transform tool. And going to the next one, we have the Lasso tool. So let's say I have a square over here. I select the Lasso tool. You'll see that it will select this part here unless it is on object drawing mode. So because I have it on object mode, it will not work when I just select it with the lasso tool. So I can also go here and double-click on it. And you'll see that insight. I can then change the shape by selecting a certain point here, or like selecting this area specifically. And I can also use the polygon lasso tool, which will then select a sharper corner. And you then double-click for it to select the area. So that is the difference between the lasso and the polygon. Lasso is more round and polygon is more like sharp shapes like a rectangle or a triangle. In the next video, I'm going to explain more about the mantle.
7. Tools part 2: Magic Wand and Symbols: So we are going to talk about the magic wand tool. This tool is only available if you have an image that should import to the stage. When you open an image, make sure that you choose to option Import. Importers teach instead of open, because if you open a document, it needs to be an Adobe Animate document and it cannot open an image from there. So you have to go to Import, import the stage. You can also import a library, of course, and if it's a video, you can import that as well. In Porto library is basically that they will import it to. Here where your library is. You will see all your images over there. So let's say here I import to stage. You will also see it in the library. So I'm going to select the free nights like this, for example, this is the body part only. You'll see that it will also be available in the library. You can also import a little library first instead of seeing it on your stage. So here if I import it directly to the library, no difference is that it will then show here and not on the stage. And of course, if you have the same name of the picture that we were in the library, it will make a copy of it. Okay, so right now here, you just drag it down to the stage and you will see the image on your stage. The same here. If your imported to the stage directly, you will see it here in the library as well. So it's up to you if you want the airport, it's their amplitude stage or to the library, I prefer importing it to the stage. And what you basically need to do for the Wenzel to automatic ones to function as you right-click on it and you break it apart. Or you can press on control before shortcut. It will always show the shortcut at the end of the function. And if you don't like to use the right click, you can also go here to modify, and you go to break apart as well. So basically a lot of their functions are here as well in the windows. You just have to go to these menus. So right now a few brachial apart, you'll see that it will then select a specific color. And that is basically how you then work with the Magic went. And you can see as powering your break some two apart and we'll go to the background. So another thing that is disadvantage of breaking an image on top of another image is that when you selected here you'll see that it has also selected the one that is supposed to be here. So it will also select the background with it. So that is one disadvantage of breaking apart the image on top of each other. So in that case, mixture at the images are always separated because otherwise they will select also in other parts of the image. So for example here. So for example here if I insert this head and imports this one, you'll see that when they are broken apart like this, if I select a specific parts and I drag it around, it's not going to affect anything here like this you've seen it doesn't affect anything there. But if I drag it here and I selected again, you'll see it will select this part of the head, so make sure that we knew have it broken apart. It's not on top of each other. And otherwise you can always make it back to a normal image like the one that you had without breaking it apart. You can convert it to a symbol, for example, like here, you see that you can select a movie clip and button or graphic. I'll explain what those differences are. So the graphic is the one that is most commonly used for tweening. That is because the traffic has more functions for the twin. So let's say for example, I change the name, change it to graphic right now you see in the properties, you will have the frame picker and lip sinking. If I didn't change it to a graphic, you will have other selections. So let's say a break apart again, uncovered the symbol, and this time I changed it to move the clip. You'll see that when I go to the properties here, you will have other functions here in the properties. So basically, for a character animation, it is better to use a graphic. And if you are creating advertisements or so, it is better to use a movie clip. And bottom is a better option for when you are creating a web sites. Okay, so that's the main difference between the three types of symbols. And if you don't want this to be a sub more, you can also make it a drawing objects. So Here you go to modify. Instead of bitmap or symbol. You go to combine objects and you select union. That is basically a drawing object that so with a drawing object, you cannot insert any other layer inside of it. While with symbol, you can always insert a twin inside of the image. Because what happens is that when you make it a symbol, you can always create an extra twin for it. So here, if I double-click, you'll see that the layer will still be available. And I can then create an animation inside of symbol instead of having it on the general timeline, you will have a lot more space to do that as well, because when you are inside of the symbol, you can create a lot more layers and lots more twin. Then when you are outside and you don't have to work with a super long timeline as well. This is the same as when you use these assets, for example. So if I delete this and drag this puppy out, basically, you see here that in the layer of the puppy that is unlimited and you don't see anything here in the timeline. But if you double-click and go inside, you see that here. You'll have all this tweening, etcetera of the popular Ronnie moving. And basically it won't work if you have no frames in the main timeline. That's why it's also important to add more frames. So instead of adding it manually here, you can also go to, for example, to 10 frames and press F5. And you will see then that you have this action over here. So if you play it, it will then have this action until the 200 frame. In case I select them all here, my parcel on shift and I remove the frames. You'll see that nothing will happen. Basically because it's one frame. Nothing happens. So no matter what, you still have to have the frames there for it to play. But it will help. If you insert the motion or the animation inside of the character when it's a symbol. So this is only available when it's symbol. If you have it on a drawing objects you cannot insert ending inside of it. With some more. You can do more then with a drawing objects. But this is of course, if you're using a classic tween, if you're using a ship tween, it's better to just draw it from scratch and then you move the body parts separately. I'll be explaining that more later on. So I'm going to move on with the next tool. And that is the classic brush tool.
8. Tools part 3: Brush Tool: Welcome to another video. In this video I'm going to talk about the Brush tool. So here with the brush tool, you'll see that you have several classic brush options, which will then change the shape and the size of your brush. If you want to change it to, for example, a rectangular form, we select this one. And otherwise you go with the classic one. And here you can change the size of the brush depending on how big you want it to be. I recommend having it at four. That is the ideal size for me at least. And if you want the smoothing to be better, you select this and increase the number. I'll rather have it on a really high smoothing. Because if I have it on a lower smoothing, you will see that the lines are going to be very messy. So for example, if I draw something here, you will see that when I draw something here, it will be a lot smoother. Because if I have it on a lower smoothing, you see that the lines will be a lot more bumpy like here. You see, if I draw it with less molding the line, so be a little bit like bumpy here. You can see the difference. And here you can change the brush mode. So for example, you go to paint fills. You can then draw in the filename. So if I, for example, have a filling over here, I go to my brush tool again. And you see that I can then paints the fill. So if I select another color here, let's say green color. And then I painted inside. You'll see that it will paints everywhere, doesn't matter if it's inside or outside the shape. I can then also paint behind it. You'll see that it will appear behind the shape instead of France. And but I can also do is paint the selections. So if I select this specific area, I can then draw only here in the selected area and not outside of the area. Okay? And then it says that you can paint inside books. It will be able to paint it wherever it starts. So if I start outside, you'll see that that will be my insight. And if I start drawing it inside of the circle, you will see that it will only draw the inside and the outside of the circle. So that is then the difference between the paint modes here. With the object drawing mode is basically when you want to create something that will make it easier to separate, to create different layers. Here, you will see that with the drawing mode, it doesn't affect whatever I have drawn on the other end. Like here you see everything I have drawn here wasn't on a triangle, so this is a rod drawing. And this one here will be separate because it's like having a group of different objects when you draw with the object drawing mode.
9. Tools part 4: Asset Warp Tool: Welcome to another lecture. In this lecture I'm going to explain to you how to use the asset warp tool. So with the asset work too, I'm going to also use the classic tween so that we can create a motion for our drawing over here. This is the nth results. So first of all, what I did was I created this with the line tool. So I use my line here. The stroke is colored green because I want it to look like a seaweeds. And you can increase the stroke size here. So it depends on how big you want it to be. But I think around 20, it should be fine. So here we create the normal line, one over here and then one over here. Okay? So with the asset warp tool, you can double-click on the object and you'll see that it will create this dot over here. And this dot is basically to move it around. If you want to create other pins to be moving and curving the object, you can always create one here. So for example, if I create one here and here, you will realize that the arms are not going to move from the body. Okay? So right now, if I create one here, you see that it will only curve it like this. It will move the bottom of the body. But basically you need to create one here as well so that it will stay stable. Like here. You see it's a lot more stable. But at the end of the body here it's not really stable yet, so we create one here as well. So right now we can then drag it around without it affecting the bottom of the pin. And here it's same. You see that it will move to the top as well. We don't want that, so create a pin at the top as well. The same here and same here. Okay? So right now we can then curve, this curve is like this, okay? So this is then how it will look like. And then we can add the classic tween for eight. So if you're not certain, if this is the right layer, you can always hide it so that you are certain that it is the seemly you here. So for example, here at the layer number 2, you can see if I click on heights, it will hide the seaweeds. So. Right now I'm going to create a classic tween. And what I'm going to do here is I'm going to select the seaweed. Again. I insert a keyframe here. And basically I do the opposite. So I curve this to this end, like this. And I'll do the opposite here as well. I'll curve this like so. And this right here, you can also call this part and this new coffee like this. Okay? So penalty curves that you can create by creating these pins. Okay? So you see right now that there are several dots in between, that means that the classic twin didn't work. Okay? So you see that when you create new pins, it's not going to work because in the previous keyframe, there weren't these pins. So what you need to do then is remove the classic tween first and then you add it back when you create new pins over here. Okay, So something that you need to know is that when you create the animation with the asset warp tool, you have to make sure that when you go to the Properties panel in the object section, you go to that bottom here. You will see the option for warp. And basically if you don't want to see all the insights of the mesh, you just disable this and you'll see that it will then not show you all the next insight. Okay? So that's for official purposes. And another thing that I recommend not to do is to between the handle mode. So here you see that you will have the fixed option. And basically what it does is when you then play it, you'll see that it will ruin the animation because you will have the dots here in-between. So just make sure you do not select the Open option. It looks like it is moving, but if you move something with it in the fixed handle mode, it will make it stall. So basically here if I select some of the again, you will see that it's not going to be moving smoothly like so it will only change when I am here in the last keyframe. Now here if I play it, you'll see nothing will happen with the seaweed. So make sure you do not change the handle mode when you already have the twin there. Okay? So right now it stays at open. So that the standards, something that you have to be careful when you animate with the asset Warp tool. Okay, Thank you for watching. And I'm going to the next video where I'm going to explain how to animate the bubbles.
10. Opacity and stage color: Welcome to another lecture. In this lecture I am going to show you how to create the animations of the bubbles. We are going to start with changing the solid color to a lower opacity. So to do that, we are going to select the solid color here. In the drop-down menu. You will find late after non select the solid color. Right now you have it at black. So if I choose white here, you will see that when I selected here, you have the option to change the Alpha. So I have changed the Alpha-2 around 50 percent. And with that, I'm going to create the Bumble. But you see that there is still a stroke here. So in the stroke, make sure that it is none. And then you can create your bubble over here. Basically is half transparent at the moment. And you can make it less transparent and free ones. And with this, you can then start animating it. So I have created several here, so it's different sizes and you see that they come from long distance. So I create a more at the bottom so that when one stops, the other keeps going up so that it won't look like the bulbous abruptly stops. Okay, so I created basically a lot of copies of this layer. What you do is you select it here, you right-click on it, and you duplicate the layers. So we can duplicate them. You were then gets the same layer, but it will say copy at the ends. If I drag this more to the right side, you will see the name. You see here. Copy, copy, copy. It will then tell you how many times it has been copied. Okay? So if it's the same layer, you will see as well here at the color that it is the same. If you select this rectangle here, you will see which one it belongs to because it will show you the color of this rectangle in the outline. Okay? So right now I'm at classic tune to all of them. And here at the end, we can press F6 for shortcut to make a keyframe. Okay? So what it does is at the end, you see that it didn't move up yet, so you have to make sure that it moves up at the end. So this one is here. So it should be moving up at the ends. So this one here should be moving. This one. So this one is the one at the bottom. Okay? So, okay, So this one, since this is here, we can then move this and this. We can just drag and mortar from one. This one. Okay? Basically the point is that when you create bubbles, it shows look like it's this tapirs and it's also moving with the water, with the string. And at the end, the bubble should be disappearing. So I'm going to set all of them here. And in the properties panel, you'll see that there is an option to make it invisible by going to color effects here. You see that you can select alpha and the alpha, you can select 0% or whatever is in between. So I'll just select 0%, but this one actually should be 100% because this shouldn't be disappearing. Okay? And the bubbles. So right now if I play it, it showed, then show that the Obamas are disappearing and also moving. You see that one of the bubbles are only disappearing. So one of them isn't correctly there. So lets me change it to move 100%. Okay, So this one, is it, this one should be going on. Maybe I can move this parts more to the bottom in the beginning and see how it looks like. Okay, So not really should then. Okay, so in case you don't want something to move like in the background, for example, you can lock it here so that you don't have to deal with it. Okay. So let's see patient to go more to the top. Okay, So basically this is then how you can create the motion That's the bubbles are going to the top like so. And these are all the effects you can create as well with the bubbles. Something else that you can do instead of locking the backgrounds. You can also change the color of the stage in case it's one color. So let's say right now you see I have this on the keyframe here. I just select it and I can then delete it. So instead of using the layer here, you can also just select the stage here you go to Properties. And when in the properties just under the documents settings, you can change those to each color. So let's say for example, you wanted to be this blue. You can then just change the stage color. This only works if you want to have one specific color during the whole animation.
11. Ease in or out using classic tween: Welcome back. And now I'm going to explain about the classic tween more in depth. So here you'll see that in the beginning, it starts off with the same speed as at the end. So there is this thing called ease in, ease out with the classic tween. So let's say for example, if you want the bubbles to be moving slower at the end. Here, you can go to the frame and see here in the tweening, you have to affect classic. So instead of classic East, you can go to ease out and you can make it slower and face where it ends. So here it will show you how it ends right here in the squat cubic corks. It will show you where it is fast. Basically, when something is fast, it will rise up a really steep. And when it is low like this, you see this, there is no movement at all here because it's just one straight line. So here it will then start easing out. So it will start going slower at the end here where it starts curving more like a straight line. Okay? So let's say here, I select the classic East. You see that the intensity, you can change it here. So if you go to right side, you'll see that it was slow at the end. So the slowest that you can go is 100. And if you go to the left side, which is ease out, snows, you can go in the beginning is minus 100. Okay, So I'll leave at 100. And you see then that when I play it, it will then go slower at the end. Instead of having the seeing. Instead of having a sync speed does not have a keyframe because the background is moving as well. That's not the point. Okay? So right now you see that at the end it should be slowing down. And in case you want to see a difference without it's slowing down, you can go back to here. At the end. You just change it back to 0. And you can see basically the difference when it doesn't have any easing out. And you can also go for the ys. Basically that it will do the opposite. Here you can also separate them if you want them to count individually. So you see here that the ease in it's only here at the end. So let me add it's also to the beginning. Here. I'm also going to do the same. Let's change this to 130 aswell to 100 to ease it out. Okay. You see by now in the end, it's finally shows that it will slow it down like so. But then you don't see the disappearing off the bubbles. So with the Alpha, you still need to change it to 0, but you see it will be impossible. So here you change it back to 0 at the end, and you'll see that it will then disappear again. Okay? So when you add the ease in and ease out, make sure that it's in the first keyframes and the last keyframes. And these are also things that you can use with the classic tween. You can oriented paths, which I will show you in the next video, how you can use it. It is almost something similar to motion tween where you have like a certain line. You can see exactly how the animation is going to move. And scale along path means exactly that you can minimize the size or maximize the size. Like make it bigger or smaller in the past that it tests the twin. So it can go from small to be or big to small. So it's seen as my new skill up something or scale down. It's like do this and it will scale up. And you do this, it will scale down. And color along path for when you want to change the color. And if you want to sync the symbols for grain, you want the symbols to move together. So I know these are things that you can do. And in the blend mode, of course you can do this, which is also available in Adobe Photoshop. So here you see, you can change the color to a darker multiply. It's mostly just a screen mode. So you just change the color of the object to, for example, infeasible or a darker mode, et cetera. Or you can mix it with the background. It usually for specific effects, like when you want to create hardware, for example, or if you want to create an optimistic animation, you can then use like under modes. And here you can add sounds as well. So here I'm just going to leave it to normal. If you use screen mode, it will make it more like a sunny mode, which will make it look more positive. And of course darker and multiply is more for when you want it to look more misterioso or harder. But of course it can't be used. We knew already. Have it in the motion, so you have to make sure it's used before you add the classic tween. And in the next video I'm going to explain more about the oriental path option in the classic tween properties.
12. More about Classic tween properties panel: Okay, welcome to the next lecture. So in this lecture I want to show you how to create a, an animation or a motion using the classic tween and using the oriented pass option. So here you see that the layer here is actually a guide at the moment. So normally it will appear like this. You will see that we have a layer for path and the B. So this path, you have to draw it with the pencil tool for it to work. First of all, you draw the path here. It depends how you want the path to b. So when you select your pencil tool, you can go to Properties and you can select what you want in the pencil tool. Here if I started drawing it. And you see here that you have the tool option and a frame and a doc. He showed how you should go to the Tool Options. And here and two option you see that you have a drawing object mode, object drawing mode. And you don't have to select that. Actually it's better to not use it because if you use object drawing mode, it's not going to work with the path movement. So you have to select without object drawing mode. And here in the smoothness, you should select smooth instead of straight on. Because when you straighten it and you draw some curves, you will see that it will have too much of these corners. And we don't want that. So make sure that you have it on smooth option. So with the smooth option, you can then start drawing the path like so. You can also make it a little bit lower so that it will look like. It will reach the knife. Like so. It's not the best option to draw it with the mouse, which I'm using at the moment, it's whether to have a drawing tablet. But just for this video, I'm going to use the mouse to draw this for now. Okay, make sure that the line is consistent, like no irregular movements in the line, so that it won't glitch with the animation. Okay? So the stroke size can be any size that you want, but I rather have it at three. And here in the pencil options you can also smooth it more. Like for example, if you have a at 100, you'll see that it will be a lot smoother than you and you have it at 50. Well case. So here, let's delete this part over here. Let's see left-hand k. So I'll just delete this part. Okay? So when we are. In the path, you will see that everything should be smooth right now. So we add a classic tween to the BLE year, which is for this one. And here in the keyframe, you'll see that when you go close to the line, it will attach itself to the line. And that means that it is working. So you should be able to do that. And first of all, you have to go here and you can right-click on it to select the guides. And if not, you can also double-click on it here. And you'll see that the options will appear here to either atom mass folder or guides. I will explain later how to work with the mask. So right now I'm just going to use the guides. And you select the layer of the B and make sure it is inserted in the guide layer so that it will work. Okay, so right now you see that when I drag the b out, it will attach itself to the pivot here, to the starting point of the line. Now, okay? So when I am at the last keyframe, I want it to actually be here at the end. So make sure that it will reach the end of the path so that it will work. So right now you'll see it's already works when I play yet. And you see that the BS going to go like this. Okay? So there is another option as well. So if you want the B2B moving all around, you can go here. And you can then select it like so, make them be more vertical leaning. And then here in the keyframe we are the rest of the classic tween. You select oriental path in the first key frame and the last keyframe, you select oriented plans as well. So basically, what happens is that it will look more like it is moving together with the past and not just like its body is on one position only. So another option is also to have the motion guides Go color along paths. So here the option, if you say color along path, you will see that it will have a difference of color when it goes here according to the path. So let's say I select a specific part of the path, like this part, and I go to the color of the stroke, I can then select, for example blue. And this part here I can select, for example, yellow. So what happens when I selected is that it will then change to that specific color. The most important part is that you have the boxes here selected. Otherwise it will not change. So if you have this one, make sure that it's selected. And another thing that you should also be careful about is when you draw, it makes sure that it's not on a symbol or on the object drawing mode because it will not attach with the other layers in case they become a guide motion. Okay? So right now, it will go according to the color. So if this is blue, it comes blue, and if this is yellow and becomes yellow. Okay, So that is then what you can do with the classic tween here in the Properties panel. So aside from the color along path option, you also have the skill or long path in the classic twin, which will then make the object larger depending on the size of the path. So here I'm just going to change the color to black again. Here. Then you will see that you can select a specific path. So let's say here this part change the stroke size from here, like this. And this part as well, you change the stroke size like so. And you will see that when you are at a classic tree and the properties, you have a scale along path, you will see that when you have this part here, a short make it larger. But since the keyframe at the end changed, I need to measure at a keyframe at the beginning changed so that it will be the same for the whole and mission. So here, let me change the beginning as well to scale along paths now. Okay? So you see right now that when the B is going to that exact path, it will become really large and then an a becomes one again and then large again. So that this also one thing that you can do with the classic tween by scaling it along paths. And of course, if you have this with the color as well, It's also possible. So you have it with the color and the path. Like so you see that it will be bigger and change the color like this, k. So that is what you can do in Adobe Animate with the classic tween, with the options in the Properties panel.
13. Working with parent layer, Camera tool and Invoke Depth Layer: Welcome to another video of Adobe Animate. In this video, we are going to use this symbol as a character, as an example for the parents layer. So here you will see that you have one symbol in the main timeline, which is the night. When I double-click on it, it will have all these body parts inside of it. So if you create a character, make sure that the pieces of the body are separated, where you create one layer for each of the body. And then you can select them all together and create one simple like here inside. If I double-click on it, you see that they are separated, but I can go to modify, convert to symbol. I call this night to. For example, you see that it will become one symbol again, and you can again double-click on it. And you can then create several layers there or even at tweens inside of it, because sometimes there isn't enough space in the main timeline to add all the twins over there. Okay, So basically here you can also see that you have seen one nights and nights tools. So if I just double-click on it, you'll see that I have 92 over here. But when I double-click outside of the character on the stage, I will go back to the previous one. And I can also click here to go back to the previous timeline. Okay, So sigma s-domain timeline and night is right now what I'm going to use as an example. So if I don't want this extra layer, I just double-click to go to back to the second one. The second time nine. And here I am, break it apart. You'll see that I will then have the body parts again over here. And basically I'm going to cut them all and give them all a separate layer. So first of all, I'm going to start with the head and then I'm going to select the hands over here. So I hold on shift. You see that it will be really hard to select it so I'll drag the body somewhere else first. Okay, So 1233. Yeah. Okay. So I'll cut this and add this as the left hand and then paste in place. Okay, So I'll do the same here. I'll select the parts of the hand. So Let's drag this first little bit more to a top. Okay? Select all these. I'll cut it. And you see that the other hand is here, but we don't need it at the moment. So right now I'm going to create the right hands. Okay, So here I'll paste this in place, like so. And here I'll just drag this back here. And then for the body are caught it. Create a new layer here and call it body and peace in center. So here we drag it to the middle. Now you'll see then that it will go right above the head. So you don't want that. You drag it below the head. And the same for the right-hand. You drag it below the body and here as well. The right-hand can be above the body but below the head. Okay. So left-hand should also be above body and like so. Okay. So you drag the head more to the bottom. Actually, this should be behind the body. Looks better. Okay? So right now you see that we only need to do the lag on the left and on the right. So here we select the K. Let's zoom in a little bit so that it's easier to select it. Okay? So we cut it and then we call this left leg piece in place. And this one as well. So we'll call this right leg and then paste it in place. Okay, so let me drag this below the body because it doesn't make sense if it's in front of the body. Okay. Yeah. So right now we have this, let's say if you have somebody on the same layer, so let's say, for example, these two, and you want to send something to the front or the back, back here at the left leg, you can right-click on it and then you can arrange send to back. You'll see that then it will go to a bank. Even if it's in the same layer, they have to be the most for it to work. Otherwise, if you just have a drawing, it's not going to work. So bring it to front, back. Okay, So right now we have all these body parts. And what I'm going to do then is make one the parents and the child. Okay. So I wonder Molly to be the parent because everything is connected to the body. So that's why I will drag the head first to the body, and then the right hand, and then the leg. The leg shall be dragged to the body. So I want the body to be the parents here asthma and add this to the body. So basically right now when we animate it, it will be a lot easier because right now if I set foot in window, you will see that. If I had selected here, you see that it will move individually. But if I select the body, you'll see that it will move together with everything else, because this one is the middle one that holds everything together. And that's why I made it the parent as well. It's always easier to have it like this so that the body isn't going to be separated from the rest. And it just saves a lot more time in general when you're animating now. Okay. So aside from that, We also have the Camera tool. So for the camera tool to work, you will have to use a background. So let's say I go to main timeline, I hide this one, and I add a background. I can also create a new file as well. For example, I just go to New and create a separate one. So here I have a new stage. Select Fit in Window so that it shows everything. Okay, so right now we have the assets over here. And in case you want to see it better, here is the assets. So in the assets in the properties panel, you will see that there is a default option. And in the animators you will see characters and backgrounds. So in the backgrounds you see that you have these ones. But I don't want this. So I'll select another thing. I'll set the static backgrounds and I'll just select the woods here. And then you'll see that you can then drag the woods to the stage. So here, Director Woods to the stage here and make it bigger like so. It is always better to make the background bigger on the stage so that it will be easier to zoom it out with the camera at home. So here I have the camera in a separate layer and I have my background here. So let's create 50 frames. I press F5, okay? And I will create also another one we are at. The birth is going to be flying. So let's select the character here. The MCO blue is a good one. Okay, so here the MCO blue shall be in the front. And you see as well, this one already has its own animation. So you see that if I just drag it here, you see that it already as flying. If I double-click in it, you will see that inside it will have these movements. Okay? So what I'm going to do right now is I'm going to use the camera to submit in. First of all, show all. And once the bird in the beginning, so be flying from here and go to the other side. Okay, so let's make it smaller. And at a classic tween here. And I'll drag the birth to the middle of the stage, like here. And you can see as well here in the camera option, I can also use the classic tween for the camera to be moving. So in the end here I want the camera to zoom it in. So if I insert a key frame, I can then select a camera. And here you'll see that if I drag it to the left, it will zoom it out. But I wanted to zoom in and set, so I drag it to the right side. And you will see that it will basically zoom in on the bird so that it will look like you are focusing on specific objects. Okay? And you can also use this option here. Right now it's not offering edible, but let's say if you select the background, you'll see that you can then use this to turn it around. It's more likely for characters that are confused or that are rolling. So you can do that as well with the camera tool and with the in-focus layer depths panel here, you'll see that you can also zoom in certain types. So let's say if you want the camera to zoom in, you can drag it to the right side. Here. You'll see that it will zoom in. And in case you don't want it to change, you just leave it as 0. And you can do the same with the Macau here. So if I use the invoke depth layer, you'll see that I can then move the birds more to the left side. And otherwise, I'll change it more to the right. But you'll see that it will zoom it in at this on the right side. Okay, so I'll just leave this at 0 right now. And with the Woods as well, you can then some outs when you drag it right and you zoom it in when you drag it to the left. Okay? So here I just leave it at 0. And this is how you can work with the layer so that it will look like they are moving together with the other parts of the background. So right now if you look at the background, you'll see that it will zoom it in and it'll look like it will focus on the bird instead. And in case you want the the other parts of the stage to be hidden like right now you see this is actually where my stage is, where there is a rectangle that is the insight of the stage. So if I wanted the rest to be hidden, you just click here at the button that is rectangle right next to the zoom in and zoom out option. And what it does is it will focus only on African at this inside of the stage and nothing that is outside. So here if I play it, you will see first that it will show most of the background, but then it will submit AN and you'll see that it will focus on the birth instead. Okay? And here you can the same. So with the rotation tool, you rotate the stage as well, which will then make it better for people who are drawing their character from scratch. It is easier that way when you work with the graphics tablet. And here you have the option to center the stage so that it will go to the exact center of the area here because you have the stage here and the rest is behind the stage so that the stand how you make it right in the middle. So that is then how you work with the camera tool and folk depth layer.
14. Bone Tool: So in this lecture I want to explain how the bone tool works. So here we have the skeleton. And what I'm going to do right now is use the bone tool. So for this tool, it does matter to use characters that are very flexible. I don't really recommend this type of tool, but I'll show how its work. Because with the classic tween, it will work better. It's more reliable. This one is a little bit unreliable since you have unpredictable situations. So I'm going to show you what I mean with that. I'm going to add some frames here. So let's go here and then we press F5. You can also add frames by selecting this button here. So before you select the scatter on here, make sure that it is actually on symbol. Because otherwise, if you don't make it as simple as will not work. Even if you have undrawn object, it won't work. It needs to be a symbol. And of course with the rod drawing, it won't work either because if you don't have it on symbol, everything will be connected together and basically you cannot make several layers for the mantle, you have to work in one layer. So that's why everybody part needs to be a separate symbol. Okay, so I'm going to extend this to the hips and then I'm going to add the legs as well here. Okay? You go to whichever time you want. So for example, I go to the first, second, and then I can use my free transform tool. And I can select any body parts here and I can then move it around. You see it will move together with the shoulder blades. So if you don't want it to move together, you can always make it separate symbol and then you move them separately. Okay? So right now here I want the arms to be linked to the shoulder blades as well. And I want them to move from there. So I'll drag the pivot here just to connect it to the shoulder blade. This will make it easier to move around like so. And then just select the lag here, move the pivot model top, and then I'll make this more flexible. Okay? So right now you see that it does have its glitches and it's not really reliable for this same reason because everything will be moved apart and it will be quite a mess sometimes. So instead of having it here, mass drag it to the two seconds frame. So here, let's make sure the lag is moved more heavier and arms are here as well. You see as when it is exactly here at the end of the arm, it will then move that section as well. Kay? So what you can also do is select the arms here. Make sure the pivot is then a little bit lower, like so. And then you can see if it will still affect it. A little bit more. Okay? So right now you see this one will be better movements if you have the pivot a little bit further down. Okay. With the legs as well. I'm just going to move this a little bit more here. So before we go further, I'm going to clear the post first. Okay? So in the armature, which is the animation that you create with the bone tool. If you right-click on it, you will see here that you have in suppose and clear posts. That means that when you use classic tween, you use insert keyframe and you clear keyframe and in the bone tool called posts instead of keyframe. So that the standard difference, okay, so here you see it will clearly become a mass. So let's move this out here. And this one should be here. Okay? So let me insert a pause here, a bit more to the top, and then let the hands here. Let's strap the hands down here. This one too. Yeah, you see that it will move itself when you insert in other posts. So here, just make sure that the types are connected together. And here we go. So yeah, this one looks a lot better. K. So that this then how you can work with the bone tool. Basically, it will create a movement with a character. And I recommend using classic tween at the solid batteries and bone tool. But for beginner at this, quite frankly, if you are trying to learn one thing at a time, better to start with the Ableton first because it is simpler. And then you go with the more complicated things.
15. Shape tween: In this video, I'm going to explain to you how to work with the shape twin. Okay. So shifting is used, as the name says, it is used for her shapes. So for example, you have a rectangle or an oval form, or a polyester, which is the shortcut for polygon and start because it creates both types of shapes. You can then create another shape in the last keyframe so that it will look like it is transforming. So at this eight-week, for when you want to transport something into another shape, or you want to transform from colored as well. That is also possible. So here you see, we can use the rectangle here. Let's change it to a solid color here. Okay? So we have the rectangle right now, and in the last keyframe, we can insert in other shapes. So let's say I want it to be a polygon or a star. I can go and select this tool here, which you will find at the bottom of the rectangle tool. You can go to Properties and you can change the style to a polygon or a star. So I rather prefer a star and I will choose the number of sides to be five. The star point size is basically if you want the edges to be sharp or not. So the last number, the sharper it is, and the higher the number which is number 1, that is the highest that you can guess. It will make the edges a little bit more thick instead of sharp. So here at 0.5, I think it is the best one. You see. Right now we have the sharp corners of the star, how it should normally be. And right now here you see that this is a rectangle here and this is a star. So what I can do right now is go in between and I create ship twin. So here you see that it will then go smoothly to the star. Like so. But you will see that in-between it will become a very weird shapes. So for it to not creates like a wedge shape in-between, since it has more seconds to it. You can insert a key frame and you can insert shape hints, or you can make this a rectangle as well. So let's say here, I create a rectangle. Okay, so right now you see here it's still changes a lot. So basically what you can do then is you add shipments to it. So you've got to modify, you go to shape and you add sapiens. So if you want to add more office she pins, you, just press on control. And you'll see that B will go here, see over here, and then the offer here in the Apple operating system. So if you have iOS, it will then be comments instead of control. So here you can then add the ship hints. So let's say you want B, so B here, and C to B here. You can then do it like this or you put it on the edge of the star, like so. And then a over here. So then it will, It won't be like that, irregular when it moves. Like right now you see that the shape is becoming a lot more stable and it will only change it in the way that it looks like it will fall. So if you don't want to like tag, you can also do it like this. So you see all those points will go exactly in that order. So that's then what shape him does. So, for example, if this a is here, it means that That's points nice to turn into this point. So like right now you see this one is better because the a stays here instead of having it at the top. So that this then how to make it more regular moving when you are using the sheep twin. Another thing that you can also do with the shape tween is by name this first. So changes to two. What you can also do is change colors. So let's say here I have the rectangle, I copy it, and then pieces in this layer. So if you see that there is a dot over here that is empty, it means that it doesn't have any thing there yet. So you have to add something there, a character or a shape we'll do. And then I add the shape tool. And here at the ends, I can then change the color. So let's say I want the color to be green. You will see that it can also change the color like this. And in the middle it will have a color as well. These are the two main reason for using the shape twin. For a character movement or a character animation, it's better to use the classic tween because it is more reliable when moving from one frame to another frame.
16. Motion tween: Welcome to another lecture. So in this one, I want to explain about the motion tween. So here we have our symbol, and here we have the layer of the flower. The symbol is AB. So here I'm going to animate the b in the way that he will move to the flower here. So with the motion tween, you don't have to add a keyframe when you want to create a movement. So for example, here at the end, I'm just going to select the last frame here. And I'll drag it to, for example, here. I can drag it here. And you'll see that there will be a lot of dots in between the line. Those shows all the frames in between the motion. So that means that from the first frame until the last frame, we are supposed to be having 48 frames, so there should be 48 dots here. So what you do is you can drag this around so that it will be a little bit more curvier. And you'll see then that the BS going to go in more curvy way instead of a straightway. Now right now you see if I select this, it will go to the flower in a fairly straight way. But what if you want it to look like the BS really attracted to the flower. So it wants to be doing a u-turn here. So in that case, you can select the last frame here. And you can either click here on the layer twice. You'll see that it will open this location here with the x and the y. So with the X and the Y, you can then create a dots anywhere. Or malar set a pin and then with this one you can then drag it a little bit up so that it will become curvier. With these anchors here. You can then curve it to whatever you want. So let's say you want this to be slowing down like so. And you will see that here in the beginning. It will then create this curviness so that it will look like the B is more likely to be attracted to the flower because it will then slow down first and then go really fast here. Okay? And let's say you want, you don't want that. You create a another one here. You can then also curve this one so that you'll have more curviness at the ends like this. This will then create an effect that makes it look like. That will try to use all its power to go to the flower like here. We can drag it further away and you'll see that it will make the new term here. So the, for our ideas, the more it will be at the ends, and the closer it is in the beginning, the more it will be closer to the beginning right here. If I drag it here, you'll see it will actually do the uterine already. And if I have it really far away, it won't make it so fast. Something else that you can do in the frame in the properties panel is using the tweening as well. Just like in classic tween, the ys out, we'll make it slower at the end. And the ECN will make it slower in the beginning. Like you can see here, that the dots are closer together. So that's definitely means that it is lower in the beginning. Okay, so we have oriented path as well as here. So basically with the oriental path, you will get a keyframe on every other frame and you'll see that it will turn around together with the line. So the line will turn around here at the end, you will see that the B will also go down to with it and then it will go back up like this. So it's not as detailed as to orient to pass in the classic tween. With the classic tween, you can use your own motion guides. And here you can also rotate it. But in some cases it is useful like when something is thrown or when something explode and then all the pieces will be going to another site. So then you can choose the clockwise rotation and also the counterclockwise rotation, which will only rotated it the other way instead of going to the left side. And here of course, you can also make it Council depends harmony times you want it to rotate. So if you want it to rotate four times as we rotate four times in total before it reaches the end. And you can also change the angle a little bit. So if you wanted to rotate as seven degrees, you'll see that it will rotate it at the hello.html on seven degrees. So it really depends how you want the angle to be. You can see the annual change because when you change the angle here, you'll see that the rectangle form of the symbol will change its position. Its definitely turns around depending on which angle you want it to be at. Okay, so that this then how you work with the motion tween. In case you want this to be hidden again, you just double-click again. You can also right-click on it and then select refi, motion to eat and select Refine motion tween, again where you want it to be hidden. And these ones you just right-click on it and anuclear the keyframe, select all. And you'll see that that at the end there will be no keyframes. And here, you can then drag it again here, just like it was in the beginning. So that you have those same animation as before.
17. Create a disappearing animation with Mask effect: So in this lecture, I want to show you how to create a mask effect using the classic tween. So here we have our layer mask to create a mass. You can either click on the icon here in the beginning of the layer and you select mask, or you just right-click on it here and you select mask over here. Okay? So right now that we have the mask and the alien over here, I will show you what the mass does. So I want the UFO to be moving after this effect is done. So what I'm going to do is I'm going to lock the mask first. And here I'm going to add the classic tween. I want the alien to be moving to the top at the end. So I'll just move it to the top with the arrows. And I can also do that with the mouse, but at least now I know that it's moving in a straight line. So I'll just move it until the end of the mask here. And for the mask, I'm going to be making this wider like so, so that it covers the whole area like this. Okay, So here I'm also going to be adding a classic twin because I want the mask to be invisible afterwards. So here at the end, I'm going to go to the frame in the Properties panel. And I'm going to go to color affects, make it Alpha, and here 0%. Okay? So what happens is that when the Elian goes to the top, you see that it disappears together with the light. Okay? And your identity even create anything with the alien here, like here in the color effects. I can make it 100 percent and it still won't appear back because it has been masked by the mask layer. That is what the mass effect us. So here when it goes up, it will disappear. And then I want the UFO to be start moving from here. So I insert keyframe here and I can use the motion tween to track where it goes. So I select the last frame here and I'll just drag it because with the motion tween, you don't have to insert keyframe. You just go to the specific area and then drag the animation further so that it will create the animation for you. Okay, so it will look like this right now. When I play it, you will see that the alien will just go up and you have Overleaf. Thanks. So you won't see any light because it is a mask layer. So basically you cannot see the mask. The effect for the mask is only to show a certain area or to hide a certain area depending on the opacity of the mask. And to show that there is light over there, you create a new layer over here. Let's call this mask to or just like, like so. And what you do is you copy this one. So let's unlock it. You copy this specific area here, the specific layer or the light. And here you paste in place so that it will be on the same area. And you insert a keyframe here. And then you create a classic tween. So here at the end, you make sure it is same as the mask, make it 0%. So then when you play it, it will then look like the light is turning off together with the Egon. Because only the mask will not show the light itself. So you'd have to make a copy of it. So basically what I can also do is duplicate the mask over here. Like here, you duplicate the layers. It will be a mask copy. And what happens is that when you have the mass copy, you see that it still will not show here because it is the exact same copy of the mask. So what you do is you right-click on the math copy and you then select the mask again, so that right now it'll be a normal layer and not a mask. And when you go to control tasks, you will see the light as well. So you can then see the light and the alien, instead of only the alien. You can then rename this by double-clicking on the name and call this light, for example. Okay, so this is then how you can work with a mask. And in the next video, I'm going to show you another way that you can also work with the mask.
18. Make a specific area appear with Mask effect : Welcome to another lecture of Adobe Animate where I'm going to show you the mask. So basically, a mask will make sure that a certain area of the stage is showing at the moment that the mask is activated. So in this case, I'm going to use this layer estimates. First of all, I'm going to convert it into a symbol. To convert a, you can press F8, go to modify, convert to symbol, or you right-click on it and then cover two symbol here. Okay? So what I'm going to call this is inside. I'm going to press Okay? So basically right now you see this will be our part. We are we want it's two appears because we want the girl to be bicycling. Inside of the television. We are there is mountain and the forest. So here I'm going to hide it back. Further mass function, you have to have both of these layers locked. Okay, so first of all, I'm going to at the mask to the layer by right-clicking on it, I can select mask. And then you see here that the crows shall be bicycling from one end to another. But it's because I haven't edited the growing yet. So before that, I'm going to use either the classic tween or motion tween. You can use both. But I'll show you with the motion tween because it is easier to show how the past is. So I'm just going to refer to the other side here. But of course we need to move this mortar buttons on the agnosia nucleic she is flying. Okay. So here in the last keyframe, I'm going to move her down a smile, maybe a little bit more to top. So okay. So here I'm going to lock this again. So right now you see how the grow is going to be bicycling inside of television by having her appear only there. Instead of having her morphing from the outside to the inside of the television. So this is another way that you can use the mask so that you want a certain part to appear only and not the whole stage to appear like the girl is changing from the outside to inside the television. In case you want to use a classic tween, That's also possible. So if I remove motion tween here, and again create a classic tween. And then here inside the classic tween, I insert a keyframe in the last frame, you'll see that I have to move to grow again. So basically I'll just move it to this side here. And you'll see that she'll be bicycling here as well. Okay, so maybe this one should be actually here. I move it in the wrong key frames. So this will show me here. And this should be on the other side. Okay. So and then when she's riding the bicycle issue then be like this. Okay. So as you can see, you can also use this in the width, the classic tween. But it, there'll be really hard to know if she is driving in a straight path. So in case you're not certain, you can use the motion tween to detect that.
19. Moving background: So in this lecture I want to show you how to create a morphing background. So first of all, you see that we have the background for the towns and the background itself. So first of all, we have the layer for the towels and the layer for the background. Okay, so what you need to do is you have to make sure that there is a bigger backgrounds and not just enough for the stage because you want it to be moving. Okay? So that's why in the beginning you have to make sure that one side is exactly at the beginning of the stage and the other side is a little bit further from the stage. Depends which way you want it to go, of course. So if I have this exactly here, it means that I wanted to move more to the left side. So I want this to move to the other side and so that it will have more space to move. Okay? So for me I find the best option for tweening is the motion tween in this case because I can see how it will move using the motion twins. So if I add the motion tween here, you'll see that if I go to the end of the frames, that will be the third. Second here, I can then select the background and move it to the other site. Okay, I will make sure it will stop right here with the beginning of the stage. And you see here that the line is actually straight. So you know then that it will move in a straight line and not go at the bit to the top or a little bit to the bottom so that it won't look like it's moving diagonally. Okay, so here I'm going to move the task as well because you don't want the task to be at the same place As well. Look, not so authentic if you let them stay at the same place. So I'm going to add the motion tween here. And in the end, I want to tell us to be moving together with it, since it's going to be moving to the left. I also wanted to move to the left like so. Okay, so instead of moving it with the mouse, you can also move it with the arrows. Okay, So this one, you use the arrow on your keyboard and you can then drag it to the left side. It will go slower, but it is actually to make sure that the line will still stays straight instead of using moles, because with the mouse you can move it a little bit more to the top or a little bit more to the bottom. And then it will look like the thousands old moving in a straight line. So it will look very unnatural in that case k. So in case you wanted to move slower, you can create more frames. It will then slow it down. And in case you wanted to go faster, you can then make less frames. That means that in that amount of time it should reach the end. So it will make it go a lot faster that we do. Okay? So right now, show you how it looks like. If I fit in window. You'll see right now that here it can then play it. And you'll see how it look like. It's moving with the background. Okay. So if I go to Control and tested, you'll see how it looks like. Okay, so this is then how you can create a background in Adobe Animate that will look like it is moving.
20. Frame by Frame animation part 1: Welcome to this video where I'm going to show you how to animate this penguin. I want to create a frame-by-frame animation. And by doing that, I need to draw it from one step to another step. You can either draw the whole body or one layer, or you can make them separate as well by having the legs and the arms a separate layer. In this case, I want to make an animation where it looks like the penguin is to going to jump here at the bottom. It will have to press its body. And I need to know how the timing is, because the timing is the most important parts in animation. I'm going to draw the timing first. So here I'm going to use the brush tool. So I'm going to create a new layer first, let's call this the timeline. I want the line here to show how the animation will go. We are at the top. It shows me going in the normal speed. So let's say the second keyframe here, I'm going to insert it here. And then we can keep doing that for the dropping of the penguin. But like at the end, I want it to be fast as it needs to press itself to the ground. So here, this one is slightly more space in between the keyframes. So here I'm going to make a space like this over here. And the rest of the differential half the same space. So basically they should be the first one. And this should be, let's say we make it 21st so that it will be easier here. Remove these frames. Okay, So this one here, I'll make it 20. Okay? I'm going to now lock the layer and then I'm going to drag this penguin to the bottom. So here I'm just going to select everything. So first of all, in the fifth frame, a showdown be somewhere here. So let's drag it about here. Okay, and let me draw the line again. So here I'll just use the brush tool. We draw a line here and another line here. Okay, so, and let's drag the line here and now we drag it to the fifth frame. Okay? So right now it shows me here in the fifth frame and in the 10th frame, we insert one again. And basically here I'm going to draw the lines for the tenth one. So here, just going to draw five more, 12345. Okay? So here it shows me this one. This is the tenths. Yep. And showed me moving here. All right, so between 15 and 20, I wanted to move a lot faster. So that means that here the space needs to be wider. So in that case, I'm just going to delete this one here. So I'll drag this in 22 months. I'll drag the Penguin to the bottom, so we can also move it with the arrows on the keywords. Okay, So this one should be where it stops, but here it needs to be pushed. So in that case, we can use the free transform tool. And then I'm going to pass on shift so that it will move all equally. We need to have the period here at the bottom so that the bottom stays the same place. Drag it to the bottom. Now. Okay. So like this, we don't want to exaggerate too much. So I'll move it like so. Okay, so right now it will look like it going to jump. So after this, we need to make it go back to the top. Okay? So let's say we add some more frames here. We add the same frames here. So 20 extra. And then at the 13th frame here, we want the pigment to move back to the top. So here we can also copy this specific keyframe. So let's go to copy frames. And then 13, I'll paste the fringe here. So it will have the same movement asked there. So I copy the frames, paste frames and this one as well. I'll copy frames and paste frames. Okay? So basically what you have right now, when you look the animation by selecting this, you can select the whole animation here by dragging this highlighted timeline here at the top. So what you do is you play it. You see right now that here, There's too much space here, so this one still needs to be smaller. Okay? So let's drag this to here, like so. Okay, so this one looks a little bit more natural. So if you want there to be more movement In-between, you can also add some keyframes here so that it doesn't look like it has jumped from one keyframe to another keyframe. So we can then move this a little bit more here, like so. And the same here. So we can add another keyframe here. And basically, we could just copy this frame here, which is easier than adding a new keyframe because then it will copy the keyframe. Notice before it's okay, so right now, we just copy this night so I should be better right now if I play it. Yeah. So this one looks a lot better. Okay, so basically if I stop it right now, I'll just hide this timeline over here. I can then play it. And you see then that the pink one is going to be jumping like so. So you see that sometimes when it goes here, you will see that it will look like it has been selected with the pixels. Make sure you deselect all of them, because sometimes it will keep it selected when you have it with the transform tool K. Okay? So right now it should then the selected. Yeah. So what you can also do is when it reaches the top again, you can actually read the feet a little bit down so that it will look like it has used some force to jump up. And it will look more believable in the animation. So right now if I play it, you'll see when it goes up, that will then make the feet move down so that it will look like the gravity makes it pour the body weights down when it goes up. And in this case, you can also make the hands movement, move a little bit up and down so that it will look like it is scared to lands on the ground. So in that case you have to make the hands separate. I will show you in the next video how to do that.
21. Frame by frame animation part 2: So if you wonder hand to also be moving together with the body, you have to make sure that you create the hands in another layer because otherwise, you cannot move it flexibly unless you have it on our symbol. But realistically it's better to use the hand another layer, it is easier to see it that way instead of focusing on too much in one layer. So right now, I want the pigment to move its helmet when it is falling down as well. If I wanted to fall down only, I will create only 20 frames, so I will delete the other frames here. Okay, so I wanted to be moving its head. So that's why I'm going to make a new layer with the outline only so that it is easier to see. Okay, I'm just going to select the outline mode of the body and the hands. I'm going to create a layer on top of it. So here, body sketch and this one sketch. Okay? So right now I'm just going to draw this from scratch since the first keyframe. And then I'm going to draw the hand as well. So we zoom it in here. And then we can rotate it so that we can draw it better. Okay, So let's, let's rotate it like so. I want to draw the hand first. So let's start with the hand. Okay. I'm just changing it from the Properties panel I don't have right now on the screen. But it's not important. We can all change size of the stroke to however we want. Okay? So right now this will then be the right hands, okay? And the other side shall be the left-hand. So I'm going to use the rotate option again. Then we use the Brush tool here. It doesn't have to be perfect. Like so. And then I'm just going to make it straight again like this. And we're going to be drawing the body, okay? So here, k the sun should be the hand. So right now here I'm going to start with the body. K, this is the body and then we have the legs as well. So then we have the eyes over here and this one as well. And then we just create the circle that this left here. At the bottom, right in the beak, you see the part of the belly here, so I'll just do that. So right now we have the body, and I'm going to do right now is insert a keyframe here. So you want this to move to the bottom. So that's why I'm going to move it more here to frame number five, K This is four, and then this is five. Okay? So the hands, I'm going to also move them here to the body. Well, of course we want this to be more upward because it should look like it is struggling to have a grip. So the hands will be flapping a little bit. Okay, so I'm just going to insert a blank keyframe right now. And here I'll use the onion skin just so I know like how it looks like. Okay, so let's zoom in. It starts here. Close it over here. So here as well, we should know where it starts. In case you think that it's really hard to know what's the measurement is. You can always go to feel and you can select Show grid. So here we can then this one make it look like it's going more upwards. As changed the other side. Since these are unframed for I'm going to change the keyframes to frame 5. For the 10th frame. I'm just going to move the body to the bottom. And the hands are some more fit to the body. So here, use blank keyframe. So here I'm just going to draw this backwards. So basically this needs to look like it's going down. Okay? And in the 20th frame here, we'll move it down again. And here, for example, the hands flip it vertically. We can do that. Okay, So here, let's just leave it like this and I'm just going to delete the lines over here. So let's say these ones here. So here I'll just draw the rest. So here we just draw some more lines. Okey-dokey. So I'm just going to turn off the onion skin first and deselect everything so that it won't have these dots when it is playing. So let's stop this for now and let's go to few. And we don't want the rulers anymore. We don't want the grid anymore. Okay, So here we'll just make sure nothing is selected. So we hide this. So basically, it will look like the penguin is going to fall down and it's going to go back up. But here you see that when it falls down, you have to also move the body. So here we're going to squeeze a little bit here. Like so. Make sure it's squeezed until here. Okay? This one. We also drag it to the body like this, but we squeeze it a little bit as well. So let's hold on, Share and squeeze in a little bit. For the hands. We can then deletes few of this. Let's just draw it and close it over here. This one as well. Use the brush tool just to close it there and close it here as well. Okay. So if I play it right now, it showed look better. So for the animation to look like it will stop a little bit. We need to add a few frames here. Okay? By now it will look like it will fall down like so. So this is then how you create the animation, including the hand animation together with the body.
22. Movieclip vs Graphic Symbol: in this video. I want to show you what the differences are between a graphic and the movie clips symbol. Okay, so first of all, to convert them into us and more, you just go to modify. You can click on convert to symbol or decompressing f eight. So here, you see that you can give aiming to the symbol just to distinguish it. You can then call this, for example boy want, and you will see that it was done created symbol for you. So I didn't select the movie clips symbol while I am wanted to convert it. But you can always change it here at the right side to a movie clips symbol. So right now you see, this is then the movie clips symbol and this is a graphic symbol. So the main difference first ofall is that when you create a movie clips symbol over here, you will see that when I create an animation over here, like the boy is falling down, I answer a key frame here. I direct the paper here to the bottom. I rotated, for example, like this and here as well. I need to change the pay for it here. Otherwise it will be moving under the bed. Weird. So here I am not going to go from began to the end, and this is then how it will look like. So right now, when I go out off this symbol, you will see that nothing happens when I play it. It's only the grow that it's moving because it is a graphic symbol with a graphic symbol, it will show you in the meantime line. What's the animation is because it whatever happens inside off the graphics and more also happens on the meantime light. So right now, you can then see what happens here. Okay, so another thing that you can also do is use a frame picker, which will then changed the movement off the animation if you want. So let's say you want this to be in the first frame. Instead, you go here to the first key from here, you select the image and you use a frame picker, and you change it to, for example, this one over here. You will see then that it will start like this. So what happens is than that it's will finish at the beginning already so nothing will happen because you cannot turn it around like that. You have to add in all the key frame here and in this key frame, you can use a frame picker and select the 1st 1 over here. And then what happens is that my new selected and here at the anti will see then that it will stand up like so Okay, so that this done what you can do in the graphic symbol. Besides that, you can also use the automatic lip sync in graphic symbol, which has all these movements for you. So you only have toe create the most movement. And then you can add all these most movement over here so that it can create the lip sync for every type off letter and every pronunciation. And with the movie clip symbol, it ISS mostly also used for character animation. But it has other effects, so graphics and more is more recommend. It's for character because it has more functionalities for animation, but and the movie clips and more. You can create FX like glow effects or shadows for the character, because you can add filters to it, like here you can blow it out, you can add a baffled to it. You can at ingredients glow, or you can remove all Esmael. You can even add a shadow here so that you don't have to create the shadow separately when you are animating the character. If you don't want to create a shadow separately, you can also do this, and you can also change the angle in case he wants no shadow to be on the other side or you wanted to be, for example, on the ground. It is also possible you can change the pixel here, and it will go for away like so. And you can also create a knock out an inner shadow as well, which were then created inside off the character, instead off you having to draw it all over again. And you can also hide the objects. So that's you only see the shadow. You can also change the color off the shadow off course, so any filters here you can then added to it. And if you don't want it, just click here on the miners and it will then delete it. And other things that you can also do is at the three d rotation told to it, but I don't really recommend it. It's not really necessary for this. Let's just so that you know how to work with it. You see, you can turn it around like this, or you can ads, for example, a clockwise animation or become the clockwise animation as small like here. You see, you can do a lot with the three D rotational, but also translation tool. You can move it to the top or to the right or the left. So you have to select the arrow first, and then you can move it according to what that arrow is doing. Okay? And if you don't want that, you just like something else here. So you just go to undo and then you can under the three D rotation and translation, too. And of course, you also have to color effect here, which you also have in a graphic symbol, so both of them can have the functionality where you can make a character invisible. So, for example, here you will see this will then become a little bit more invisible, like so you can do this with a classic between here, and you can add a key frame over here. So there's what can then be 100% feasible so that it will have solid colors. And then at the end you will see that it will look like it is training away. So that can be done with the movie clips, their mobile also with the graphic symbol. So here you're seeing this one moves away like that and this one Esmael. He can also do that here in the movie clip symbol. So he answer a key from here. You make this 0% and then you have both off them disappearing at the ends. So all these FX can be done using the functions off graphic and movie clips symbol and depends on what your aunt's goal is.
23. How to edit audio in Adobe Animate: Welcome to another video about Adobe Animate. In this video, I want to explain to you how to work with the audio. And first of all, if you start from scratch, you need to create a file that is a character animation. So select this one and not the ones here, because they will not work with the audio. And here you select whichever preset you want. But make sure that the platform type is an ActionScript 3 and not HTML5 canvas. Okay, so I'm going to go further with the audio to insert to the audio into your animation. There are several ways you can insert it to the stage or to the library. One way to insert it is to select the audio that you want. You drag it to the stage. You see that it will also appear in the library. And you can also drag that to your library first and then you drag it to the stage in case you drag it to the stage. And this timeline here is somewhere else, like for example, it is in the first second. You will see that it will start from there and it will then cost problem if you're all yo is not enough for the frames. So let's say for example, I drag it first to my library. You will see that it has an inserted its yet into the layer here. So if I drag it and the timeline is in the first second, you will see that it will start here. So you will possibly not hear the song effect on us. You drag it back to the beginning. So it depends on you, if you rather drag it to the stage or library. If you want to drag it to the stage directly, make sure it is on the right frame. Okay, So here, when I select the frame here and I go to Properties panel, you will see that in the sound, you have the large bubbles surfacing MP3 here to select from. And otherwise you'll select None. If you want to select more than one, make sure that you insert more. So you go, you can go to file as well and select Import. And for example, you will select Import to library. And you select waves crashing on Rock Beach. If I go back to the properties panel right now, you will see here that in the sound option, there is also waves chin on Rock Beach and not only large bubbles. So there you can then just select it and change it from the salt. If you drag that to the library, which will make it a lot easier to apply on your animation. And aside from dad, you can also change the effect of it. So you can change it to the left channel and right channel has to do with your speakers. So wherever your audio is going out, you can change it to only one sides and you can also fade to the right of a to the left. So this also has to do with where the sounds will go out. And if you want to change the volume of the audio, you either go here in the edit sound and follow up, or you go into the effect and select costume. They are both the same because here you will see that you will open a window that says edit envelope. And it is the same here. When you select it on the right side, you will added envelope. So you select Custom then. And you go here, you zoom out the audio so that you can see everything. And this way you can start manipulating it by clicking somewhere in the line. It doesn't matter where. It will create squares for you. And there, you can then make the sounds lower. I'm going to play it for you so that you can hear a difference. So this is then how you change the audio volume in Adobe Animate. And if you leave it as string, you will see that when you drag this blue line through the timeline, you will hear the audio. If you have an unstable it will also look together with the animation. If you have selected that, when you export your animation, you can select if you want to loop it or not, so that the stand how you work with the sound effects in Adobe Animate. So we have chosen the other audio before, which is the waves crashing on Rock Beach. It starts from the very beginning, so it won't have a problem with the animation not sinking with the audio. If you have an audio like large bubble surfacing, you'll notice that it will only have the audio over here and nowhere else. But when it reaches that specific timing, you'll see that the bubbles will already disappear. If you want the audio to play when the bubbles are moving, you can select all these frames here. So if you hold on shift, you select the first and the last frame here. It will then select all these frames and you can then move it further away. And for example, I want to move it here because it will start animating here. And it will make more sense that the bubbles will be having audio when it is moving and once when it's already disappearing. And here in the beginning you'll see then that there is nothing here. So you either leave it empty or if you want the items to still be here, you can go here in the fringe and you select the first and last frame again with holding down Shift. And you right-click on it. You can then go to copy frames or press Control Alt C. So if you copy the frames and you go here in the beginning, you can then right-click again and select all these frames here in the layers. And you go to paste frames or we pass on Control Alt V. And you can right-click on it. And you can then remove classic tween. And since when you paste the frames there, it will only move the keyframes further away. It will not delete the keyframes that were in the place of it. So right now you have to right-click on these keyframes here that are blank. You need to then clear keyframe and you'll see then that it will then have the items here, but it will only start moving when it is here. And the 29th frame, Few 12, deletes a blank keyframe. Make sure you select Clear keyframe and not clear frames. Because when you clear frames, you'll see that it will actually create new keyframes again. So you don't want them, like right now if I clear these frames here, you see it will only creates blank keyframes there, and then it will move the existing keyframes one step further. So make sure to select Clear keyframes when you want the keyframes to be gone.
24. Lip Syncing: Welcome to another video where I'm going to show you how to work with Adobe Animate. So in this video, I want to show you how to use the lip-sync function, which you will find in the properties panel on the right side of the screen. And you can also have it on a non their position depending on which location you chose for your Properties panel. So you have to select object instead of frame, and then you will see the option at the bottom. So here we have our mouth. You need to have a multi-movement for every letter. So when I double-click here, you will see that insight. I will have a multi-movement for different kinds of letters here are magnified for you. Here you see these are the latter. So we have this and this lip here means when it says AAE or I, and when it says ws should be this one. And for r, it should be this one. For us FV et cetra issue in being other lip movement. Okay, so the reason that I have put them all in a non-leader number of frame is because if I have them all on one frame, like for example, if I set them all on Frame 1, you will see that it will look quite messy. You'll see all the lips will be together and we don't want that. So that's why I have sat them on separate frames. Okay, so right now if I go back out, you'll see here that I have my audio already. And with the mouth here, I can then select it and you'll see that I can then use the lip-sync option. So in a lip-sync option, I will have to choose between all these mouth movements. And you see that right now they don't have names, just number. So what you can do to make it easy is you go here in the symbol, double-click and the symbol you will find that there is another timeline here with all these movement. You go to the Properties panel here you select the frame. And you'll see here in the libor you can insert a name. So let's say I call this AEI. And then this one I call W. I select this part and call it r. I select this one and call it SFTP. If you're not certain, you can always search online, which most movement fits for which latter, or you can also check in the mirror when you are speaking on how you pronounce the letter. So right now here we have all the names included in the frame. You will see here they have these red dots. If you want to add a comment, for example, it will change color. You'll see by zooming in that it will become green instead. And if you add an anchor, it will also change it to another color. Right now here it's yellow. Okay, so let's change it to name. Okay, So right now if I go back to my symbol in the main timeline, you'll see here that you can select lip sinking. And when I select it, it will be easy for me to select because here in the neutral, you can then select the neutral for it. With the R, you can select this one for it. For the D, you can select the one with the tongue in-between. For E, you select this one. Okay? So right now I have inserted my audio in this layer here. So I call it audio, and that is why it will ask me to sync with audio in the specific layer. So if I have another name there, it will then select that name. So I press on Done right now and you'll see then that it will create the movement together with the audio lifts. You see that this han, how it will look like, okay, I mean, make it smaller so that it fit in the frames. Okay? So here this is then what happens. We're using getWidth the audio. And if you want to create an audio, you can use programs such as Adobe Audition. To create it. You open the Adobe Audition. You go here in a file, you select New. And you said all your file. Or of course, you can also use a sound that you find online, like a sound effect or some day that you want to add or background music. So let's say this one. I call it lip sync, just like that, or let's say lip-sync tree. And I click on Okay, I can then recorded. So I'll say here, for example, this is four lip-sync purposes. And there you see that every time I pause, there will be no movement here. You see there is no ups and downs in the lines. So these ones are the one with the audio. So when you go to File, you can then save as. And when you save it here, you'll see that you have the option to name your file. So if you will still change your mind, you can change it to something else like Adobe Animate for example. And here, you can then change the location where you want it to be uploaded ads. And here in the format you can select WAF or MP3 audio. Those two are the only ones that I recommend so that you can insert it in Adobe Animate for it to work properly. If you don't have to correct file, it will not import it for you. So then you select OK and then you can save it in your file. So here, when I go back, when you want to insert your audio, you can, for example, drag it to the stage. So here, for example, this one, I can drag it to the stage and you'll see that it will then insert the audio for me. It depends on where you have your timeline starting because the blue line here indicates where your audio will be imported. So if you have with on the beginning and we'll start there. And if not, it will start somewhere else. If you think that something is not the way you want it to read. So you want it to be more precise. For example, like here, it says four and it changes to the M1. So once you do then you select the lip here, you go to object. And you can then also go to frame picker. And then you change it to the art. So if you want it to be more precise, used her friend picker to change it afterwards.
25. Create a button for a website animation: welcome to in other video about Adobe animate in this video, I'm going to explain to you how to create a play bottle so that you can repeat your animation over and over again. So you see that I have already created my animation here and that the layer off the ghosts and the night starts at the frame number two. The reason that I change them, too, start at frame Number two is because at the frame number one, you have the button over there, so I don't want the bottom to appear at the same time that the animation starts. So instead of that, I am going to create a coat where you can click on the bottle and then it will start the animation. So, first of all, you see that I have already needs my bottle in the properties. That's very important so that the program we'll be able to know which object you're referring to, and when you click inside off the bottle by clicking twice, you will see here that there are several colors for several different actions. The reason is that all these actions includes the most hovering over it and clicking on this and I have created several colors just so that you know that the bottom is being click at or that you can pass your most through the bottle and create these specific effects. So I know that I have my bottom ready. I am going to go to Windows and then I'm going to go to Cotes nippers so that I can use my code snippets in action script. So in excess, grab 1/2 a lot more choices here in this case. So I'm going to go the timeline navigation, and I'm going to stop at this frame first so that it knows that I want to stop at the first frame first. That's very important in creating a video or an animation where you have to click on something before it starts. So if I want to stop at the bottom first, I'm going to click on Stop at this frame and then I am going to insert in undercoat in here after it stops. So I wanted to click to go to frame and play. So in that case I'm going to double click here, and it's asked that the action requires an object to be selected on stage. So in that case, you have to select the specific lier that you want to click on for it to jump to a specific frame and play. So I'm going to use my button instead. For that. Since I created my actions here, the layer jumps automatically to the actions layer, so you cannot at something in the actions layer again if you are already on that layer off the action. So right now it saves. Replace the number five in a couple O, but the frame number. You will like the play hat to move to when the symbol instances clicked. So in that case it automatically comes with a number five. But you can jump to number two, for example, because that is the number off the friend that you want to jump to. So this number is not important because this is the a few times that you have created the symbol. So since I try to create a sailboat that will fit for this specific animation, I've tried six times, So that's why there's a number six over there. But you can always have a different number. So it the first per person so that is not very important. What is important is that the coats works and that you can click on the play button. So right now, when I test it, you should hover. You should be able to hover over it and then click on it, for example, and ensure change color as well. So when you play it, you'll see that it will go really fast because it's a short animation. It's only 30 frames, so it's basically a little bit more than one seconds since its 24 frames per seconds in those settings. So but I know I am going to go for the with showing you how to create the effect that it will start automatically as well when you move them further away. So let's say, for example, I want to move these layers further away by pressing on shit and then highlighting them. So if a prison ship and I pressed on the first and the last key frame here, it shall select them all here, like so and when I have the blacker so here appearing, not the one that says you can go to left and right, but the one that is normally the black cursor like the selection tool. That's one. You can then juice the lier or the frames, and then you can move it further away. Or you can also press on a five. But then the key frames doesn't move for it It So right now you see that there's a few frames that doesn't have anything before the animation starts. So if I go to my window and go to my actions here, you will see that in the gold too, and play it is still on for him to. So if I tested right now, you will see that there will be a a few seconds in the beginning where it doesn't do anything. So there will be a few instances where you don't see it do anything. In that case, you can change its to that specific frame number, or you can name the frame by changing the frame label instead. So, for example, here, if I move it to further away, like at the tent frame, it starts. And I'm off this keeping for away and then pressed a five here and then a five here as well . So right now, when I tested you will see that indeed, there will be more waiting before it starts. So you see, Indeed, it doesn't start instantly. So in that case, I'm going to change the frame label instead instead of changing the frame here. Because all otherwise, every time that I move my clear here, or the frames in the timeline, I have to start changing the frame number again. So in that case, I'm just going toe name my friend label begin so that I can insert that in my actions. So right now that I'm going to go to actions, I, instead of changing into frame 10 I'm going toe name it begin between parentheses, the same exact name that I gave it as the frame label name because it has to be the same. Except otherwise it won't work. So in this case, you see that it has worked because the red dot is on top off the key from here in the night of the year. And you can That's the frame label. Only if it's a from the frame animation with the motion thing. It doesn't work. So that's why I chose on this instead. So I chose the frame to frame animation layer instead. And when I got tested right now and I click it, you will see that it will starts at the same time. That's the animation starts, so there's no waiting in the beginning, so to make it easier, it's always nice to have a frame labor instead of changing the number off the frame in the courts.
26. Animating fonts part 1: So here we have a new year picture of Canada. And we have the letters, Happy New Year here, which I have inserted thanks to my text tool. So if you select the text tool in the toolbox, you will be able to insert your own words into the box that will be created. So here, if I have a new box here, you see that I can then insert the worse that I want to create. This image I have gotten it adds on Splash.com. So if you go to the website on special.com, you will see that you can find a lot of images that you can choose from. If I go to Adobe Animate, I can then insert the picture by pacing in there. So you go here, you can right-click and copy. And you can then go to Adobe Animate, paste the picture in the stage. And right now that I have my text here, I can then go with the selection tool to the textbox here. I right-click it and then I can break it apart. You see that they will all have their own rectangle where you can then move them separately. So right now, you can move them separately. You can right-click on every single one of them again. Or you can just select them all like this. And then you go to distributed layers. Adobe Animate will then create new layers for you. Every layer for a new letter. Or you can also press on control shift T or command shift D. So right now that at this distributed to all the layers, they will also give it the name of the letter. So right now you see all these letters are in the right order as well, from the beginning until the end. So it'll say Happy New Year. And you can then delete the layer number two because there is nothing on there anymore. So I know that we are on the layers of the Happy New Year. You will see that you can do a lot of style with it. So for example, if I click on the H here and go to the Properties panel, you will see that you have a lot of ways to change the type of texts. And you can also change the spacing and the size, for example. But this is more for when you have adverting selected, which is all the letters here. So the reason is that it will not select the background is because at this locked at the moment so that it won't affect the background when I'm editing. Okay, so right now I go to the latter h. I can then add my motion tween. And I can also select all these layers here by holding down Shift and then select the first and the last frame. So if I scroll up, I can then select the last layer here. Just right-click and create motion tweens so that they will all get a motion tree. And here I can then in the beginning of the motion tween, I can click on the keyframe. And then I will see some options in the properties you see here that you can ease it in, is it out? You can also rotate several times and also changed the degrees of rotation. And you can also change it to counterclockwise or clockwise. If I change the rotate from 0 to six times, you will see that it will change it like so. But what if at the ending, I want it to turn around. So if I use my free transform tool, I can turn it around by dragging the right rectangle to the left, like so. But you can also do is you can go to your mouse and you can right-click on the letter. And you can transform and flip it horizontally, which is also possible. So you flip it horizontally until then flip it back to the original state. So here in the end, if I flip it horizontally, you will see that it will then change in the position as well when I turn it around. So this is one of the ways that you can also add an effect in the motion tree to a letter. But what if I want one letter to be big and wanted to be small and the next to the pig. You don't have to select them all and then change them individually in the properties here. You can also select it. And then you go to a line and you go to transform. And you can then change it here. So if you call the transform here, you can scale the width. If you drag it to the right side, it will changed, albeit to a bigger wit. And if you drag it to the left side, it will change the width to a smaller weight. The same goes to the height. So if you like, it, will change the height to a bigger height. And if you'd relative left, that will change the height in smaller height. If you have the chain here selected as well, make them have the same percentage. At the same time. A few click on it again. It will then make them separately. And you can then increase the height without the width moving. So then you can only change the height as well. If you want them to be together, make sure that they are the same. If you want it to be exactly the same. Because otherwise it will only change it according to the difference at the moment. So right now you can then make it bigger like so. Or you can make it smaller. So that is how you can make them bigger or smaller as well. Or you can also just use the free transform tool and make this small. And then the activists to the bottom like so to make that small. And then here in the y, you can then select it and turn it around. You can right-click coda transform, lipid horizontal like so. And then you can also rotate this. You can also select a certain degrees to go with the rotation. And here you can do the same. So let's say you click on the first keyframe here to change this to 60 degrees as well. Or five. And then you can play it and it will change in the rotation as well. So if you play it, this is what happens. So that the stand how you can change the effect of the letters rotating from the beginning until the nth. Okay, so right now I want all these laptops to fall down one by one. So how you do that? We select these words, for example, and we change it in the start of the layer. So the keyframe has to be moved to the back a little bit. So here I move the keyframe to here. Make sure that you also move the motion tween with it. So here you have to make sure that you have the arrow that is showing that you can move it to the left and to the right and drag it to frame ten. And it will then start at frame ten here. So here I'm just going to clear keyframe. And this is then how you create a falling effect with the latter swallowing one by one. So here, for example, you can wait until the arrow appears so that you can drag it to the left and drag it to the right. So here you have a lot of letters, so you have to be careful how you divide them. If in the end the letters are divided on equally, you can then add a few more frames to it so that the frames will all be the same. And you can still see the latter in the end. I have this. So I still have three to go, since it's already five frames left. In this last layer, I have to add ten more frames to eat. So here Then I select all these frames and press F5. So if I hold down shift, I can then select the first and the last layer and then adds the frames. So right now that I have all these layers starting later, you will see that all these letters will start at a later frame. But what if I want them to fall on by one? I can then drag them to the top here. And then I make sure that they will fall one by one. I can go here then and then make sure that it goes to the top. Like so. Or I can do the opposite. So instead of dragging them first, you move them all to the top first. So here you select all of them. Use them also a top first. So let's say here, this one. Here you select everything. You move them to the top first, and then you drag them one by one with the arrow that goes to the left and to the right. So here I practice to number five. I direct this to number ten, and then we continue that until we reach the last layer. So here I practiced to 20. And then I drag this to 25. So make sure that we drank all of them. Make sure that you have 60 frames because we will need it. I'm going to press F5 onion. And here, make sure that it will reach the last five frames as well. And this one as well. So here 50 and this 155. Okay? So right now we have them all separately, it's equally. And I can then drag my scroll down again. And here, I can then move them to the bottom back. So since they all starts in the beginning at the top, we will then have to go to the back here and move them all to the bottom. But what if we don't want them all to move at the bottom at the same time. I'm going to show you first how you can make sure to move them all together to the bottom. So here I can just drag it to the top here, select all of them here, and then drag them out to the bottom. So right now, if I play it, they will all fall down equally to the bottom. If I play it, you will see they will all go like so. This one can go a little bit higher so that it won't hide behind the n. So in the beginning, if I play it, you'll see that they will all go through like this. But what if I don't want them to fall down together? I can then also direct this lesson keyframe. So the left side. So let's say for example, I want this to fall down rights when the starts to move. I do the same with the rest of them, so I want them to stop exactly at the time when the next letter is going to be moving. So then I have to drag them at the same frame. That's the next keyframe will begin. So here I make sure that the keyframes are on the bottom of each other, like so. And I can drag this to frame 40 just when the next one begins. So here I make sure that I dragged it at the same time when the next keyframe starts, like so. And then you can see how they will fall down one by one, and then they will disappear. So here you see, they can all fall down and then disappear like so. If you want them to still appear at the ends, you can also press F5 picture. You select all of them here, all these layers here. And you press F5. So then if you play it, you'll see that they will all fall down like so. And then they will still be there at the end. Because if you move the motion to the left side. You will see then that there will be nothing shown in those frames because there is no twin in the frames and all keyframes either. So if you want the animation to stop at that specific keyframe, you have to make sure that there are still motion tweens if you want the words to still appear, otherwise they will become invisible. So besides of having the rotation effect with the motion tween, We can also adds a falling effect with the motion between. So let's say here I drag the letter a and first keyframe to the top. I can then drag it, for example here. And then at the ending by clicking on the last frame here, you can then drag the a back to the bottom where it should belong. So right now you see that there is a straight line over here with a lot of squares. Those squares represent f reframe that there is in between the two keyframes. So here, that is how you know that the a is going to fall down. And you can do the same with the p. So in the beginning, you drag it to the top, like so. And then at the end you click on the last frame here, and then you drag it to the bottom. Like so. You can do the same by right-clicking on it and transform it flip horizontal. Like so. So that it will have the effect that it will turn around. If we go to transform and flip this horizontal, that will do the same. So right now that I play it, you will see that they will all turn around and the letters will fall down as well. But if you also want the letters to be turning around L falling down, you can then rotate them as well here by adding rotation to it. And the same goes for the PI here in the P. I want it to rotate as well. So I'm going to add a rotation to it. And then I can ease it out here by changing it to 100. And then at the a, I can easily change it to minus 100. You will see at the ends that they have to work in and out to also show you which one has the effect of East in and which one has the effect of this out. So right now if I play it, it will show me the a is going to go faster in the end and the PI will be going slower in the end because the P has the effect of easing out. So when it is all it will slow down at the ends and when it is n, it will slow down in the beginning. So right now if I played, you will see that the a and the P will be falling down when the H, Why stops moving? So right now, I can also go here in the middle of the PI and make this turn the other sides so that I can flip the ending horizontally again to its original state so that it will fall down like a p. So if I go here and then I go to Control players, you'll see that the a and the P will also be landing on the bottom, like so. And here in the a, you can do the same. You go to the middle and then you flip it. You right-click on it, and you flip it horizontally. And then at the end, you flip it horizontally again so that it will go down like a normal a. So here I can then play it. I go to Control and then i players from the beginning until the end like that. So I can deal with the P. I can select it, go to mollify, convert it to a graphic symbol. So if I grow converter graphics or more, I can then go to Properties panel and then have an alpha effect. So the color effect will then be 0, and then it will turn back to 100% in the last frame. So here in the last frame, it is 100% invisible, and then here as well. So what you can do instead is Here you go in the ending and you press on it and make the Alpha 100% back. So here in the beginning it's invisible and at the end will be feasible. So if I play it, it will then show the peak appearing suddenly like so. And you can make it also bigger in the end and in the beginning. So here in the beginning, let's decrease the size, scaling it down with the free transform tool. And then here in the end, I wanted to become bigger instead. So if I go to Control play, I can then make this bigger, like so. So that is one type of effect that you can also create with the latter in Adobe Animate with the motion to him.
27. Animating fonts part 2: So when I create my new layer here, I'm going to call it the mask because I'm going to use it as a mask. So I double-click on it and then I type in the words mask. And here I'm going to use the text tool to create my mask. So to create the tags, I wanted to be a green color so that it will be obvious that it's a different color to see it more clearly. So here, I'm going to call it nature is pretty. If you want to change the font of the text or letters, you can always go to character in the Properties panel. And you can change the color here as well. If you don't want the color, you can change the family to another font. So the family is actually the font. You will see in the beginning as well how the font is written. So for example, you can change it to this font which is the tacked on Pro. And then you can change the style to bold. Usually they have the bowl style or the bold and italic. Or you can also find bold condense and more oblique or both extended. And if you want the size to be bigger, you can maximize it to 95 as a maximum size. And if you want it to go small at this, the aides that is the smallest set you can minimize it to. So you minimize it by going to a left eye, you maximize it by going through a right. Ok, the same applies to the latter spacing. So if you go to left, it will go negative. So minus fc is the lowest. You can go in letter spacing. And when you go at the right side, the highest you can go is 60 in the number and letter spacing. But I want it to only be 0. So let me just select it and 20 and then press Enter. So right now I have this text here. Let me change it to green that is a little bit lighter. So right now that I have my tax here, I can also use the free transform tool to make it larger. Like so. I can drag it to the bottom so a becomes larger. So right now that I have this mask here, I am going to lock this background here so that I can work on my texts. So here I am going to right-click the mask and then choose for a mask because I want my letters to be a mask. So what happens here is then that it will show the background that is behind the letters instead of the background that was for the whole background. So instead of seeing the latter screen, you will then see the backgrounds behind the latter. If you want to change the stage color, you can go to the Properties panel, click on stage and then you can teach it to whichever color you want. If you think that those solid color is too simple, you can also add a another background. You drag the layer to the bottom. So here you drag this to the bottom, makes sure at us not inside of the mass, because otherwise it will apply as to mask. So what I'm going to do right now is insert another picture here. So let's say I insert this picture here, I copy it. And then I pasted here in center. And you will see that it will dangle behind of the letters and the mask. So then I can increase the size here so that it will apply as their background without affecting the letters. So here you see that I have the background for the mask. And if I unlock it, the mass is going to have the color green again, which is the original color that I selected for the mask. But if you want to edit it, you have to unlock it so that you can work with it and ended it. When it's locked, it's impossible to work on it. Now that I have unlocked them, I want to move the background there so that it will see the effect of the latter. So what I can do is I can move it to the right side in the beginning. Like so. You see that it will select the mass as well. So I don't want the must to be selected. So let me just select the mask only and then drag this back to where it is showing, because otherwise it won't make sense that the mask is moving with the background. So here we have our background. We can then add a classic tree. And the fifth frame, I add a key frame. And then I can move this one back to the right side. Like so. Just make it enough so that it has a little bit outside of the stage so that there won't be any white area or the stage color appearing on the inside of the latter. So if I locked him back, you will see that it will then start moving behind of the lattice. So since the background here is showing behind after letters, you will see that it will move behind of the letters then instead of the latter staying green from the beginning until the end. So now it has a background that is inside of the letters moving and also a backer that is outside here. So now you have two types of backgrounds in one. So that is one thing you can do as well with the mask effect by using two separate backgrounds and then animate it so that you will see the background inside of the latter moving. So the original background here will stay in its place.
28. Video files: So when you are done much in the class, make sure to head over at the bottom of the class here you will see the tap Projects and Resources. And there you can then open up the files to check if everything went, all right, or if you miss something before you end your project or before you export your animation. You can also go to discussions here. And you can start a conversation like a feedback or ask a question. You can also share project if you want, so that everyone else can get an idea of what they can do as an animation or so that I can check for you if everything is all right in case you have more questions about your own project that you created. So I hope you enjoyed the class and I hope to see you soon. Bye.
29. Export animation: So now I'm going to show you how to export the animation as a video. So the goal off this course I want its net. You learn how to create an ultra or an intro for And if you do that, you have. So if I goto file, I can then go to export and then I can export as video. So when I click on the export settings, you will see here that you can ignore a stage color. I'm not going to use it because I don't want the stage color to be transparent. And I am done going to convert the figure in adobe media encoder. I recommend this because you will need this toe, comfort the video and and quote it before you can watch it as a venue. So here you can stop exporting after a certain time. But I will leave it until the last frame is reached. And here you can see where you can enter your documents. So here you see that it will enter in my videos. Otherwise I can go to browse here, and you can as well you can then check the area where you wants your video to be. Don't know that that so here. I'm just going to close it. And then here I press on exports and then it will open up in my adobe media encoder when it opens up in underwear media in court or you can then click on the green bottom to play it. So here, you see that I have the one with the blue link. That means that it's not done yet, so I can then go here for the so If I click here, I can then go here for the formats and I can change my presets as well. So preset is where you want it to be applauded, for example. So here you see that you can choose between all the types off platforms or social media where you can upload it on. And then you have the format here where you can uploaded s and you have fit as animated GIF , for example, and using other type. But I choose this type two upload as a video which is the H 264 Because that is the best quality option that you can choose from when you monsoon upload a video. So if you want to export for, You know, you can export all us more. Although there's no own you're here. But you have to make sure that you check this one in case it does. So that's no need to use this one. And when you publish it here, you can check where you want to publish it. There are types off media's like social media Facebook or you took where you can publish it instantly. There, he only have to look in just like into ITER as well. You just have to lock in and it will posted there for you. And then here you can have the something's off. The video s well, and that's the old you so you can check the encoding set things a bit rate sad things at Sitra. If you have ah, high performance PC, you can make your bit rate higher asthma because it will be easy for the process, er to process it. So here you also have the multiplex er, which I will leave at and before and then here you have the FX, in case you want to add effects of it. So this our own what you can do, and I have chosen this some things which are the best one for me. So when I am done, I can then click, OK, and then here in the costume, you will see the presets that you can choose from as well. So this one is the formats and this one is the preset. Okay, so I know that we are done. You can then click on the green bottom here which will start the cube. So when you click on the green bottle and will start encoding it for you and then when it becomes invisible in the beginning, you were then be able to watch the video. So if I go instantly to mind holder where it is, don't know that that I can then open it and it will please for me. So that this then how you can create a figure out off it and then whichever suffer that you're using, you can then import it as a video inside off the existing recording
Samantha Chan, Creative softwares
