 Oh, hello. Welcome. Yeah. Okay. Yeah. Thank you. Thank you. Welcome to the principles of animation. My name is Jasti Almasson. I have about 40 minutes worth of material that I have to do in about 20 minutes. So, let's do this. So, I'm an animator. I don't have time to show you my actual show reel. So, just believe me, this is kind of a collage of the past three years that are different shots that I worked on. Anyway, this is Frank and Ollie. So, like, Disney legends back in the day. They are two of the nine old men. And in 1981, they published a book that is kind of this compilation of things they learned from, like, way back when, like, in the thirties or whatnot. And this kind of compilation consisted of a lot of different concepts. And there's this famous list that you could find there called, like, the Disney's 12 basic animation principles. It's a list, of course, because humans love to make lists. And the number in which it's put there, it's a little bit nonsensical, because it's not like, if you learn this thing, you need to learn first squash and stretch or whatnot. So, let's just get rid of the list. So, think of it as all these different concepts, things that you're going to have to learn to do, to master, if you want to be a good animator. I am still learning, you know? I'm not on some mountain top, you know, shouting down on everybody. I'm still a little learning young boy, trying to do better every time. And the thing is, if I had to, like, think about all these different concepts, they all get a little bit jumbled up, because the way they connect to one another, there's, like, that Venn diagram going on, where it's hard to explain something in a vacuum. You might remember, let's see, last year, I had a talk. There was a massive failure. I had massive technical problems. But the kind of underpinning idea of it was that, as a hypothetical, what if I had to take those principles and I had to teach it to a younger version of myself? So, this guy doesn't know anything about the principles at all. So, that's kind of the challenge that I put forth a little bit. And this is the way I would do it right now, as of today. Doesn't mean I won't change it up and do something else, like, three years later or whatnot. So, it's, you know, there's a bit of subjectivity going on there. But let's just start off with the list. So, if I had to hypothetically talk to young, past version of me, I would first strip away the numbers just for a second, just think of it as, like, individual concepts. And, you know, I would take away straight ahead action and post-abose, because those things are workflow-related things. They are not principle in and of themselves. Also, it's missing layered action or layered animation. Also, appeal is the thing you strive for. It's not a principle in and of itself. So, take those things out. Follow-through and overlapping action are two separate entities that should not be combined. So, splitting those two things up. Staging is one of the broadest things out of all the things there. And it's insane how many things it touches upon. Cinematography directing, acting choices, all those things. So, there's some subjectivity in, if I wanted to split them up, I could split them up in, like, ten different things. But I decided to split them up into two categories, two things. And then renaming some of these things, because, if I go back, things like ease in and ease out, a better name for it is, spacing, which is the term that is used for animators in the field. Also, I just threw asymmetry in there because that's stuff that I use a lot and I use it as a principle and I get a lot of appeal out of it. So, you know, suck it. That's what I'm going to do. And then, this is the way I would kind of order things. It was not easy to come up with this list and I had to redo it a couple of times. Also, I don't want to throw at you some definition, some, like, quotation marks from the masters or whatever, that, you know, spacing, blah, blah, blah. As an example for this, I just want to show you examples. That's all I want to do. And this is the list I came up with given that constraint. So, timing and rhythm, just like a painter, just like an illustrator or whatnot, you have a canvas that you have to work within. It could be measured in centimeters, in pixels, whatever it is. But that's your canvas. So, it's very much our canvas also, but the frame rate is also our canvas. So, it adds another dimension to it. And for stuff that I can't get into now because of legacy or whatnot, 24 frames per second has become kind of the standard for frames per second. And if you're learning animation, I would recommend starting off that way. And then going on from there, if you want to go 40, 60, whatever it is, or 12 frames per second. There's certain ways that you would tackle that differently than 24 frames per second. But 24 frames per second is a good starting place. So, you know, let's do the kind of boring thing, a bouncing ball. Okay, so we're going to do just a basic bouncing ball. So, there's going to be A and a B. There's going to be an up and a down. So, it's basically as if you just let go of a ball. So, there's going to be the extreme pose up. And then let's just say a translator or whatever, go down. Now, we know because of gravity or whatnot, it's going to go a little bit less up every time. So, a translator, up, a translator, down, a translator, up, a translator, down. Okay. So, if you play it, something wrong, of course, inherently. So, it's doing all the right poses, but it's not actually doing it in the frame rate, in the dimension of time. What should be happening, of course, is that those things shouldn't be that even. It should be squashed together. So, it kind of bump, bump, bump, bump, bump. And if you do that, all of a sudden, you're thinking in those terms of thinking in time. Now, rhythm also kind of comes into it. Because if you have a lot of different acting beats happening, let's say, you know, you have a character who's doing this, that, this, that, this. So, it's like five different things. The way those things happen, if they're very even, you do this, that, this, that, this, it's going to be not as interesting as to split up and do something else with that rhythm. So, if you just beat it out and you go hit, hit, hit, hit. It's not going to be as interesting as dun, dun, dun, dun, or dun, dun, dun, dun. Or you know, you can do different things, dun, dun, dun. The hypothetical is, and this is like an acting exercise, you know, there's a stream in front of you, and you're imagining what is the most interesting way of crossing that stream. So, you do, you know, you ask a lot of people to do it. And the least interesting way is step, step, step, step, step. That's like the least interesting way of seeing somebody do it. More interesting is step, step, step, step, step. It changes up the rhythm a little bit. So, you can get a grasp of that. Oh, okay. Next topic. I don't have a lot of time. Spacing. That is, you have the two extreme, you have like two extreme poses and between every single key frame, there's going to be some space in which that thing travels. So, that's the space. Now, if I move my hand from A to B, I might slow it down. So, the spacing gets really narrow. The more I get to the end final position, which is kind of slowing down. So, the further the spacing, the faster I'm actually traveling. So, you might think of this as being kind of blocked, meaning these are all the poses that we really need. And then we need to figure out what is happening in between those poses. So, we got the computer to just do it linearly. You would get something like this. It doesn't look good. The spacing is all kind of flat. So, if you just kind of look at what is happening there, and I put like lines there just to indicate where's the kind of center of mass. It's putting a breakdown in the straight in the middle. And then of course, there's going to be a second breakdown. It's also in the middle. And then you have some in-betweens. It's all kind of, it's all exactly the same space. But what if you just splined it? It looks a little bit better at the top. Feels a little bit more natural. But of course, it gets all wonky and looks kind of weird. So, if we just look at that, it's going to be exactly the same way. There's going to be that breakdown in the middle. And then it's favoring the beginning pose and favoring the end pose. Now, these two versions are examples of spacing, different spacing. But they're automatic. They're giving to us by the computer. And we need to do something more intellectual, I guess. We need to come up with what should the spacing be. So, if I take a ball and I drop it, it's going to favor the topmost part. So, I'm going to do a breakdown there. I'm going to favor the first part. And then I'm going to do another breakdown that favors it. And then the in-betweens. And then it looks better. Next topic. Squash and stretch. Anything can be squashed and stressed to a certain extent. I mean, if it's a bowling ball, then maybe not. But maybe you're exaggerating it. It's a little bit of it. But you need to remember it's squashed and stressed. It's not squashed or stretched. By that, I mean, you don't just take whatever it is and just scale it down and you're done. It's scaled down and scale out. So, it always keeps the same consistent shape or volume, if you will. You can push this further, of course, and it always should feel like it's the same density going on. So, you don't want that. You don't want just scaling down, scaling up. Because then it starts to feel like, if you just imagine a liter of volume of something, it just feels like it's losing mass and gaining mass. So, out of the example that we just did, how do we apply that to this? So, we have exactly what we did now. We take the pose where it kind of pushes down, hits the floor, and we just squash it down and stretch it out. And then the one just before that, that's the one where it has gained the most amount of momentum. So, we do the flip side to that, exactly the opposite. And on the way down, it's gaining that momentum. So, all the other ones need to kind of go into that. And then it looks kind of nice. Next topic, arcs. Let's say we have exactly the same thing. But now we have the ball and we just want to push it. Give it a little bit of a nudge in that direction. Okay. So, now we kind of just have the blocked version of it. We have where it goes up, where it goes down. It's all the same thing, but now it's just pushing it to the side. So, here are all the different extreme poses. The thing is, you know, you might take what you just learned and apply it to this and go, okay, draw straight lines, figure out the spacing, the breakdown. The problem is, you're doing straight lines when it should be an arc. Because the momentum in one direction is not necessarily going to affect anything in the other direction. So, if something's dropping down and you push it, that push in that direction is going to be exactly, it's physics. It's physics. It's basic. Okay. Keep on. Go ahead. So, it looks more appealing. It looks cool. There's something wrong, though. Based on what we just learned, we did the squash and strats. It's happening, but it looks weird. It's because the squash and the stretching should always be in the direction in which things are happening. So, just by tilting it, because now we're kind of going in this tilt. Yeah, just follow that. Okay. That looks better. It's subtle, but it's better. Any given, like this failure here from last year, he's moving. And if you pick any point in his body, he's moving in arcs. And if you forget that and you're animating a character, he's going to feel like kind of rigid and stiff and weird. And I am actually a little bit stiff there. Anticipation. Next topic. Let's say everything's the same, except like we have the ball and it's going in one direction, I guess it's flipped that direction. But we're going to start from the ground. So, what happens when we start from the ground? It looks like somebody just kicked it. It came out of nowhere. Like there's a lot of energy that got exerted, but it came out of nowhere. So, we're going to squash it down first, and then we're going to go there. So, this is all about winding up. If I want to throw this thing, I'm going to go back and then throw it. So, this is the anticipation and this is exerting the force. It's like coiling a spring and then springing or whatever it is. This gives inanimate objects a lot of agency. So, be aware of that. So, if you have a ball and I drop it and it just bounces down, you won't think that ball is a human being or a personal character. But if you do something like this, now all of a sudden that ball wanted to jump. So, there's a certain level of agency that the viewer is going to give it to it. Next topic, draw and follow through. So, imagine that I have a yo-yo and it's not actually spinning, but it's kind of on the string. And I want to go here and I want to stop. So, if I start going, that yo-yo, it's basically inertia, that yo-yo wants to stay put. So, it's like an annoying toddler that doesn't want to do what you say you want to do. So, you go and the toddler's like, no. And then, it'll drag along finally with you, but at some point you stop and you're like telling the toddler stop and it's like, no. And it keeps going. So, this is the drag where you have to drag that toddler around and then when you stop, the toddler's going to do that follow-through. So, there's not necessarily a lot of agency in it, but it's basic inertia. So, here's what it looked like with nothing animated at all. So, I gave this ball a little weird pink ponytail thing. So, let's say the ball is pushing up, but instead of just having it do nothing, it's actually wanting to be where it used to be. So, it's dragging behind. Same way, if it reaches the top, it reaches usually kind of an equilibrium and then on the way down, it wants to be there at that equilibrium. So, it's like, no. I want to still be up there and it kind of drags behind. That is drag, but the follow-through is when you, as the ball, hits the ground and wants to go in another direction, that little annoying toddler keeps wanting to go in the same direction it used to be in. So, it kind of pushes down when it should be going up and that's it. Asymmetry. Copy-paste it, the exactly the same thing, the ponytail thing, but now it's kind of like bunny ears and this guy's just kind of jumping up and down. Easy peasy. Problem is, it's very symmetrical and like, if you thought of it very objectively, this is fine, it does what it should be doing, but if you gave it asymmetry, then it's more appealing. So, like, you strive for that appeal. And this is not just in the, like, the first posing or the last posing. This is like, throughout the entire animation, you're making sure that they're behaving differently. This also applies to poses, this applies to, I mean, all of these things. I'm really breaking it down to the bare bone basic levels and this, everything applies to bigger ideas. So, it applies to posing, for example, and facial expressions. In this case, you have exactly the same, well pretty much the same facial expression, but the difference is, I went in there and I tweaked a lot of these different little bones to give it that asymmetry. So, if I just flip it, just something a little bit more appealing about it. Next topic, overlapping action. This is not to be confused with follow-through or second-direction, but I'll talk about that later. The ball has now graduated in becoming a ball boy. Sure, why not? And if I pose him in a pose, so this is pose A, and then I want to end him in a pose B, so there's another pose there. And if I just, out of the, out of these two things, out of these two kind of extremes, if I just made everything move at exactly the same time, it would feel weird. It would be like, you know, so like all these different body parts, all this stuff would just flow, like start and stop at exactly the same time. It just looks weird. So, you have to do a breakdown pose, and that one will start inferring what is going to be the overlapping action. What is leading the action, and what is kind of being delayed, and comes after everything else. So in this case, for example, I'm doing the eyes. I'm making the eyes lead, so going from one pose to, you know, making the eyes go first. And by the way, this is the simplest version of this. The more breakdowns you then add to it, the more you start making all these smaller decisions, like the hands might not stop at the same moment or whatnot. But this is one decision. Another one might be the hips are leading the action. So maybe the hips go first, maybe the arm swings first and then everything catches up to it. So overlapping action starts touching less about inertia and more about agency and acting choices. And just an example in the wild, this is Dixie, and when he rotates around, he's leading with his chest. So his head kind of swings around, catches up with him. So second direction, this is such a vague term, just on a linguistic scale. I'm giving a talk right now, but my second direction is drinking iced tea. So think of it this way. So in this case, you have parents and the child and they're talking to one another and what they're talking about is what the scene is about, but they just happen to be eating right now or not eating like picking their food and that's a secondary action. So it's more of an acting choice. You know, this dude is pouring himself some iced tea while he's engaging with a guy. And the cliche, the cliche that will stick in your mind is actors using cigarettes. That is the cliche because it can be kind of a crutch to an actor. So they're giving a performance and they might give a performance where it just happened to be smoking, doesn't really interfere at all, but they might also use it to complement the primary action or the primary acting choices. So in this case, I think she's saying something about paying and you can see she splits up her line, does a little thing as you're paying. So it now complements the way she delivered that line. So by the way, a secondary action doesn't always have to be something like the primary one is they're talking and the secondary one is like a thing they're doing. You can be dancing on a dance floor and you happen to be smoking. So you're dancing and the cigarette is there, but it's not the main thing. But you might be a smoker that hasn't smoked the whole day and you're like a heavy smoker and it's all about the cigarette. But you're on the dance floor so you're smoking, but you just have to be dancing because so now you've flipped it around. Acting choices, anyway. Exaggeration. Everything I just taught you about. It can be pushed further. So squat stretch, you can push it further. You can you can take arcs and you can make them more extreme and push them further. You can take timing rhythm and just wrap it up. Usually you take poses and you wrap them so far that they break like they don't make sense anymore and then you know and take them back. The tendency for beginners is to just go a little bit further, little bit further, and then you don't end up where you need to be like it takes forever. Just as an example, smile, happy, hungry. More smile, more happy, more hungry. This also has to do with like, you know, if you do a breakdown pose or whatever, you know, maybe it's leading with the hips, but maybe it's really leading with the hips. You just push it further. Next topic. Consistency. This applies to like the world, the characters, the animation style also. So if you have if you have a character, it's very important that this is why they do model sheets for example. So that Cinderella is the same one from this shot to the next shot. Otherwise you're like really confused like who who had the slipper, who had the glass shoe, I don't understand what's happening. So you do these model sheets and you make sure it also bends on a lot of variables like from what angle are you seeing the character. But this also is a broader thing because if you have even the same intellectual property and your anime, this is the top one is from 2014. I animated that one and I animated the bottom one from 2016. There's the same guy and he's searching for things or whatever. But it's different animation style and you can see it and I'm not just talking about the character design but the animation style itself though they would not belong together in the same world. So there were choices being made deliberately and then you have to stick to those choices and work within those boundaries. So you know maybe stuff like gravity is not a thing you know when it serves the purpose of a joke you know. So you can't take things for granted. Next topic. This is such a freaking big one but just as an example. So like here you got Agent 3 to 7. You got a shot where Boris the big white guy. He just got punched and he fell on a dresser and on that dresser there's going to be a figurine holding a razor blade and he's going to notice it. He's going to take it up and he's going to start using it into the fight. Okay let's just talk about the elements that are there. So there's kind of a foreground element going on there with the bust. There's the little figurine there's Boris of course there's the agent and then there's you know background stuff you know. Sometimes that background stunt will interfere but sometimes not it's fine. So what if what if I think that you know we can adjust this a little bit more. This looks actually kind of weird. What if we took the camera a little bit in, changed the lens and moved it a little bit to the side that already feels a little bit better. Now rotate Boris so it's facing us a little bit more. The figurine is facing him which would be great if we saw things from his point of view but we're not him. So you know maybe turn it around so then we have a like a nice silhouette of that figurine and right now it's kind of in his nose so let's push that to the side and the agent is kind of coming out of the frame so let's push him back. So yeah now we got our frame took took a while and it's the same information being relayed but one is more appealing. This is the actual final shot by the way. So this applies also to just clarity of posing. I'm condensing so much into small time. So you know if you're doing posing if something can read just on a silhouette level that's great and you want to strive for something like that. Can't always do it but you know that's great. Next topic readability and focus. So if something 24 frames per second if something's there for one frame it can kind of pass along and then you notice it but not you don't read it. It needs to be there for at least two frames if it's 24 frames per second that's going to be one 12th of a second. But if you hang on to it longer it's going to be more readable to the viewer. So these are the three bouncing balls. First one is just the one we've done before. Second one it holds that extreme pose of squeezing down for two frames works within that pose. Third one for three frames so you can see the difference. So if you want to emphasize that downward pose of that squashing maybe you can maybe you need to go with the you know three frames but you know it is also you know if one if if something's a bowling ball and something's a water balloon it's going to be different but that's besides the point. But maybe you are extending your plausibility of your world so much that you're kind of breaking it. In that case you maybe want to hone it back down. So there's a lot of choices to be made there in just readability. This also applies to like if you're doing a walk cycle and you want to have character that you know when you have the extreme pose of extending the leg and then he's pushing his weight on the leg. If that straight foot pose is only one frame then it's not going to be as readable as having it be roughly two frames working within that pose and then you get that extra weight down on it. This also applies to like lip sync for example if you're doing like MPB or something like ma pa pa you want if you can depending on dialogue you want to hold it for like two frames. This makes it more readable. Where am I? Readability, yeah. So it's also if you have a thing coming up in your screen and the viewer might not already know what it is. Like it maybe the viewer didn't know this was reasonably late. It wasn't really established. So how long do we have to linger and make the viewer catch up to this information? So if he just kind of lands there takes the thing and kind of runs away with it. We don't have what happened. It's just motion blur. It's like watching a Transformers movie. So just as an example, so the agent throws a punch and it gets kind of blocked by Boris. So he kind of grabs it. So I did a lot of experiments with how long should that stay because if he does it and just right away goes to the next move, we didn't really see what happened. It was very kind of confusing. It's just a lot of motion blur. But if he lingered for too long, this is by the way, it holds for roughly nine frames. If he started lingering a little bit longer than that, then it starts feeling like the agent is just punching. He got stopped and he's waiting to be punched again or whatever. He's not actually reacting to the situation. So there's this fine line sometimes where you want to push the readability, but not so far as to whatever the urgency of the scene is. Now there's also the matter of focus. I am, you know, when I'm animating that thing, I'm leading the eye towards that focal point of where he catches the hand. Now, if something else happened on the right side of the screen and maybe at the same time, you're going to be kind of distracted by that thing that happens on the right side. And your eye is going to be like, do I look here or do I look there? And that's going to be a problem because if things happen exactly at the same time and you won't have time to go back and forth and really like understand, read what's going on, then it's just going to be a missed opportunity. So, you know, if you have any kind of a shot, there's only going to be one focus point that the viewer is going to look at. And this might not be the best example, but it's one example at least. So, you know, you're looking at the dog, oh, a chicken comes in. Now we're looking at the chicken and the dog is laughing and then the chicken is doing that thing. So it's not that he laughs at the same time as the chicken comes in. It's at least going, and that's where the rhythm thing comes in also. This happened, this happened, this, this, this, this. And I hope that if I met my younger self here somewhere, this would be something that would be kind of helpful. And this is not, I mean, I'm not, I don't want to put myself on any kind of a pedestal. This is something that is a bit subjective, like these are all principles that already exist and I'm just rearranging them a little bit to cater somebody that might not know them in a way that I think makes sense. So I don't want to do the whole click-baity thing of being like, these are the new principles with this. So maybe this is like the very subjective list of healthy ass of 2017 right now and in my chains in the future and you know, everybody. So I'm going to meet a couple of you animators out there at the bar. You're going to punch me in the face for doing this. Anyway, so that's my thing. Thank you so much.