Drawing to Photoshop Using the Pen Tool [For Animation in Adobe Character Animator] | Gregory Forster | Skillshare

Playback Speed

  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x

Drawing to Photoshop Using the Pen Tool [For Animation in Adobe Character Animator]

teacher avatar Gregory Forster, Teaching Adobe Character Animator

Watch this class and thousands more

Get unlimited access to every class
Taught by industry leaders & working professionals
Topics include illustration, design, photography, and more

Watch this class and thousands more

Get unlimited access to every class
Taught by industry leaders & working professionals
Topics include illustration, design, photography, and more

Lessons in This Class

7 Lessons (33m)
    • 1. Class Intro

    • 2. Intro to the Pen Tool

    • 3. Drawing the Head

    • 4. Drawing the Face

    • 5. Drawing the Hair

    • 6. Drawing the Body

    • 7. Drawing the Arms

  • --
  • Beginner level
  • Intermediate level
  • Advanced level
  • All levels
  • Beg/Int level
  • Int/Adv level

Community Generated

The level is determined by a majority opinion of students who have reviewed this class. The teacher's recommendation is shown until at least 5 student responses are collected.





About This Class

This class is going to show you how to take a hand drawn doodle you have made and recreate it in Photoshop using the pen tool.

The character I'm creating is intended to be animated later using Adobe Character Animator.  If you have no intention of animating this character, no problem.  You can still learn how to use the pen tool in Photoshop.

Meet Your Teacher

Teacher Profile Image

Gregory Forster

Teaching Adobe Character Animator


Class Ratings

Expectations Met?
  • Exceeded!
  • Yes
  • Somewhat
  • Not really
Reviews Archive

In October 2018, we updated our review system to improve the way we collect feedback. Below are the reviews written before that update.

Why Join Skillshare?

Take award-winning Skillshare Original Classes

Each class has short lessons, hands-on projects

Your membership supports Skillshare teachers

Learn From Anywhere

Take classes on the go with the Skillshare app. Stream or download to watch on the plane, the subway, or wherever you learn best.


1. Class Intro: This is what we're making. This is the final product. This was the drawing that inspired it. Amusing Photoshop. I'm using the pen tool and I'm going to use this guy later in character animator to animate them. 2. Intro to the Pen Tool: I'm going to bring my doodle into Photoshop here, and I'm going to resize it to fit my 2 thousand by 2 thousand pixel canvas. Rename it doodle. So a few things about the Pen tool before we start drawing. It's a difficult tool to get used to, and it's even harder to explain how to use it. So I suggest messing around with it for a few minutes before you actually go. It's something you have to learn through experience and you will get it. Eventually. You add points and you drag them out to create curved lines. The goal is to use as few points as possible. If you try to make a circle and you have, say, 24 different points, that's not good. It can be done, a circle can be done in two to maybe four points. And the fewer points, the better. Let's take a look at some of the settings of the Pen tool. Here we can adjust the thickness of the line of the stroke. Here we can, here we can adjust where the line is drawn. This draws it on the inside of a line. This draws on, all right, on the line. In this draws it on the outside of the LAN. I think right on the line is best. So I'm gonna choose. This changes the caps on the ends of the lines. First is no capital. This is around cat. This is a box cap. And I like the round camp. So I'm gonna choose that. This changes the corners. And if you have a sharp angle, I don't have a sharp angle on this shape I made, so you won't see it. But I'm going to choose the rounded corners. And I'm gonna set the stroke thickness at ten pixels. You can give it a fill color or you can choose this for No, phil. Now I want to talk about the keyboard shortcuts I'll be using. If you hit P on your keyboard, that brings up the pen tool. If you hit V, it will change to the selection tool. It also d selects the shape that you just made with the pen tool. If you hit a, it will change to a different selection tool and will allow you to edit the points you made with the pen tool. Those are the three main keyboard shortcuts you need to know. I use more, but I'll call them out as I'm doing them. Once you've got the basics of the Pen tool down. Let's go on to drawing the head and the face. 3. Drawing the Head: Hold Alt and use the wheel on your mouse to zoom in. Hold spacebar to bring up this little hand and you can drag the canvas around. I mentioned that earlier and, but I need to say it again with the pen tool as few points as possible. My head shape here, I'm only going to use four points. I'm gonna change my stroke and fill color. Now I hit V to de-select the shape just drew. And I hit a to bring up this White selection tool. And that lets you mess with the points and you can adjust the shape. So now I can drag points around and I can have just the handles on each point and change how the shape looks. And this is why using as few points as possible is really important. It makes it easy to edit. Fill in my shape with some peachy skin tone. Since you can't see the doodle once you draw on it. The doodle to the top of the document and then lower the opacity so you can see through it, maybe 70%, 80 percent. And that looks good. We need to rename our layers to keep an organized. I'm going to call this head background. And I'm going to use my own naming convention for right now. I'm naming them in a way that I know what they are. Later. We're gonna have to rename the layers and the folders so that Adobe character animator will recognize them. But just for right now for this class, you can rename them in your own way. But you have to rename them. Don't leave them as Shape Layer. If you have 85 layers that are just called shape, you're gonna lose your mind at the end. China, figure it all out. Next, let's do the ear. Hit P for pen tool, hit a to reselect. So I can change to round caps. Next I'm gonna make the inner ear. Since this is an inner detail, I want the stroke to be a little bit thinner. So four pixels is good. Hit a to reselect it and tweak it a bit. I'm going to make a folder called ER left. I'm calling it ear left because that's how Adobe character animator doesn't. So to us, the ear is on the right side. But looking at it from the character's perspective, it's all, it's his left ear. It's a good habit to get into when making cartoons for character animator because that's how they do it in the program. Rename this year outer ear, inner and put it in the folder. I want to move the ear bits. So I highlighted the folder and hold command. Press t. If you're on a Mac, it's Control T on Windows. That puts me in transform mode. And I'm going to shift it over a bit with the arrow keys. I can hold shift to move it, shifted a little bit faster. De-select by clicking the check mark up here. For the other year, I'm going to copy this one by highlighting. And then dragging the folder down here to this plus icon, rename that copy ear, right? Command Z or Control T. It's too slow to shift with the arrows. So I'm going to drag it with the mouse. And while I'm doing that, I'm holding Shift. And that keeps it in a straight line and won't let you move off that horizontal line. Now right-click and choose flip horizontal. Let's set the doodle invisible for a second so we can see how it looks. I wanna edit the head a little. So I select the head layer and I hit a. You don't have to follow the doodle exactly. It's just a rough guide. Feel free to tweak what looks off. Sometimes what looks good on a doodle doesn't look good on the computer. And that's it for the head outline. Next video, we will add the facial features. 4. Drawing the Face: Starting with the nose, it just the stroke, that cap and the fill. There is a way to make this the default so that you don't have to change. And every time, I'm sorry, in these videos, I will be changing that a lot. And I apologize. Something looks off about the no's. I don't really like it. Maybe it's too thick. And what's weird? Hold command and hit Z to undo control z on Windows. Let's group them together in a folder called knows. I'll come back to the nose later and fix it. I don't like the look of it. Let's move on to the mouth. So if you have a shape layer highlighted and you hit p for the Pen tool, then it will continue that shape on that layer. If you have a non Shape layer like the doodle photo, when you hit P and start drawing it, we'll put it on a new layer. So that's what you see me struggling with here. And the same thing happened on the notice to I'm trying to figure out why I don't like them knows. I think the nostril line is too big. Maybe. That's better. I like that. Group the mouth in a folder called mouth. Moving on to the eyes. Only four points for this, I hit a to edit. Make the fill white, and name it. Eyeball left. Remember it's his left. My left. Make the pupil black. Phil, No stroke. Name a pupil left. And put these two layers in a folder called I left. On my doodle. There are islands on the eyes. I'm gonna do that in a later class. Because those require working in character animator. I wanna keep this class strictly to Photoshop. So for now, know islets, those will come later. I'm going to copy that folder, rename it, and move it over. And we're gonna make it a different shape because I don't like the look of the eyes being same exact shape. I'm gonna fix this little jagged part here. Rename these layers. Maybe this eyes a little too small. Okay, that looks good. Now the eyebrow, I'm going to use this light brown color. Hit a to fix it up a little bit. Rename it to eyebrow left. Copy the eyebrow by dragging it onto the plus sign. Rename it. And let's put them in a folder called eyebrows. Move the layer over, right-click and choose flip horizontal. Here, he looks good. It looks like a little baby or really old man. Oh, first let's move the eyebrows layer down below the doodle. Okay. In the next video, we will give him some hair. 5. Drawing the Hair: Hair can be a little tricky with the pen tool. I'm gonna make it in two parts. First, I'm gonna make this little catholic and gives you call it in the back part that stands up. You can see I'm struggling a bit. Sometimes the Pen tool does not cooperate. A lot of it depends on which direction you start, in which direction you move in. Just the stroke and the fill. It darker brown than the eyebrows. Now, for the rest of the hair, stroke and fill and make it around camp. Looks pretty good. But you can see it's in front of the ears and we wanna behind the ears. So I'll move the ear folders above the hair. And you see the hair here. It looks off a little bit behind the ear. So I'm going to extend the ear out a little bit to cover it. I'll rename these hair back and hair front and put them in a group called hair. He looks good but he looks a little flat. I'm going to give them some depth with a shadow. So I'm going to copy the hair front layer, rename men to shadow and move it below hair front. Now Command Z or Control T and shifted down like so. Let's change the layer opacity to about 10% and then change the fill to black. Hit VI to deselect. And you've gotta shadow that adds some depth is not much, but I think it adds a nice little touch. And that does it for the face. I think it looks good so far. Before we move on to the body and I want to group things a bit better. I'm gonna make a top level folder called kid news. That's this little guy is show's name as good news. So that's the main folder. Then I will make a folder called head and move everything into the head folder except the doodle and the background. And move the head folder into KID news. And we have a cleaner file now. And again, I'm making the layer and folder architecture based on how Adobe character animator needs it. But folder names. And moving this photoshop file into character animator is a whole class in itself. 6. Drawing the Body: For the body, make a new folder called body. And in the end it will go below the head. But for now, while drawing, I'm gonna put it above the head so I can see all of it. And we're going to create almost like a little egg shape. This will be his torso, not including arms yet. This is just the torso. And we're gonna give him crazy colored suit. Something light blue. Sort of style. Rename it body background. Now I'm making the white shirt. The nice his suit. No stroke is okay. White fill. Hit a and I'm going to edit it a little bit. Rename it white shirt. This is the suit jacket or the suit lapel. And I guess you would call it. I actually don't want to connect the shape with a black line. So I'm going to delete. Now, I'm going to delete the connection and do this instead. Rename it jacket lapel, copy it and move it over and flip it horizontally. Africa around caps. And I'm just going to edit this to line up a bit better. But this will probably change in the future. When I draw the arms, I'll give him some buttons on his jacket, copy it and move it around. Make a folder called suit, and move the lapel and buttons into it, and then rename the button layers. Now I'm gonna make the Thai. Let's make it red and finish off the rest of the tie on a new layer. Rename it time and time. And I want them not above the tie. Okay. Make a group called Ty and move them in there. I'm going to move the tide group below the suit group because the Thai goes behind it. Centered tire. But more. I'm going to move the body and white shirt into a folder called Body background just to keep everything, keep everything organized. The next video, we will draw the arms. 7. Drawing the Arms: Before I draw the arms, I want to add the desk that's in front of him. Now this will probably change in the future once I take it into character animator and do different things with it, I don't know exactly what I'm gonna do with it, but for now, I want to have this here. I have to move it in front of the body. For now. I'll put it in the suit folder, which probably isn't a good idea, but for now it's okay. The arms are going to be in three different parts. The upper arm, the forearm in the hands. I'm going to start with the upper arm. I do end up changing these around in the end, so bear with me. It can be difficult to get all the parts aligned. And then the forearm and the hands. And I'm not gonna talk much for this. It's better for you to just see how it's done. Oh yeah, that looks good. I'm happy with that. And I'll rename all my layers and put them in a folder called armor, right? I put the desk in a bad spot after put it somewhere else and put the arm on top of it. There we go. That looks good. I'll copy the arm, rename it, and move it over and flip it horizontally. I'm adjusting the arms because he's going to hold some papers in his hands. Command Z or Control T lets you move something. And if you move the mouse just outside the corner, it lets you rotate it. Now for the papers in his hand, I'm gonna duplicate it and move it a little bit. I'll make a folder called Papers and put them in it. It looks pretty finished to me, but I'm going to change the suit. The lapel tells the suit jacket a little bit, they don't look like they should. And I'm going to slide this towards this side of the torso in a bit. And I'm gonna put the desk in a folder called desk because I'm gonna be adding stuff to it most likely. And finally, I'm gonna delete my doodle and delete the background, which isn't a hundreds, 100% necessary. I'd just like to have I'd like to clear everything I'm not using, so delete them. And here we have a doodle turned into a cartoon in Photoshop using the pen tool. And it is ready to be taken into. There'll be character animator, sort of not really. That's all. That's another class in itself. Just make sure you save it. And check out my other classes about Adobe character animator.