Paths in Photoshop

Paths in Photoshop

  • Design

Paths are the building blocks of the vector graphics format (a format that represents images based on mathematical equations). This is in contrast to the raster format, which uses a grid of pixels. Photoshop documents are unique in that they are based on a pixel grid but allow the use of vector elements. Vector paths are ultimately processed on the pixel grid, but the PSD format — as well as a few others, such as EPS and TIF — saves the vector data so that you never have to rasterize it. This dramatically increases flexibility and productivity, making paths an indispensable tool. Paths consist of a series of anchor points, each of which has two handles that dictate the curvature of the lines connecting it to other anchor points. The mathematical basis of paths allows them to be scaled indefinitely without losing the smoothness of their curves (referred to as Bezier curves). Photoshop provides a number of tools that allow you to create and modify paths, and there is a variety of ways to implement them.

Path Creation Tools

Pen Tool

The Pen Tool (P) is the most dynamic path creation tool available to Web designers. While it is not really suited to creating geometric shapes, it shines with organic forms. It provides a precise means for creating paths, but it requires an experienced hand to plot naturally flowing curves. A lot of practice is necessary to feel comfortable with it, but mastering the Pen Tool is well worth the time invested. Photoshop provides two different pen tools: the standard Pen and the Freeform Pen. Although it requires manually drawing every line segment, the standard Pen Tool is best suited to nearly every task. The Freeform Pen can be handy — with the

Magnetic option turned on — for quickly tracing an object, but the path is rarely as clean as it should be. At first, using the Pen Tool involves a lot of trial and error, but rest assured, there is a methodology to creating well-formed paths.

Start in a Corner

The first point in a path is probably the trickiest, because you cannot see how the final point in the path connects to it. For this reason, starting in a sharp corner is best. This way, when you reach the end of the path you won’t have to worry about the smoothness of the curve.

Add Points Where Necessary

First, add points wherever there is an abruptness or sharp change in direction. The directional handles on these points will typically create an acute angle, if any handles are even necessary. “On-curve” points are a little trickier. Add them where they feel most natural — typically at or near all optical apexes.

Keep Points to a Minimum

It may seem that the more points that are along your path, the more accurate the path will be. However, this typically makes for jagged and awkward paths. Using as few points as possible is always good practice. Just remember: the fewer, the smoother.

Use the Rubber Band Option

To set anchor points exactly where you’d like them, you can turn on the “Rubber Band” option, located in the drop-down menu next to the Custom Shape Tool button in the Pen’s property bar. This setting allows you to see the curve connecting the last anchor point to the mouse’s current position.


Spring-Loaded Tools

The Pen Tool has a number of hidden capabilities known as spring-loaded tools that make it the most powerful tool for creating and editing paths.

Convert to Point Tool: Option (Alt) while hovering over an anchor point

Direct Selection Tool: Command (Control)

Path Selection Tool: Command + Option (Control + Alt)

Group Selection Tool: Command + Option (Control + Alt) while hovering over a path

segment or anchor point

Add Anchor Point Tool: Hover over path segment

Subtract Anchor Point Tool: Hover over anchor point

One Comment

  1. great in-depth info about the pen tool!

Leave a Comment