One of the most striking things about any portrait are the eyes. So it’s with this tutorial, I’m going to guide you through the process of drawing and coloring anime-styled eyes with vector tools in Adobe Photoshop. If you’re an intermediate to advanced user of Adobe Illustrator or any other vector program, you should be able to translate this tutorial to your preferred program.
1. Prepare Your Guidelines
Step 1
I’m going to start with a prepared base. If you’re a Tuts+ Premium member, you will be able to download this base in .PSD format to play with through out the tutorial. If not, feel free to download the image of the face to draw on top of.
Step 2
On a File > New Layer (Control + Shift + N) use the Pen Tool (P) set to Paths to draw a line using Stroke Path down the middle of the face. This is your central guide line. It’s used to help position the eyes correctly, as eyes tend to be equidistant from this central line. You can delete the path after you have stroked it.
Step 3
Next, use your Pen Tool (P) to draw two horizontal lines – one between the tops of the ears, and one between the bottoms of the ears. On a regular (real) human, the base of the nose would be on the bottom line, and the eyebrows on the top line. While anime-styled characters follow the same basic guides, their large eyes and typically smaller noses means some artistic license can be had – your character’s eyes will sit between these lines, but they’re not ready quite yet.
Step 4
Before you stroke the paths, they need to curve to follow the shape of the head, and provide a guide for the shape and angle of the eyes. The bottom line should be above the nose now, following the angle of the head, and the top line should follow the curve of the bottom line. Imagine the eyes inside the lines to help you figure out the correct curves.
Step 5
When you’re ready and are happy with your curves, Right-click > Stroke Path and then delete the paths. You will have something similar to the example below, which means we’re done with the guidelines and ready to start sketching!
2. Sketch the Eyes
Step 1
To start sketching eyes, you first need to define their size. Start your sketching on a File > New Layer and start by using the curves of your guidelines to create rough sketches for the top and bottom of the eyes. Remember they should be equidistant from the central line, and roughly in the middle of each ‘side’ of the central line.
Step 2
Next, draw curved lines between the top and bottom lines you’ve sketched. The red lines on the left-hand eye show the straight lines between the top and bottom – aim to keep your curved lines within these boundaries. These curved lines create the irises.
Step 3
Continue the top line sketches round the outside of the irises, as shown. I have also added a little more line weight to the tops and bottoms of the iris shapes to get a feel for how the eyes are looking.
Step 4
Continue the top lines out toward the center a little further, curving down slightly, but down go out too far. I’ve also added eyelashes, three each side, to make my character appear more feminine.
Step 5
With the sketches complete, check they seem to be in the right places and make any changes you need to before moving on to the line art stage.
3. Create Your Line Art
Step 1
Hide your guidelines layer(s), and lower the opacity of your sketch layer to 25% Opacity. You now need to select your Pen Tool (P) and ensure its set to Shape Layers now, and not Paths as it was for previous steps.
Step 2
Use the Pen Tool (P) to draw the line art for the eyes. I haven’t included the bottom sketch line in my line art, and this is purely down to personal choice – sometimes I add it, sometimes I don’t!
Step 3
When you’re finished, add two thin lines, one above each eye, as shown below – these represent the eyelids. Hide your sketch layer to see how the line art looks, and make any edits you want or need to. Now you’re ready to add some color!
4. Color the Eye Whites
Step 1
Select an off-white color, I usually go with a pale blue-gray, and create the shapes for the eye whites. They should stick out either side of the iris line art, more at the outside edge of the eyes than the inside, as the example shows. Remember to keep your line art layers above all the coloring layers!
Step 2
Choose a darker, more saturated tone for the shading, which is added along the top of the eye whites. This is the shadow created by the eye lid and lashes, and should be added just above the corresponding shape for the eye white. With the shading layer selected in the Layers tab, Right-click > Create Clipping Mask to anchor the shading shape layer to the eye white shape layer below it. Do this for both eyes.
Step 3
Underneath the first shading layer, add a second line of shading at 50% Opacity. Adding this shading below the first shading means that a Clipping Mask will automatically be created. With that done, the eye whites are completed!
5. Color and Shade the Irises
Step 1
Choose a base color and draw your shapes for the irises. With anime you can go as bold and bright as you want, so it’s a great opportunity to experiment with you favorite colors.
Step 2
Use a darker and more saturated color to add the first layer of shading, which acts as the pupil. The shading should cover most of the eye, leaving a horse-shoe type shape in the bottom half of the iris in your original base color.
Step 3
Add a similar shape in the same color, but this time at 50% Opacity, and a little longer so it can be seen beneath the first layer of shading.
Step 4
Add a third layer of the shading, again at 50% Opacity and, again, showing beneath the second layer.
Step 5
Choose a darker tone again and, around the bottom edge of the first layer of shading, add thin crescent shapes which are slightly longer on one side.
Step 6
Using the same darker color, add a layer of shading around the top of the iris, which is shadowed by the eyelid.
Step 7
Using the same color, but at 50% Opacity, create second layers of shading for the darkest areas – one under the eyelid, and one at the base of the pupil – as the example shows. This completes the shading!
6. Add Highlights to the Eyes
Step 1
Using the Ellipse Tool (U), create a circle in your original base color at the bottom-left of the pupil shading. This circle should just touch the original base shape.
Holding down Shift while using the Ellipse Tool (U) will create a perfect circle.
Step 2
Add a larger circle toward the top of the iris, at the right. Lower the Opacity of this circle to 80%.
Step 3
Using white at 40% Opacity, add a circle inside the larger circle.
Step 4
Add a second smaller white circle inside, this time at 80% Opacity.
Step 5
Here, I’ve added another small circle below the larger circle. I chose a nice green tone for this.
Step 6
Using a color a little lighter than your original base color, add a subtle highlight to the bottom of the iris, in the shape shown in the example. This shape should be at 50% Opacity.
Step 7
In the same color, but at 100% Opacity, add a second layer of highlighting to the bottom of the iris. This time a small, thin sliver, as shown. This will be your final shape.
Other Ideas You Can Try
These examples show other ideas you could try, such as using shapes other than circles for your highlighting – in this case, hearts and stars. They also show other ways of adding shading by using slightly different shapes than those shown in this tutorial – the basic principals are all the same, though. You could also try experimenting more with color and using contrast to give a great effect, such as the top two examples, whereas the bottom two are a lower contrast.
Awesome Work! You’re Now Finished!
You can create various styles and designs using the techniques from this tutorial, which aren’t only applicable to anime-styled characters, but could be used for various styles of drawing – the main things to remember are getting your guidelines and sketches right at the beginning, and to have fun with it! As always, should you use this tutorial, I would really love to see the results!
