Create your own Leprechaun for St. Patrick’s Day!

Step 1 – The inevitable ‘New Document’

Open Illustrator and create a New Document.
For the purpose of this tutorial, I’ve gone with 100mm in width by 150mm in height.

Step 2 – Import our Template Image

Assuming you already have an image scanned, you can go ahead and copy/paste or drag/drop into your document. Set this to a template layer by double clicking on it and checking ‘Template’.

The benefit of doing this is that Illustrator automatically locks the layer and lowers the opacity of the image so it is easier to visualise while working on top of it. Some people prefer not to have the image opacity lowered though and so you can take the check out of ‘Dim Images to:’ or alter the value shown there.

Step 3 – Character Outline

Using the pen tool, carefully trace round the outlaying edges of your character.

Once you have finished, apply or alter your stroke setting. For this characters outline I have set a stroke of 1.5 in width, solid black but depending on your character and the scale you are working at, you may chose differently.

Step 4 – Character Building

Now that our character has an outline, we just need to go ahead and draw in the details.

This time I have applied a stroke value of 1 width and again in black. The one thing I have learned during this process is that practice and patience is key.

Tool Tip | Pen – Starting a New Path
One tip that not everyone may know is the quick way for starting a new line when using the pen tool and not wanting a complete path. After getting to the anchor point that will make up the end of your line, press and hold Ctrl then click in a clear area of your document. The next time you use the pen tool, a new path will be created.

You might want to temporarily lock layers as you create and work above them. Depending how intricate the details are, this can sometimes remove the frustration of moving/altering underlying paths.

Step 5 – Characters Eye

Using the Ellipse Tool, create two circles in place of the eyes and apply a black stroke with a white fill. You might want to temporarily lock these layers while you work above them.

In a layer above, draw another ellipse for the pupil and then using the pen tool, draw in some highlights. Selecting these paths, right click and create a Compound Path by clicking on ‘Make Compound Path’. I have chosen to keep things simple for this tutorial and filled this with black, however you may wish to add further details to the eye such as an iris.Duplicate this for the other eye and scale into place.

Step 6 – Final Touches & Expanding

To check how your outline is coming along, temporarily hide your template image by clicking on the icon circled here in the layers panel.

Now that we have our character digitally inked, we want to start thinking about some colour. Before that though, create a duplicate of the entire layer and rename this one, colour. Lock our previous one for safe keeping… just in case… *cough*

Selecting everything in our new ‘colour’ version – excluding the two compound paths – go to Object -> Expand in the top menu. This will now allow us to apply the Live Paint function in Illustrator.

Step 7 – Base Colour

Select the Life Paint Bucket (or press ‘K’) and click on your character where you see the following outline.

Not thinking heavily about texture/shading/depth/etc, select and fill the areas of your character with some base colours.

NOTE: This is where I messed up! I originally didn’t have a join over the ear with the beard and so the ear was being filled too. It is always good to make up a backup layer – or file – when working!

Once you’re happy with your base colours, expand the layers in the layers panel and group them appropriately. This will make life so much easier when coming to shading in future making each set quickly identifiable.

Step 8 – Mesh Shading

One tool that takes some understanding, is the mesh tool. If the paths you wish to use the mesh tool on are non-symmetrical, the render will look uneven and jaunty, however sometimes the effects can be usable. The ribbon on the characters hat is not far from symmetrical so we can use it here, as well as on the leafs of our clover which are quite basic in shape.

Select the ribbon and click on a point over to the right, where the ribbon is at its widest. A mesh will be applied within the path, allowing you to select a colour which can be for a highlight or a shadow.

I have applied a mesh to the characters hat as well which shows how a non-symmetrical shame will render. It worked not too badly here though and displays a slight shadow casting from the clover so I have kept it in.

Step 9 – Gradient & Solid Shading

As a characters shape can be quite complex, we are best using gradient & solid fills for shading.
Select the pen tool and draw a path as I have done here; this will create the shadow under the brim of the hat. Next apply a gradient fill to that path and set the layer properties to Multiply, lowering the opacity depending how strong you wish your shading to be.

Repeat this process throughout your character and if working with highlights, set the layer property to Screen instead of Multiply.

For other areas where you want shading to be more prominent, use a solid fill instead of a gradient and do not apply any layer properties. The more that you can do this and achieve the same result, the better things are in the long run as you will need to worry less about flattening transparency.

Step 10 – Export

Now with everything drawn in, coloured up and rendered, we can go ahead and export our file to wherever it needs to be. As this chap will soon be appearing on the SLC website, I’m just going to be throwing him straight into Photoshop.

I hope you got something out of this tutorial and if you would like to use this Cheery Fellow on your own website, you’re welcome to!! Please just provide a little credit somewhere to Zen Elements or mention it below in a comment!

Thanks for reading!

Alex | Zen Elements