Important Notice:

As of September 15, 2016, we no longer publish new courses on this website. We encourage you to use your Digital-Tutors credentials to sign in on Pluralsight where you'll find all new creative courses, skill tests and paths, 1:1 mentoring and more.
Creating the idle animation
See Details
Joshua Kinney

Pluralsight

Joshua Kinney
In this lesson, we're going to create an animation for our 2D character. All right, so we're going to create a very simple idle animation for this character, just to kind of show you the animation tools. So to get started, let's go to Window and Animation. With that, let's go ahead and left click on the Label, and let's dock that below our scene view, and then I'm going to drag that up just to kind of make it a little more even. So to get started here, the first thing that we need to do is go ahead and select the character, and then we need to add a new animation clip. So to do that, we're going to left click right here in this empty space, and it's going to say create new clip. Here, we can go ahead and navigate to the folder we want to store this animation clip-- so I'm going to go to Assets Anim Clips, and then give it a name. So let's call this idle, and hit Enter. It's going to do two things for us. First thing that it's going to do, if I go to Anim Clips, is it's going to create the idle animation clip and then it's also going to create the animation controller. That character animation controller is then applied to an animator component, right here. With the animator component, I want to go ahead and turn off Apply Root Motion, because there is no root motion for this character. And then I want to turn on Animate Physics. Now the reason I want to do this is because I want to sync the animation with the physics fixed update function. And it's just going to make the animation run consistently with the rigid bodies that are applied to this character. So everything else is fine. Now we're ready to get in and start adding key frames to our character. So if you're unfamiliar with-- let's select our character-- so if you're familiar with animation, this might be a little confusing at first. You might want to take a look at maybe our CG 101 course, you might want to take a look at an introduction to animation course, just to kind of get an understanding of what key frames are and how they hold information to make characters and objects move in something like Unity or Maya or 3ds Max. So I'm not going to give you an absolute beginner tutorial here. We're just going to go with what we know right here inside of Unity. So the first thing that I want to do after we've created our clip is I want to set the frames per second. So right now it's set to 60, let's go ahead and set it to 30 and hit Enter. And what that's going to do is just make sure that whenever I hit Play on this, it's going to play 30 frames per second instead of 60. You can adjust that to 24 if you like-- it's totally up to you. So the first thing that we want to do is we want to start adding some key frames and getting this to animate. Now, in order to do this, we want to make sure that Record is turned on. And you'll see that it does a couple of things-- it adds the slider to the timeline here, and then it also turns our Play, Pause, and Skip Forward red. And that's letting us know that we are ready to animate. So to get started with animating, the only thing that we need to do is go ahead and adjust the time slider to where we want to create a key frame. So in this case, I'm going to go to frame 15. Now you could type that in here if you want, if you're having trouble placing it here on the timeline this way. And that's done by just left clicking and holding right along the top. So if you want to type it in, hit 15 and then Enter, and that will snap to that place. Now what I want to do is I want to select the upper right arm, and I'm going to rotate this to where we get a little bit of an arm swing. So looking at this, you could use the Rotation tool, but that wouldn't work. If you use the Rotation tool, it's going to just rotate the entire object, but it's not going to give you the key frame that you desire. We're animating sprites, so what we want to do is we want to use the Interactive Transformation Mode here. So if you left click and hold in the middle of the sprite, that is going to move, and that's going to give us a position key frame, as you can see here. Position is highlighted in red, and it's letting us know that all three of the values, the x, y, and z values have been changed from their original position. If I left click and hold on the outside corner, you'll notice the icon-- we have this Rotation icon next to the pointer. If I left click and hold on that and drag, that will rotate around the pivot point that we set. Notice how the rotation has turned red, as well. Now, if you left click and hold on one of the corners, that will scale the object. Now it will also adjust its position, as well. But now you can see that we have a Position, Rotation, and Scale key, and all of those are on the upper arm right. Let's go ahead hit Control Z a few times until we remove those key frames. Now it may not go all the way back by hitting Control Z. That's no worries, though, because what we can do is we can simply right click on the keys and say Delete Keys. And we could do the same thing here, if we wanted. So I'm going to right click and say Delete Keys, so it's going to snap back to that original position, and then I can add in the key frames that I really wanted in the beginning. So select the upper right arm, and we're going to hold down right on the outside of that corner. We're going to rotate it back just a tiny bit, and then, actually, let's move our Time Slide here. Let's go to frame 15 and then move that back. It's going to create that key frame at zero, for our original position. And then what we're going to do is we're going to go to frame 30, as you can see here, and we're going to copy this key frame here. Now, this is going to be a little different-- we can't just duplicate this key and then move it over here. What we need to do is go ahead and just hit Add Key Frame, and that's going to add that right at that 30 mark. But then I'm going to select that key frame, and I want to type in zero. That's going to make sure that the rotation value is the same as the rotation value here. Now you'll see here that it's actually not zero. So let's left click on that, that should highlight all those numbers there, and we're right click, copy, let's go to this one, and we'll left click, right click, and then paste. Now if I hit Play, you'll see that it goes back and forth. Now you'll notice that the arm position-- it seems as though it's hitting a wall whenever it goes to the end of the animation. And the reason for that is because our curves are not set up properly. So we want to smooth out this animation, and that could be done by going down to Curves right here. So looking at our curves, you may be a little confused as to what we're actually looking at. Well, you can see the timeline moving from zero to one, and if you'll notice, this key frame right here-- we get this really sharp change in value, and that's what's creating that abrupt change in direction, as though the arm is hitting a wall. So one thing that we can do is go ahead and left click on that key, and then over here, hold Control and left click on that one. So we'll have two keys selected. Actually, it's not going to let me do that. Let's go ahead and zoom out a little bit. Let's just do it one key at a time. I thought we could select two at a time, but I guess not-- oh, it's hold down Shift, excuse me. So hold Shift and that will allow you to select those two keys, and then we can right click on it, and we can say Flat. What that will do is it's going to flatten out the tangent, and it's going to smooth that out a little bit more. So now if we take a look at our animation, you can see that it doesn't appear as though it's hitting that wall, giving us that abrupt change in direction. Now the arm is going a little fast, and so what I want to do is I want to slow down my animation. Now, to re-time an animation, we need to go back to the Dope Sheet, and this can be done very, very easily by simply-- lets hit Play on that so it doesn't play any longer. And all we have to do is left click on the top diamond here, and then move that to the frame number that we want-- in this case, 60. Let's go ahead and move this one to one, and then now if we hit Play, you'll see that the arm moves a little bit slower, creating the animation that we're looking for. Now if you want, you can come in and you can animate some other pieces to make the idle look a little more fluid and a little bit better, I would say. So you could do the same thing to the arm here. So grab the left upper arm, go to frame 30, in this case, and then you simply rotate it back some-- just a tiny bit, not much. And then we'll go ahead and we'll create a key right here at the end. So if I left click right here it's going to snap to that automatically. Let's go ahead and just simply hit Add Key, and then I'm going to go to the first key here. We're going to left click on that value, right click, copy, and then we're going to go to this one, left click, Paste. And then if I hit Play, you can see that the arms kind of move there-- that one moves just a little bit-- they're not quite enough, I think. So let's hit Play, let's select this key right here, and then we're going to rotate that back some-- might makes that go just a little bit further. And then if I hit Play, you see the arms kind of swing there. Now you can see here that we kind of get this twinning motion-- it doesn't look all that great. So what I'm going to do is I'm going to just adjust the time of that back arm. So if I take this key right here, I can move it back on its own, and I can make it swing just a little bit faster than the other, and we get kind of that sort of motion there. Maybe make quick adjustments here. Now remember, we're getting that abrupt motion, and so we need to make the adjustment to our curve. So, just left click on that upper left arm, go to Curves, go to that key, and you can just left click on this one, right click, and Flat. Go to the other side, do the same thing. And that's just going to make it a little smoother. Now you'll see here that it moves very, very quickly and it doesn't look quite right. And so what I'm going to do is I'm going to just simply hit Play, let's go to our Dope Sheet. Let's left click on that key, the timeline is going to snap right to that. Let's make that move a little less, not quite as much. Now lets hit Play. I don't like the speed of that. Let's go ahead and try to even that out a little bit more. Let's go to the other side of that. And you want to just makes that barely move there. There we go-- something kind of like that. It's not twinning quite as much. And by twinning, what I mean by that is it's the same motion, and it just doesn't look natural. Now you can also come in and you could select the body, and let's go halfway here. And what I'll do is I'm going to rotate this down a little bit, just like so. And then let's go to the last key frame. We're going to add that key. Let's select the first key, select the Z rotation, right click, copy. Go to the rotation on the body, left click on that last key frame, left click, right click, Paste. So that way we have that looping animation. And we know that we need to adjust our Curves, so let's go ahead and just go to the Curve. Select that last key, right click Flatten. Now, Flat is not always going to be the best solution-- sometimes you may have to right click and use something like Right Tangent or Left Tangent, and set it to Free. And that will allow you to move it using that Tangent Handle. So you may be asking well, how do I know if it's left or right tangent? Well, if you select like this middle key here, if you want to control this side of the line, it's going to be the right tangent. If you want to control this side of the line, it's going to be the left tangent. So for this key frame here, it only has the right side, so you're going to adjust the right tangent. For this one, it's going to be the left tangent. So now that we have that, let's go ahead and hit Play, take a quick look at that. You can kind of see that we've get a little bit of an animation going there. I think he might be kind of moving a little too much, in my opinion. Let's go ahead and pause that right there, go to Dope Sheet, and we're going to select key. Let me go ahead and bring that up just a little bit. So you get something kind of like that. We've created just a very, very simple idle animation. Now you one thing that I want to mention really quickly is you're not just limited to Move, Rotation, and Scale-- you also have things like Opacity. You can turn an object on and off, and things like that. So, for example, if we wanted to do an eye blink, I'll show you how to do that really quickly. Very, very simple to do. Let's go to the one second mark, and let's take this eye, and what I'm going to do is I'm going to simply uncheck this. And because I have the Record on, if I uncheck that, it's going to animate that. Notice how that turns red. And then, I can go right before that, one frame before, and I can turn it off and then back on. And so you notice that the Game Object Eye is turned on at frame one-- so the eye is on. It gets to this point, turns off. Let's go a key after that, turn it back on. Let's go to the end, let's turn it off, and then back on, and then if I hit Play, notice what happens-- get a little bit of an eye blink there. You could slow it down a little bit by spacing out those key frames on the middle. But it's a really quick blink there. Let's go ahead and hit play. If you want to adjust that, like maybe one frame, make that slow down just a little bit more, and you can see that in game. All right, so we've created a very quick idle-- looks pretty neat to me, I like the way that looks. So what we're going to do in the next lesson is I'm going to show you how to do a quick walk cycle. So we're creating a zombie walk here, so we're not going to get real intricate-- it's going to be kind of a lumbering type of movement. We just want to get the animation ready for whenever we start scripting, and then also it's going to be helpful to show you how to use the Mecanim system and how to blend. So we'll get started with that next.
In this series of training we will discuss the major components of working with the 2D features in Unity. We'll start off by learning how to set up a 2D Unity project. Then we'll learn how to properly import and slice our sprites. After that we'll learn how to manipulate sprites by blocking in a simple platform level and also learn the importance of Sorting Layers.

Then we'll jump into the real fun by assembling, parenting and animating a character. By the end of this tutorial, you will have a better understanding of working with Unity's 2D features.
Introduction and project overview
1

Introduction and project overview

 
00:45
Setting up a 2D Unity project
2

Setting up a 2D Unity project

 
13:05
Manipulating sprites
3

Manipulating sprites

 
14:03
Setting up props
4

Setting up props

 
13:35
Slicing the character
5

Slicing the character

 
13:57
Parenting the character
6

Parenting the character

 
09:25
Creating the colliders
7

Creating the colliders

 
11:10
Creating the idle animation
8

Creating the idle animation

 
17:31
Blocking in the walk cycle
9

Blocking in the walk cycle

 
11:50
Finishing the walk cycle
10

Finishing the walk cycle

 
08:06
Setting up the animations
11

Setting up the animations

 
04:49
Scripting the movement
12

Scripting the movement

 
12:55
Using sprite sheets for animation
13

Using sprite sheets for animation

 
07:48