No matter how exact I am with my pen lines and how frequently I clean my scanner, I can never seem to get a completely clean scan -- there are always dust particles or stray strokes. I'm all for texture in digitization, but I like to be in control of it! If you're working with a piece where all of the lettering is connected, it can be pretty easy to just select your lettering, right click > Select Inverse and then delete the rest. But what about a bigger, more complicated piece? It's annoying and time consuming to shift and click to select every single bit of what you want to keep.

Scan Your Lettering

Start with a freshly scanned piece of lettering. Make sure you isolate your lettering by deleting all of the white areas. If your lettering piece is filled in, you can just select a large white area, right click > Select Similar, and delete (make sure your layer is not the background layer, so it will delete to transparent). If your lettering isn't filled in and you want to keep the white inside, you'll have to shift + click to select each area of white you want to erase. If you need a more in depth refresher on this, check out my Digitizing Lettering in Photoshop tutorial.

Add a Stroke

Now that your lettering is isolated, there's still some cleaning up to do! Go to the layers panel, right click, and select Blending Options. When the Blending Options panel pops up, click Stroke on the left hand side.

My default settings happened to be 25px of black stroke. See how instantly, you can see all of the stray pixels and dust much more easily? Click ok, and get on erasing those puppies! Making all of those circles disappear feels like a game to me - it reminds me of chasing and popping bubbles as a kid.

Clean Up Stray Pixels

I like to use this stroke effect to spot all of the bits of dust on my scan, but also to spot some areas of my lettering that has a rougher edge than I might like. If the stroke looks really jaggedy, it's because it's basically exaggerating the existing edge of your lettering below. It can be tough to erase precisely when the stroke is turned on, because you actually need to erase inside of the stroke to clean up the edge, so I just use this to note areas I need to look more closely at.

Once you've cleaned up all of the dust and particles, right click on your layer in the layers panel, and click Clear Layer Style. This will get rid of the stroke and you'll be left with clean, isolated, dust-free lettering! From here, it's easy to continue digitizing and make the type 3D! Or, you can take it into Illustrator and try out Image Trace, but that's a tutorial for another day.

Now that you know this fun little trick, you'll never have to worry about the dust particles you can never seem to fully clean off of your scanner!

Giving your lettering a 3D effect in Photoshop adds a lot of visual impact, but it’s easier than you think! Today I'll show you exactly how I made the featured image for this blog post. Start with your lettering scanned, cleaned up, and isolated in a Photoshop document. If you don’t know how to do this, start with my basic digitizing your lettering in Photoshop tutorial, and then come back!

Give Your Letters Depth

Duplicate your lettering layer (right click on the layer in the layers panel and select Duplicate Layer), move it underneath the original layer, and nudge it to the depth and angle you’d like. I typically go down and to the left, but you can go any direction! Erase any duplicated lettering that you don't want to make 3D. I typically only make my most emphasized phrases 3D, so I'll erase the rest from this layer.

Pixel lock both layers of lettering, and find a color scheme you’d like to work with. If you’re struggling with color schemes, I love coolors.co. I generally make the lettering layer that’s going to give the 3D effect a darker color than the top lettering layer, to add to the effect. Sometimes I'll make the top layer white, and other times I'll make it just a much lighter version of the 3D color. The world is your oyster!

Un-pixel lock the darker layer of type. Using a small brush, draw lines to connect the second layer of lettering to the original in front of it. I either do this freehand, or I’ll create a sort of guide with the Rectangular Marquee Tool. If you don’t have a steady mouse hand yet, use the marquee tool to select a square area. Right click, and click Transform Selection (not Free Transform - that will transform the area of your work you’ve selected, not the square itself). Rotate the square until the angle matches up perfectly to connect your two lettering layers. Then you can just follow along the line with the brush tool to connect the layers, and move the square to each connection spot as you go. Deselect the area when you're done with this step, and then use a larger brush to fill in the remaining inside your 3D area with the same color.

Add Some Shading

Create a new layer above your 3D layer (CTRL/Command + Shift + N), and select "Use Previous Layer to Create Clipping Mask" in the box that pops up. The new layer should indent a bit to the right and have an arrow that points down to your 3D type layer. Now, no matter where you draw on that layer, it will only show up if it’s inside the colored areas of your 3D layer. This is where we’re going to add some shadows to make the depth more realistic.

Grab a darker shade of the color of your 3D lettering, and use the Brush Tool to paint in shading on top of your 3D lettering. I generally imagine the light is coming from the upper left hand side, which means everything on the underside of a stroke needs to be shaded. I use a hard brush for spots that should have no transition, like the bottoms of the letters, and a larger, softened brush to fade the shading a bit on rounded areas or strokes that I think are half in shade and half not.

Don't Forget a Shadow!

Once you’re happy with your shading, there’s one last detail - a shadow. Select all 3 layers of your lettering, duplicate them, and merge those duplicates into one layer. Move that layer beneath all of the other layers of type, just above your background layer, and nudge it to offset it from your lettering a bit. Just like in the 3D layer, erase any lettering you don't want to have a shadow from this layer. I again don't want my accent pieces to have a shadow, so I'll erase them.

Pixel lock the layer and grab a darker version of your background color and color in the lettering. Then, drop the opacity until it’s a soft, subtle shadow. This is usually around 20-30% for me, depending on the color.

Voila! Now you have beautiful, colorful 3D lettering. And if you keep all of your layers separate (and labeled), it’s easy to tweak your color scheme or add additional effects, like texture.

Serif styles are one of the staple classifications of typography. A serif is that little extra stroke found at the end of main vertical and horizontal strokes of letterforms. Georgia is an example of a serif.

Arial is an example of a sans serif.

Serifs have been classified many different ways, but the terminology gets confusing. There are a lot of overlapping terms for the same types of serif, which can make knowing what's what as clear as mud. Over time, the terms for different serif styles have evolved, but confusingly, the old terms are still used (resulting in multiple names for the same style).

Let's try to clear things up!

Important Terminology

Before we get started, there are some important terms that we're going to be repeating.

Bracket: This is a rounded line that connects a serif to the stroke of the letter for a smooth transition

Contrast: In this case, we'll be referring to the difference between the thickest part of the letter and the thinnest.

Hairline: A very thin stroke

Other basic typography anatomy terms (this drawing from SeanWes is a great visual dictionary).

Old Style/Humanist/Traditional

Old-style serif fonts meant to imitate brush strokes of old school scribes, so they have a softer, rounded appearance. This serif style has smooth, rounded transitions between the thick and thin strokes, and the transition into the serifs (which have slightly rounded edges) is a very gradual, smooth slope. This type style has a hand-crafted look, rather than the sharper, more machine-made look of a transitional or modern serif. For a good example of this style, take a look at Garamond.

Drawing this style is relatively easy, as imperfections are part of the historic, handmade charm of old style serifs. Draw a letter as you normally would, giving all of the body some weight. Then thicken the down strokes a bit - the contrast in this style of type is not very dramatic. Then, draw a thin, rounded rectangle for each serif. If you look closely at Garamond, every 90 degree angle has been softened with a rounded edge, including the transition into each serif.

Transitional/Bracketed

Transitional serifs are more pronounced and sharper than old style serifs. John Baskerville was the English printer and typographer who pioneered this style thanks to some advances in printing methods, so Baskerville is a shining typeface example. The curved edge that connects the stroke and the serif is a bracket, so you'll often see this style referred to as bracketed. The brackets of transitional serif fonts are rounded and smooth but the edges of the serifs are very square. This type style feels much more machine made and modern, as the 90-degree angles and perfectly straight lines are difficult to achieve by hand. It's known as "transitional" because this type style is a big step toward modern styles, but keeps characteristics of old style serifs.

Drawing this style is a little tougher as it demands more consistency than the old style serifs. Draw a letter as you normally would, giving all of the body some weight, and thicken the down strokes - the weight contrast in this style is more pronounced than old style serifs. Then, draw a thin, square-edged rectangle for each serif. Soften the transition into each serif with a smooth, rounded edge.

Didone/Hairline/Modern/Neoclassical

The hairline serif is pretty unmistakable. It's a very high-contrast style between thick and thin strokes, with narrow, unbracketed serifs. This is the style I showcased in my Vectorizing Serif Lettering tutorial. This serif can be seen in type styles like Didot and Bodoni. Sometimes you'll see this style with ball terminals (as in the lowercase c and a in the image above), but otherwise, this style maintains a very modern, clean, unornamented appearance.

This style has probably gone through the biggest identity crisis. When this style first came out, typefaces like this were referred to as Classical. This was confusing because they weren't a new take on a classic style, like transitional was to old style. They were entirely new designs, and began a modern era of typography, so instead they became known as Modern. However, they're not really modern anymore, so now they're most commonly referred to as Didone (which is apparently a portmanteau of Didot and Bodoni, but Bodoni got the short end of that stick if you ask me...), in homage to the typefaces that pioneered this style. Sometimes you'll see them called Neoclassical, but it's not as common.

I find this style the easiest to draw, because drawing a serif essentially involves drawing a short straight line. Create a lot of contrast between thick and thin strokes -- downstrokes should be quite heavy, while the thinner strokes should maintain a hairline width, matching the weight of your serifs. Add thin, consistently weighted serifs, with no bracketing at all. The serifs on this style tend to be pretty long. If you want your thin strokes to be thicker than a hairline, just make sure your thin strokes and your serifs are the same weight, the edges are square, and that you maintain strong contrast between them and the upstrokes.

Slab/Egyptian

Slab serif type became popular in the 19th century as a display type. A commonly known typeface in this style is Rockwell. These typefaces have very heavy serifs with minimal changes in stroke weight, and no bracketing (when bracketing is added the style becomes Clarendon, which we'll get to!). This type style has a strong visual impact, so it was often used in advertising. It is also sometimes referred to as Egyptian.

I like to use the follow-along sans serif technique when I start this style, which helps in maintaining a consistent stroke weight. Add square-edged, rectangular serifs that are the same weight (or very close to the same weight) as your letter strokes. These serifs tend to be short or medium length.

Clarendon/Bracketed Slab

This is sort of a sub-style of the slab serif, as it's not a very pervasive style and is seen in few typefaces. Like many others, this style is named after the typeface that pioneered it: Clarendon. Another display type style seen in the mid-19th century, the only difference between this and the slab serif is that it has gradual, rounded transitions into the serifs. Just as with slab serifs, their stroke contrast is very minimal and serifs are short or medium length.

To draw this style, follow the slab serif instructions above, but add a rounded transition into each serif.

Glyphic/Latin/Wedge/Semi-Serif

Glyphic serifs are usually triangular and tend to be more visually subtle, resembling the style of chiseled Roman lettering. In additional to triangular serifs, the legs of letters like R or K tend to subtly flare out a bit at the end rather than having a full serif. A good example of this style is Saracen (above) or Albertus. You will often find glyphic typefaces under the name "semi-serif", but the terms "latin" or "wedge" are also pretty prominent. This is another serif style that doesn't have strong contrast between thicks and thins. The transition into the triangular serif can either be smooth or abrupt, depending on the typeface.

To draw this style, draw a sans serif letter with minimal contrast between the thicks and thins, as with slab or old style serifs. Rather than a rectangle, draw triangles on either side of the stroke to form the serif. Subtly flare out legs at the end to give some additional visual interest.

Ornate/Decorative

This isn't really a formalized serif style you'll find in most places, but it's what I use to lump in any of the serif styles that don't really fit in the other categories, like bifurcated, trifurcated, or illustrative serifs like leaves, flowers, curls, etc.

There really is no one way to draw in this style, since it's kind of a catch-all category. The contrast between thicks and thins is entirely up to you. If you're doing a bifurcated serif to add a western vibe to your piece, that generally has only slight contrast between thicks and thins. If you're going for a botanical serif, maybe your entire letter is monoline, ending with serifs drawn out of two leaves! This is the serif category where you can really get inventive.

Wrapping Up

Hopefully now you have a better understanding of the different categories of serif type, and how they relate to one another. If you were keeping count, we went through 19 different terms that can be used to describe 7 different categories of serifs - no wonder this is often a confusing subject!

The pen tool is maybe the most important tool in all of Adobe Illustrator - it's the workhorse of the program, and your Illustrator abilities are pretty limited without it. It has quite a learning curve, but with practice, it opens up a whole new world of lettering possibilities. The pen tool can be used to transform your rough sketches into polished, vector (infinitely scalable!) lettering.

At first glance, attempting to turn the sketch on the left into the polished type on the right seems pretty daunting, doesn't it? I promise, you can do it! Let's break it down into manageable steps.

Scan or Take a Picture of Your Sketch

The first step is to take a rough sketch and take a picture or scan it. Since the resolution of the sketch doesn't matter, taking a picture in this case is all you need. Create a new document Illustrator, and use File > Place... to browse for your image and place it in the document. Resize as necessary to center it in your artboard. I like to lower the opacity of my image to about 50%, just to avoid any visual confusion with my pen lines. Then select the image, and click Object > Lock > Selection. This locks the image in place so you won't accidentally select it and move it.

Before we've even started vectorizing, you can probably see how imperfect your sketch is - I already know I want to move the D in a bit, as it's a little too far out on its own, and I know my W is going to need to be narrower. When I know I'm going to be working with vectors in the end, I don't worry about making my sketch too perfect. It's far easier to correct mistakes on the computer than with further drawing!

Pen Tool Basics

Before we start vectorizing our type, we need to go over a few basics of the pen tool. With the pen tool selected, click on artboard to create paths with straight segments. Create a point and hit Shift as you click to create your next point, to align the two points exactly to create a straight line. If you do this for all 4 points of a rectangle, all of your points will line up perfectly (this is especially useful for thick crossbars and straight down strokes).

Click and drag to create paths with Bezier curves (the handlebars that stick out on either side of a point). If you hold shift while you click and drag, your handles will maintain a 0, 45 or 90 degree angle. Always drag your mouse in the direction of the next point you'll create.

Draw Your Skeleton

Just like when I'm sketching, I find it easier to build my vector piece with layers rather than trying to get it all in one shape. So we start again with the skeleton!

Select the pen tool, and make sure it's set to a 1 pt. stroke with no fill. Create a line down the center of the stem of your D by clicking to create an anchor point at the top, and hitting shift as you click to create a second anchor point at the bottom. This will create a perfectly straight line.

The bowl of the D is a bit trickier - it's made up of 5 anchor points.

Anchor point 1: Click to create a point at the terminal (the very end) of the top serif of the D. Don't drag your mouse here - no need for this to be a curved point.

Anchor point 2: Holding shift so your line is straight, click to create a point at the beginning of the bowl of the D. Continue to hold shift, and drag your mouse to the right to create a curved point with horizontal handlebars.

Anchor point 3: Click again toward the middle of the bowl of the D, hold shift (after you click!), and drag your mouse downward to create an anchor point with vertical handlebars.

Anchor point 4: Create a point at the end of the curve of the D, lining it up as closely as possible to the same point at the top of the D. Hold shift, and drag your mouse to the left to create a curve with horizontal handlebars.

Anchor point 5: Click to create an anchor point at the end of the bottom serif of the D to complete the line.

Then, using the Direct Selecttool (the white arrow), go back and adjust any handlebars as needed to create a smooth curve. Let's pause for a moment to talk about proper handlebar protocol. Take a look at the handlebars above - they demonstrate a few key rules for creating handlebars that are easy to tweak and evenly share the work of creating the perfect curve.

Don't cross the streams. (this is possibly my favorite tip I've ever learned from following Jessica Hische - this concept didn't really stick with me until I heard her phrase it that way). If you draw imaginary lines continuing each handle bar to infinity, none of them should be long enough that they cross into the other's paths. They cross into each other's paths when you give one way too much work to do creating the curve. Following this rule will ensure you're distributing the workload of creating the curve evenly onto each anchor point.

Stick with horizontal and vertical handlebars. If you're just starting out, it's great that you're learning this now. You don't have any bad habits to break! Committing to horizontal and vertical beziers simplifies where you place your anchor points - your options are limited, because now, to get your curve along the outermost edge, you have to place your points at the outermost points of the curve! It makes narrowing down where your points are going much, much easier, and it also reduces the total number of anchor points you'll have, which makes tweaking the piece easier. I became much less overwhelmed with plotting anchor points once I committed to only using horizontal and vertical handlebars.

Using these same techniques, draw out the rest of your skeleton. The bowl of the R is similar to the bowl of the D - the trickiest part of this letter is the leg, because it's so curvy. You'll create this with four anchor points: a horizontal handlebar at the top of the curve, a vertical handlebar in the middle, a horizontal one at the bottom, and a plain old corner anchor point at the very tip of the leg. A and W are very straightforward (pun intended) - just an anchor point at the end of each line, and short straight lines to create all of your serifs.

Create your Body

To create the thicker downstrokes of our letters, we're going to use the pen tool to create filled shapes rather than strokes. I like to set my opacity down to 80% or so, so I can still see the skeleton underneath as I tweak the body.

Creating the straight downstrokes is the easiest part. Using the pen tool, click to create the first corner point of the rectangle. Then, holding shift, click to create the other 3 corner points, and then click your initial anchor point. This will create a perfectly straight rectangle (and bonus, you can copy and paste this to quickly add the downstroke for the stem of your R)!

To create the thicker downstroke for the bowl of your D, you're going to need to create a sort of crescent moon shape. This is comprised of 8 total anchor points:

Anchor point 1: Start by making an anchor point along the stroke of your skeleton.

Anchor point 2: Create a curved anchor point just a little bit away from it, holding shift and dragging your mouse a bit to the right.

Anchor point 3: You want your skeleton stroke to be along the center of your final downstroke, so create an anchor point a bit outside of that stroke to create the outermost part of your bowl. Holding shift, drag your mouse down to create the vertical handlebars.

Anchor point 4: Create a horizontal handlebar curve at the bottom of the curve of the bowl.

Anchor point 5: Make a corner anchor point inside the stroke of the skeleton.

Anchor point 6: Make a curved anchor point just a little bit away from the corner point, holding shift and dragging your mouse a bit to the right to create the beginning of the inside of the bowl stroke.

Anchor point 7: Create an anchor point inside your skeleton stroke, to create the innermost curve of your bowl. Holding shift, drag your mouse up to create the vertical handlebars.

Anchor point 8: Create a curved anchor point at the top of the inner curve of the bowl, dragging your mouse a big to the left to create the horizontal handlebars.

Now, we're right back where we started - to complete the shape, click your first anchor point again.

Following the same pattern, create the inside edge of the downstroke. Here's what your final points should look like:

Just like the skeleton, the bowl of the R is constructed identically to the bowl of the D - just shorter. The leg of the R will follow the same anchor placement of the skeleton, and your final shape should look like this, with 8 total anchor points:

To create the diagonal strokes of the A and W, I like to copy and paste the straight downstroke from earlier. Using the Direct Select tool, you can select just to top 2 points of the stroke and nudge them to the left to create the angle you need. For the A, you'll need to use the Add Anchor Point tool (in your toolbar, click and hold the pen tool, and select the pen tool with the + sign from the dropdown that pops up) to add an additional anchor point, so you can create the triangle edge at the top.

When you have all of your downstrokes created, this is what your lettering should look like:

From here, it's easy to make further edits. I knew my W was a little too wide, so I moved my shapes around a bit to make the overall footprint of the letter narrower. This is a big benefit of building your letters with layers of shapes - it's easy to make small tweaks. I also adjusted the kerning a bit by selecting all of the shapes making up an entire letter and nudging them around as a group. If you want to group the shapes that make up each letter, select them all and hit Ctrl + G. I don't like to actually join my shapes, as this raw, multi-layered version is much easier to tweak down the road. For example, you can easily select your just the skeleton and make the hairlines of your letters thicker or thinner, all with a couple of clicks.

And voila! Now you have infinitely scaleable vector lettering! It might be a little difficult to get the hang of at first, but with practice, it becomes second nature. What do you have the hardest time with when using the pen tool?

Sometimes, when you're focused on lettering every day you'll step back and look at your pieces and notice a sameness - you gravitate toward the styles you've gotten a better grasp of, and you stop challenging yourself. Or you notice you're not even looking for opportunities to get a little more creative or decorative with your type. When I notice this happening, I like to take a familiar word and try to style it up as much as possible. Wearing the same outfit every day is boring. Let's give your lettering some brand new clothes!

Mono-weight sans serif type is usually how I finalize a layout, before I think about adding any style (unless that style will affect the layout, like something with a lot of flourishes or swashes). It's easy to grasp the layout when the type has a little body rather than just a skeleton, so you have a sense of their final visual weight, and you don't want to get bogged down in the details just yet. While this lettering style is fine, it's not exactly stopping people in the street. Here are 8 ways to dress that baby up (and yes, you can use more than one!).

Add Contrast

Try varying the contrast of your strokes. If your pen would go down, or down and to the right to form a stroke, that stroke should be thicker. If your pen would go up, or up and to the right, that's a thinner stroke. If you need a refresher on upstrokes vs. downstrokes, this post on script lettering will help. Thicker downstrokes and thicker upstrokes go beyond script type!

Experiment with Different Crossbars

There are endless crossbar styles out there, all of which will add some personality to your piece. In this case I went with a diagonal, but you can make your crossbar high, low, curved, or even represented by a circle floating in between your strokes rather than a connective bar. Anything that creates a visual bridge between the two strokes you need to connect will work. Certain crossbars will evoke a certain time period of typography - very low crossbars tend to feel midcentury, whereas high crossbars evoke an art nouveau, early 1900's style.

Play with Median Spurs

Spurs are small projections off of the main stroke of a letter. They can be added to the terminals of letters as a type of serif, or added around the middle of a letter (called a median spur) for some additional interest. Median spurs often lend a bit of a Western feel to lettering.

Add Decorative Terminals

Decorative serifs are one of my favorite ways to make text stand out. Styles you'll see frequently include bifurcated (what you see above), trifurcated (similar to above, but with an additional third curve), and ball terminals (transitioning terminals of strokes into a ball, like in the typeface Mastadoni). You can also experiment with illustrative terminals, like serifs that look like leaves or other botanical elements.

Fill in with Ornamental & Illustrative Details

With ornamental or illustrative details, the sky is the limit. You can keep it simple, adding shapes that follow the curvature of the letter (I’m partial to a dot at the median with two teardrop/petal shapes following the stroke), or add small illustrations that relate to the meaning of the piece. If it’s a piece mentioning the outdoors, you can add leaves or flowers to the inside or outside of your lettering. If it’s about winter, you can add some snow sitting on the top of each letter.

Add Inline Detail

Another way to dress up plain lettering is to add hairline strokes inside your type - either straight through the middle, like above, or by following the outline of the letter to essentially create another small version of the letter inside. You can even get crazy and add drop shade to your inline, to give your piece additional depth.

Make it 3D

I’m a big fan of 3D type - it can be used to instantly make important words stand out, and there’s more than one way to create a 3D effect. The most common way is to add a drop shade at a consistent angle, and connect that shade to your original letter. You can have all of the shade receding toward a single perspective point, or add lines and shading to create 3D facets within your letter. You can also change how you fill in the 3D type - with line details, a solid color, or shaded based on the angle of your imaginary light!

For a really fun effect, when you ink your drawing, try shading in and outlining only the 3D portion of your lettering. The letters will still be easy to read but will actually be created by the negative space!

Cast a Drop Line or Shadow

A drop line or shadow is a quick and easy way to give your lettering a little dimension and make it stand out from other letters. I tend toward adding my shadows down and to the left, but just make sure you consistently follow the same imaginary light angle throughout your piece.

Mix & Combine

With these 8 different style options (and many possibilities within each option), there are a million different ways to stylize a letter, especially if you combine them! Examples of wonderfully stylized type are everywhere. If you feel your styles have gotten stale or repetitive, look to type from different periods for inspiration!

Hopefully these examples gave you a little inspiration for your current projects. I'd love to see what you've created - share a link to your latest work in the comments!

Photoshop is easily my favorite method for digitizing my hand lettering. It's quick compared to other methods, and it maintains all of the character (and slight imperfections) of your original drawing. You won't end up with a vector image (an image based on paths rather than pixels, which can be scaled infinitely without ever looking pixelated!), so it's not a viable option if you need to make a small drawing very large. But it works wonderfully when your original drawing is close to the final size you need. So, today we'll be looking at how to digitize through Photoshop. To start, grab your finished, clean, inked drawing. If you have a couple of stray ink spots or minor imperfections you aren't happy with, that's OK - you can clean them up digitally! I scan my drawings in at 600 dpi. I find this method works best with a scan rather than a photo, as a photo just isn't going to be high res enough.

Scan Your Image & Clean It Up

If you scan in a black and white drawing using the File > Importoption, it's probably going to scan in as a bitmap. Go to Image > Mode > Grayscale... and convert the image before you do anything. You're going to be using the Magic Wand in a few minutes, and it doesn't work with bitmap files. Leave the size ratio as 1. After Grayscale, you can convert the image to RGB (for web) or CMYK (for print), so you can add some color in a bit!

Next, I go in and erase any stray ink, dust, or other specks that I don't want in my final piece. I also use the Brushtool to fill in any spots within the letters I might have missed, and crop the piece to the size I want.

Once you're happy with the cleanliness of your piece, right click your Background layer in the Layers panel on the right hand side of Photoshop, and select "Layer from Background." It should now be called Layer 0. You should get in the habit of naming your layers appropriately, but I am admittedly horrible about this.

Isolate Your Lettering

Then use the Magic Wandtool to select all of the white spaces outside of your lettering. You can select the largest piece of your background, right click, and click "Similar" - this will select all of the other white spaces in the drawing. Then press delete. Now you have isolated your lettering!

Caveat: If you haven't done a thorough job filling in any white spots inside the fill of your letters, using the "Similar" feature will select them too. The other option is to just manually Shift+Click with the Magic Wand on all of the individual white areas (like counters and the inside of any flourishes) you want to delete.

Once you've isolated your text, hit Ctrl + Shift + N to create a new layer. Drag this layer in the Layers panel so that it's under your lettering layer, and make the background whatever color you want. I'm sticking with white for now.

Select the layer with your lettering, and click the "Lock Transparent Pixels" box in the layer panel. This locks all of the pixels on the layer, so any editing you do now will not affect the structure of your lettering - just the color or effects on it. Transparent pixels will remain transparent, no matter how many times you click on the transparent area with a brush or paint bucket.

Add Some Style!

Select the color you want your final lettering to be, and sweep the brush tool across all of your lettering - only your lettering should be affected by this! I chose white for my letters, and changed my background to a deep red using the Paint Bucket, for a nice holiday color palette.

Now it's time to add any additional effects you like. I like to add a little drop shadow behind my text, to give it a little extra depth. Duplicate your lettering layer (right click on the layer in the Layers panel, and click "Duplicate Layer") and drag it so it's below your original lettering layer. Nudge the duplicate lettering a bit down and to the left using your arrow keys, make sure Lock Transparent Pixels is selected, and choose a color a bit darker than your background layer. Use the brush tool to color all of the duplicate layer of lettering that color, and voila - a simple drop shadow! If it's a little too dark, you can drop the opacity of the layer a bit.

That's it. Seriously. If you want to explore adding textures to some of your layers, now's the time, but you have a fully digitized, ready-for-print piece!

You can still see every imperfect line or rough edge from my original drawing, and that's why I love about this digitization method. Sometimes, a piece calls for the more perfect edges or a vector file, like if you're hand lettering a custom logo, but generally, I want the organic, hand-drawn look for my work. All of the prints in my Etsy shop are prepared this way.

If a lettering piece is a house, the composition is the blueprint. And a house is only as good as its blueprint.When you walk through a house, you don’t think about where studs and supports are, but you'll notice if a wall or a doorway interrupts the flow of the house. The average person doesn’t consider what decisions went into your design. They see your final lettering piece and notice if something is off, even if they can’t pinpoint what it is.

If your piece is unbalanced, spaced inconsistently, or your styles aren't cohesive, the piece won't flow properly and a viewers’ eyes will get stuck or sent in the wrong direction. It’s your job to understand the concepts of strong composition and execute them in interesting ways.

Learning About Design Composition

These are the most important concepts in any composition:

Emphasis (having some elements dominate while others support)

Balance (the distribution of the visual weight of each part of your piece)

Repetition (repeated use of styles, sizes, weights, or color)

Harmony (commonalities between the style, size, weight, or color elements)

Contrast (differences between the style, size, weight, or color of elements)

Basic Lettering Layouts

When you start lettering, it’s best to keep your layouts simple, but a simple layout doesn’t have to be boring. Rectangular layouts with straight baselines make it easier to focus on exploring more complex styles and letter interactions.

Even if everything in your piece is on a series of horizontal, parallel baselines, you can find ways for your words to interact - that’s what lettering is all about! Break your own boundaries. Finding interactions, like extending the arm of a letter below your baseline to connect with or fill part of the next line of text, can create visual interest and make a piece more cohesive. Lettering elements feel like they belong together when they play nice with each other.

Keeping your layout basic will also help you learn to create flow through hierarchy. Hierarchy is adding emphasis to more important words in a piece (through color, weight, style or size), and decreasing emphasis of the less important words.

Important words should stand out, and other words should support them without stealing attention.Write out all of the words of your piece. Circle the most important words, underline words that are of secondary importance, and leave the ones that are the least important untouched. The circled and underlined words should be given more visual emphasis than the words you left untouched - this is hierarchy.

Complex Compositions

As you improve your lettering, increasing the complexity of your compositions can give your designs more energy and visual interest. Injecting a little variation into a basic layout, like adding a curved or diagonal baseline, can make your piece more playful.

You still want to consider hierarchy in a complex composition - your layout is now just another tool to establish it. If you’re adding a few diagonal or curved baselines, those baselines will naturally have emphasis, since they stand out from the rest of the layout. The words that need the most emphasis should generally be the ones on the varied baseline.

Don’t be afraid to try something new. Try drawing your piece within a circle, or within a silhouette that’s relevant to the content of the piece. There are endless possibilities!

Building and Evaluating Your Composition

Because every lettering piece is different, your content will dictate your layout. Sometimes character length or number of words makes one layout style more practical than another. Other times, the personality of the content demands a certain layout style. Don’t just copy a layout you like - cater your layout to what you’re drawing.

What needs to be included in the piece?

What words need added emphasis?

What words should recede?

Should the piece be playful or more serious?

Taking the time to consider what your piece needs will help you create a unique design that feels like it’s how those words were always meant to look - lettering nirvana! After you’ve sketched a piece, evaluate and tweak your design to make sure your composition is strong and cohesive.

Does everything work together?

Does each element have enough room to breathe? Too much room?

Do the styles work together or fight against each other?

Does anything look disjointed or out of place?

Did you miss any opportunities for letter interactions that would make the piece more cohesive?

Sans serif type is possibly the most important fundamental style for hand lettering. It’s easy to learn, and it’s versatile - it's a great building block for more ornate styles. There are a lot of subtle features to sans serif type that are crucial for balanced, consistent letters. The average person reading your lettering won’t notice them, but if they’re not done correctly, they’ll be able to tell something is off. As a letterer, though, it's your job to know and address these issues! The major struggles I’ve experienced with drawing sans serif types include:

making sure letters are balanced (aka, they don’t look like they’re about to topple over)

maintaining consistent letter thickness (weight)

maintaining even space between letters (kerning)

I’ve picked up a few tricks to address these struggles - let’s dive in! For this tutorial, I’ll be focusing on the word “DRAWS”. This is a great word to practice with as it has a good mix of straight edges, rounded edges, and diagonals.

Set Up Guides & Frame Your Sans Serif Letters

Set up your guides, similar to how you set them up during the formal script tutorial. For my sans serif style, I like the midline a bit lower, as I like the middle arm of my E and the bars of my H and E to sit lower. With script type, I set up a series of angled lines (called stress lines) to guide the angle of my lettering. For sans serif type, you’re generally going to want vertical lines, to make sure all of your straight edges are upright. These aren’t entirely necessary, but they can be helpful, particularly if your baseline is angled. Space them out every 1/2” to 1”, just like with the script type. This way, you’ll always have a guide nearby.

Once your guides are ready to go, frame out your letters to get a feel for how much space you have in the layout. To allow space for the weight of my letters, I usually start just a smidge (think about 1/8”) in from the edge of my layout and end the same amount in from the edge, and err on the side of spacing letters a little bit too far apart. This gives you a little extra breathing room around your letter frames for the body.

Add the Body

The initial body sketching step will involve a lot of lines crossing over each other - think of this like a blueprint. It’s much easier than trying to perfect a letter’s shape and weight by outline only. Not all of these lines are final lines, but drawing the structure this way will help you maintain consistent widths and keep everything proportionate.

Using your frame as a guide, define the first outside edge of your letter. Then, draw a line parallel to that line - the inside edge of that stroke - to define your stroke width. Use the tops of those sketch lines to start your next stroke (for the D in DRAWS, it will be the outside stroke of the bowl of your D) - this will help you maintain a consistent width. Then, draw the inside edge of the bowl of your D, making sure it’s creating as much weight as the straight edge of the D. Work through all of the letters similarly, until you get to the S.

Ahhh, the S. The bane of every letterer’s existence. My tried and true way to approach the S is to draw two circles (basically like an 8), with the top circle slightly smaller than the bottom. The top circle will guide the outside stroke edge of the top of your S, and the bottom circle will guide the outside stroke edge of the bottom of your S. Then you’ll just follow along your curved edge to complete the outline. You can see the circles in the sketch above.

Pay Attention To The Details

Upper arms (like the strokes on a K) or bowls (like in a B or R) should not extend as wide (or wider than) the lower arm or bowl - this will make your letters look like they’re off balance. The lower arm or bowl will act as a visual anchor for the letter when it’s wider than the bowl or arm.

Crossbars should be a little thinner than your upright strokes. Look at an A, H, or T in a san serif type face - if you measure, you’ll notice the crossbars are probably thinner, but visually hold the same weight.

Round letters should extend a little above and below the baseline and capline. The space they take up appears smaller than a letter with hard edges, so you need to compensate.

Diagonal strokes shouldn’t connect to the ends of your upright stroke lines exactly - that will make them too thin.

Now that you’ve sketched out the body, it’s time to comb over it to find any problem areas.

Maintaining Consistent Weight

As you go through the rest of the word, look back at previous letters to make sure your structure lines are the same width apart. At the end of your first round of sketching with the full body of the lettering, take a step back - do any letters look too heavy? Too thin? You may need to lightly fill in the letters with your HB lead to get a good feel for the visual weight. Sometimes, when I want to be exact, I’ll bust out my ruler and measure the widths. Note problem letters, and refine your sketch. Repeat until you’re satisfied with the weight and shape of every letter.

Maintaining Consistent Kerning

When you’re drawing a word, you need to make sure you have room for each letter, but you also need to make sure each letter has room to breath. It takes time to develop a good eye for letter spacing because it’s not based on an exact measurement - it’s often about perceived space (much like how round letters need to extend above and below the baseline and capline).

All letters are some combination of rounded lines, straight lines, and diagonal lines. So within that, you have 6 potential combinations to kern. Here are some quick rules about the relationships between different letter shapes (not all letters are created equal, so take it with a grain of salt...):

Two straight edges: Like MN. Visually the heaviest. Should have the most space between edges.

Two rounded edges: Like OC. Visually the lightest. Should have the least space between their narrowest point.

Two diagonal edges: Like AV. Should be spaced about the same as straight edges, but measured on a diagonal.

One straight, one diagonal: Like MA. This one’s the toughest. The narrowest point should be spaced about the same as two rounded edges - probably even a little tighter. The letters will almost touch at their narrowest point.

One straight, one rounded: Like MO. The narrowest point should be a little narrower than two straight edges, but a little wider than two round edges.

One rounded, one diagonal: Like OA. The narrowest point should be a little narrower than one straight, one rounded.

One trick I use often to check my kerning is to flip my drawing upside down. This keeps you from getting distracted by reading the piece and allows you to focus on the shapes. Over time, you'll develop mental kerning pairs - letters you see next to each other frequently, and are familiar with how to space them - and proper letter spacing will come more naturally.

Ink What You’ll Keep

Once you’re happy with the weight and shape of all of your letters, you’re going to ink only the lines that actually form the outline of your letter. You can either do this directly over your sketch, if you have a good eraser, or with tracing paper or a light pad.

Voila! You have an incredibly straight and consistent sans serif word. With a lot of practice, this process will get faster, and you’ll eventually be able to skip some steps. You’ll develop some muscle memory about how certain letters are formed, and you’ll be able to work with fewer guides and fewer structure lines to nail it.

Take Your Time

The key to improving your sans serif lettering is to take your time and keep a steady hand - you’re working with a lot of lines that need to be straight. When you see a finished piece out in the world, it’s difficult to appreciate the time, work, and thought that went into the piece. The sped up start-to-finish videos you see on Instagram are awesome for a quick insight into an artist’s process, but they don’t reflect the true pace artists generally draw. Take it slow - you’ll keep a steadier hand, your lines will be straighter, and maintaining consistent lettering weight will be much easier.

Since we weren’t able to cover every letter of the alphabet, I’ve created a printable guide available for download, so you can see how all of the letters in my personal sans serif style are constructed.

If you have any tried-and-true tricks you use to form certain letters, please share them! What letters do you struggle with the most?

**The winner of last week's giveaway is Darcy T! Darcy, I'll be in touch soon about how to send you your prize!** Sketching is the most important part of the hand lettering process - your polished piece is only as good as your sketch. Done right, sketching helps you break a design into manageable pieces, build new lettering styles from their base, and plan an interesting and balanced layout.

Over the years, this sketching process has helped me make sense of approaching a complex design. An effective sketching process gives you a polished drawing ready for tracing with ink or lets you skip inking altogether and go straight to digitizing.

Start with Thumbnail Sketches

Thumbnail sketches are a quick way to evaluate compositions rather than relying on the picture in your head when you start a full size sketch. Before committing the time it takes to lay out a large, detailed sketch, I create very small versions of my chosen phrase to play with different compositions. I usually just frame out the skeleton of the letters, but if I know the style is going to affect the layout, I'll roughly sketch that here as well. This sketch is not supposed to be perfect (hence my lovely photo above).

This is the most effective and efficient use of my time, as it allows me to reconcile most layout issues before I get too deep into a sketch, and strengthens my overall compositions.

Thumbnails also help you be more open to experimentation - if a layout idea you have doesn’t work out, you haven’t invested a ton of time in trying to make it work. Get creative! Don’t feel obligated to stick to straight, perpendicular lines. Try out some slants or use curves. Or, letter a word or phrase inside a relevant shape.

Pro tip: I keep ALL thumbnail sketches as a catalog of layout concepts. If a concept doesn’t work out for this idea, it’s helpful to keep a visual of it in case it will work for a future piece!

Set up your Full Size Layout

Once you’ve landed on a layout you like based on your thumbnails, it’s time to set up for your full sketch. Here are a few tips that have helped me set up my sketch right the first time.

Effective sketches happen in layers. Start with a lighter lead (HB) for your guidelines and initial sketch, all the way through. Then move on to a darker layer as you start to finalize lines.

Measure, measure, measure! Draw guide lines so you know what needs to fit where. Often I won’t set an exact width for the layout, particularly if I’m just drawing one word. Sometimes you’ll want a more exact approach, and other times you’ll want to be more relaxed with your guides. It all depends on how precise you want your piece to be.

As you draw more, you’ll get a feel for how much space individual letters need to fit in a certain area. The great thing about hand lettering is you can turn a limitation into a creative opportunity, like adding style pieces to fill gaps in your layout.

Sketch in Stages

Once I have my guidelines drawn, I sketch in three major stages.

First, I draw out the skeleton of all of my letters. This is just the basic, monoline shape of them, like a thin sans serif font. If flourishes, accents, or connections between letters are going to be a significant part of your design, add the skeleton of them as well. If you know the style you're going to use will add significant width to your letters, give them some additional space in the skeleton stage.

Don't worry about being too perfect here. You want to be accurate in terms of the size of the letters and underlying details, like how high crossbars will sit or how circular your curved letters will be, but these will not be your final lines.

Next is the body - this is where you add the weight to each letter, as appropriate. Sometimes, all you’re going to want is the skeleton (particularly for less important words in a phrase). But generally, your letters are going to need a little more to them than the thin frame. Don’t worry about adding cosmetic style yet.

If you're imitating calligraphy, thicken the downstrokes (anywhere in the letter your hand moved down the create the line - this is when a calligraphy nib would open up, allowing more ink to flow across a wider line, making the stroke thicker). If you're creating block letters, maintain consistent width across all parts of your letters.

Finally, you can add the style, whether it be some ornaments inside the body of the text, serifs on the ends, median spurs, shadows, a 3D effect - you name it! This is also where you should evaluate your composition, and identify where you may want to add flourishes, ornaments, or other features to balance everything out.

This is often where I find ligature opportunities that may not have been obvious during my initial framing. Sometimes, even with the best layout plan, you realize at this point that it will look better if you extend the tail of your “y” a bit, or connect two letters together that you didn’t see an opportunity for before. Once you've figured out which lines are your final lines, use an eraser (or eraser stick, for finer details) to erase the other lines and clean up your sketch. Then, use a darker lead to darken the lines you're keeping. This will help you avoid any confusion when you start tracing your sketch with ink.

When it comes to style, focus on legibility over everything else. Don’t get so cutesy with your layout or style that the words are difficult to discern, whether it’s just hard to read or the words are emphasized in a way that makes them naturally read out of order. A hand lettering piece should be imperfect - after all, it is hand drawn. But if it’s not legible and the words don’t flow properly, what’s the point?

Start Inking!

At this point, your sketch is ready for ink! Your final sketch should contain every single detail you’re planning on putting into ink. Don’t plan to resolve anything while you ink a sketch. If you take the time to be thorough in your sketch, it’s far less likely you’ll have to start over during the inking process due to an errant line of ink.

This process may sound a little more time consuming than just diving in and winging it, but sketching this way is part of a deliberate practice process. It will help you improve and vary your layouts and lettering styles.

When it comes to learning hand lettering (or anything new), it seems like figuring out how to get started is always the hardest part. The best way to think of lettering is as a combination of typography and drawing: you need to have a solid understanding of typography concepts, but you also need to work on your drawing skills. I’ve come to love these two hand lettering exercises, which have helped me explore new variations and learn how to apply them to any character. They get your creative juices flowing and warm up your drawing muscles, which makes keeping a steady hand for your serious work that much easier! These exercises complement one another to round out your warm up.

A Quick Type Overview

Before we start, I think it’s important to go over a little introduction to the basic categories of type. Depending on who you talk to, there are a number of ways to categorize type, but I personally group them into 4 major categories when it comes to lettering: serif, sans serif, script, and decorative. This isn’t to say that all typophiles would agree with this (they probably wouldn’t) or that these categories are mutually exclusive - there can be a lot of overlap, but here’s a quick overview of how I define these categories:

Serif type includes any type with small lines or extensions added to the ends of a letter’s strokes. There are a TON of serif styles, but here’s a handy image that shows some of the variety out there. Times New Roman, Cambria, or Georgia are good examples.

Sans serif typeincludes all non-script fonts without serifs. Fonts like Arial, Helvetica, or Gotham are great examples.

Script type includes anything made to mimic handwriting, whether it be calligraphy, plain cursive, or brush lettering. The letters in script type usually connect, but it’s not a hard and fast rule.

Decorative type is my mental catch-all for styles that don’t fit nicely into one of these categories, including more ornate letters or those of a more illustrative style (like creating an “O” that looks like a donut, for example). I include blackletter in this category because I haven’t learned those calligraphy techniques, so I approach it as a detailed, decorative drawing style.

Now that that’s over with, let’s move on to the exercises!

Exercise 1: One letter, infinite possibilities.

Pick a single letter of the alphabet (I pick one I haven’t focused on in a while, or a prominent letter from a specific piece), and draw it as many ways as you can. It may sound daunting at first, and you probably think you’ll only come up with a few, but once you get going you’ll start coming up with new styles faster than you can draw them!

There are an infinite number of styles you can create when you’re drawing a letter. To get you started, you can:

Add flourishes

Try different serif styles

Tweak weights of up and down strokes

Experiment with the way a letter might extend to interact or connect with another letter.

There are a few different ways I like to approach this exercise, depending on what I’m working on.

Set a numeric goal.

Megan Wells turned me onto this approach in her Introduction to Lettering post on Alisa Burke’s blog. She talks about drawing one letter 100 different ways, but if that seems like too much, start with 25 at first, work your way up to 50 the next time, then 75, and so on.

I like to focus on a numeric goal if I’m just warming up and don’t have a certain style or mood in mind.

Pick a category.

Often I’ll outline a specific piece and know I want to use serif lettering for part of the layout, but beyond that I’m not sure what I want it to look like. I set that as my parameter rather than a number, and draw as many serif iterations of my chosen letter as I can. This is a great way to push beyond the standard looks within a type style, and helps you find your own personal style.

Pick a mood or personality.

Recently I was working on a few pieces for a client where my major art direction was mood/personality-based, rather than specifics about typographic styles. I picked a prominent letter from the piece, and started exploring different styles that might express the mood. One was playful and young, and another was sinister and ominous. I’d never done this exercise with this criteria before, but it was a refreshing way to look at letters and now it’s one of my favorite warm ups!

Exercise 2: One style, every character.

Pick one of the styles you drew in exercise one, and determine how you will apply it to every single letter of the alphabet. When I started doing the first exercise to explore new styles, I’d often pick a style from my warmup, apply it only across the letters I needed for my piece, and move on. Then, weeks down the road, I’d want to use that style and struggle to figure out how that style would apply to a new letter. Taking a detailed style from an N or an A, and making it work for an S or an O can be extremely difficult (life throws you curves, am I right? I’ll see myself out). I started incorporating this second warm up exercise to nip this problem in the bud.

What characters you include in your final set is up to you. Lowercase and uppercase? Numbers? Punctuation? Some of my styles belong in all caps, and others need both sets of characters. Don’t get discouraged if you have to redraw some letters multiple times before you get it right - that’s the point! The more you do this, the easier it will get.

Once you have every character you need sketched out, create a more polished guide. I may not work in alphabetical order during the exercise, as it’s often easier to knock out similar letters consecutively, but I use my light pad to trace the final sketches of each character in alphabetical order, and file it away for safe keeping. Whenever I think I might want to use that style, I pull out my guide, and it’s much easier to recreate the style consistently!

So there you have it - two of my go-to warm up exercises. Calling them hand lettering exercises seems a little like a bit of an undersell. Iterating like this frequently will help you discover your own unique lettering style. These exercises will also help you improve your drawing skills, your understanding of type, and push your creativity - think of it as mind mapping, but for letters!

Do you have a go-to exercise you use for warming up? I'd love to hear about it in the comments!