4 dotted line drawing methods in Photoshop

by Guest Writer

Photoshop Dotted Line Tutorial Here's another notable tutorial from Winbluegod from 4-designer.com. This full Photoshop tutorial covers 4 different drawing methods for creating dotted lines in Photoshop. We know it's easy to generate all kinds of dotted lines in Illustrator, but Photoshop just doesn't have that skill set. So Winbluegod has these alternative methods for dotted lines in Photoshop. He writes . . .

Since a lot of dotted lines (such as splitters and borders in UI design) will be used in practical drawing, I would like to share here 4 dotted line drawing methods that I have concluded by myself.

One: Pencil and Pixel

This is the most straightforward and time-consuming drawing method.

We take the tool "pencil" as an example. Here is an amplified pixel grid to help explain. Because the pencil tool is edge-sharpened and will not leave extra trimmings when drawing, so it is suitable for drawing lines that require high pixel accuracy, but not fit for drawing straight lines.

Step 1, Draw the dotted line part. Draw a 4xl line segment here.

Step 2, Use "Marquee tool" frame to select drawn pixels.


Step 3, Press “Ctrl+Alt+T” to get an option bar as shown in the following picture. Now make sure the triangle is in the state of being selected and input shift values into the X value input box. If you want the clearance part of the dotted line as 3px, input 7 (because the length of the dotted line is 4px). At this point, the line segment will move 7px to the right when copying. Then press "Enter" completes the change.

duplicate the second dot

Step 4, Now make sure it is still in the state of box and continuously press down “Shift+Ctrl+Alt+T” to copy the line segment infinitely and attain a dotted line with a 4px solid line segment and 3px clearance.

Here's the dotted line

You can have many variation by using this method.

variations on the dotted line PS: select pixel with "Marquee tool" before making changes so as to keep only one layer when making duplicate transformation and reduce the number of layers.

NEXT: The second, more flexible and time-saving drawing method

... continues on the next page!

27th Anniversary for DTG Magazine