Animate Yourself as a Peanuts Character in Procreate

This video is sponsored by Squarespace. Apple posted a tutorial video over on their YouTube channel the other day and hat tip to them. It is really solid. The tutorial is about how to draw yourself as a Peanuts character. Now, fellow tech YouTuber and fellow Clevelander, Trent's Tech was like, Can you take this further? Heck yeah, we could take this further. To do this, I'm going to be using an app called Procreate on the iPad. Now, while I'll be using a Peanuts character, what we're going to be doing today will work for any art style. So where do we start? I like to block out a really rough animation first. And I mean, really rough. This is just a circle and some blocks drawing detail. It takes time. If the animation looks OK with no detail, it's going to look even better with detail. And if we need to make any changes, which we will, it's going to save us a ton of time in Procreate. Let's go up to the wrench icon. Go to the canvas tab and turn on animation assist. This is going to bring up a handy animation toolbar. You're going to see that down here along the bottom of the screen. In Procreate, you have layers. How this works is every layer becomes a frame in your animation. Looking at the Peanuts character's animation, it's subtle. They don't zip around the screen, move really fast. And even though the animation is subtle, it's really effective. Before every move, the character previews that move for about one frame. In animation, this is called anticipation. For example, before that head goes back, it goes forward just a little bit. So for our simple animation today, we're going to make this four frames. Frame number one is the head. It's starting point for head is going to move forward just a little bit. Frame number three and four are going to have our head moving backwards. I'm going to tap on my frame down here and I'm going to go and tap duplicate. Grab the selection tool at the top and let's select the head. Then with the arrow tool, we're going to move it forward and down. Now, like I said before, this is just a tiny, tiny bit. You may see a transparent version of your last frame. This is something called onion skinning. If you don't see this, you can turn it on by tapping on the settings and then adjusting it there. I love onion skinning because it gives you a guide that you can follow as you're creating new frames. Now, what I'm going to do is I'm going to repeat these steps, but this time we're going to be moving the head backwards again. Notice how little I'm moving the head each time. It's only a couple of pixels. This is going to give us that nice, subtle animation. If we do it too much, like I'm doing here, it would be way too jerky. Now, this would be fine if your character was getting hit in the head with a snowball, but we're just having our character talk. So once the head's looking pretty smooth, I'm going to go back to each frame and I'm going to add in a hand movement. We're going to be using the same principles at play here. Frame number two, we're going to add that anticipation. We're going to move that arm just a tiny bit. Frame number three is we're going to see that arm move way up. And frame number four, it's going to move up just a little bit. Now, before we preview this animation, I want to add a pause at the beginning and I want to add a pause at the end. So what I could do is take frame one and duplicate it a couple of times. But Procreate has this nice feature called Hold. I'm going to tap on the frame and then I'm going to set the whole duration to four. I'm also going to go to the last frame. I'm going to tap on that and set the whole duration of that to four as well. Nice. OK, this is going to work. Now I feel comfortable creating the details. Let's put our character into this. Now, when I'm doing this, sometimes I'm going to turn on the animation assist. Sometimes I'm going to turn it off when I'm drawing. I like to toggle it off. You know how I mentioned that every layer in Procreate becomes a frame in your animation? Well, a layer folder or a group also counts as one frame of animation. So what I'm going to end up doing is taking my polished artwork and I'm going to put it all in one folder and call that frame one. That way, if I want my line art on one layer and my colors on a separate layer or anything else, all of that is in one folder. Cool. Let's draw this character. OK, that folder has our character. Now I'm going to repeat the animation steps we did before. You can redraw your character for each and every frame, or you can take the easy way out like I have been doing and duplicate each folder using the select tool and just moving the hand around and redrawing just the arm. Once that looks good, we're going to repeat that two more times for frame three and frame four. Now that the drawings are done, instead of having four frames, I should have four folders. That's perfect. I'm going to turn on my frame hold again for frame one and frame four. And let's see what this looks like now. Yeah. OK, this is coming along. I really like this. We need to add a background before we do that. I do want to thank today's sponsor, Squarespace. From websites and online stores to marketing tools and analytics, Squarespace is the all in one platform to build a beautiful online presence and run your business. Squarespace has the tools you need to get your business off the ground, including e-commerce templates, inventory management, a simple checkout process and secure payments. Whatever you sell, Squarespace has the merchandising features that you need to make your products look their best online. All websites are optimized for mobile devices. Your content automatically adjusts so your site looks good anywhere. Grow and engage your audience with Squarespace's email campaigns. Create powerful email content that matches your website with your existing products, blog posts and logo. So your message is consistent and effective. Check out Squarespace.com for a free trial. And when you're ready to launch, go to Squarespace.com slash Brag Colbo to save 10% on your first purchase of a website or domain. Something you see in a lot of animations are the characters are flat colored and the backgrounds are textured. There are two reasons for this. The first is that this helps separate the foreground and the background elements. So the viewer at home watching TV is going to be able to tell these things apart and read it easily. And the second reason is just practicality. Backgrounds are usually only drawn once while a character is redrawn many times over and over and over. So putting textures on characters is just much more time consuming. Our background is going to be super simple. I'm going to draw in our grass line with some little strokes using a simple pen brush. Maybe I'll come in here and draw Snoopy's doghouse, add some shrubs, just some loopy looking shapes for that. Charles Schultz loved adding some little lines here and there for the grass, adding little details. He also occasionally would frame things with random tree branches in the sky just to break up the scene a little bit. Once that's looking good, I'm going to jump in here and add some color. Now, I want to point out I am not adding really intense color. I don't want the color of the background to be competing with the colors on my character. So if you take a look at the blue that I'm using for the sky, that intensity of that blue is dialed way down. It's much closer to white than it is to blue. The grass has a little bit more intensity, but if you look at it, it's not intense at all. It's still dialed way down. Even Snoopy's doghouse is a toned down version of red. It's not the most intense version of red you're going to find. For the texture that I'm going to be using here, I'm going to find a nice textured brush. There are a ton in Procreate. I think a good place to look is the charcoal folder. These are really good for adding just a touch of texture here and there. I'm going to put the texture on its own layer, and I'm just going to use pure black. Trust me, it's going to look bad at first, but this is going to work wherever I need a shadow, maybe around the edges of the scene. I'm just going to go in there with a little bit of pressure and add in some dark shadows and highlights. Now, once it looks really bad, what we're going to do is we're going to open our layers. We're going to go to the layer that we've drawn that on, and we're going to set that to overlay. See, this is this is looking better already. I do like to play around with the opacity a little bit. I don't like my texture to be overwhelming. Again, I don't want the texture to attract attention. I just want the texture to add to what's already there. OK, I hit play. And as you can see, there is a problem with our animation. But don't worry. What we're going to do is take all of these background files and we're going to put them in one single folder so they're not part of our animation. If this folder is at the bottom of our layers, what we can do is go and turn on our animation assist, tap on that first frame of our animation and toggle this on to be our background. Now, this only works if it's at the bottom of your layer order. And there you go. A cool little peanuts animation that you can post to your socials and impress your friends and your family. If you do try this out, let me know. Tag me on social media. I would love to see what you have created. That is all I have for today. Thank you all for watching. And I'll talk to you in a couple of days.