Online Book Reader

Home Category

Rockstar Icon Designer - Kate McInnes [35]

By Root 410 0
handle for the magnifying glass, I was able to join it with the top part by using Option + Clicking the “Unite” function, which then made a compound path of the two sections of the icon.

Use exclude to create a hole in the magnifying glass.

Scissors and Join Path Tools

This is a great technique for people who may not be comfortable with using the Pen tool or want to create exact geometric shapes. It's a bit like cutting and pasting paper, but in this case it's cutting shapes and joining them together with points.

With the magnifying glass, I needed to create a clean join between the circle at the end and the rectangle of the handle. Normally on larger icons, I would make a circle and use the Pathfinder to combine it with the rectangle (or simply make a rounded rectangle). For smaller icons, I find that the edges of the circle don't quite align where I want them to. This is because the pixel boundaries of the artboard are trying to dictate where the circle is placed according to the shape as a whole. To get around this problem I drew a circle as close to the position it needed to be in as possible, then using the Scissors tool, I cut two points in the side of the circle where I wanted it to join with the rectangle.

Use the scissors tool to cut and ellipse in half to form the end of the handle.

Using the Direct Selection tool, I select and deleted the part of the circle I don't need then repeated the same steps with the end of the rectangle. Once I had two open shapes, I took the Direct Selection tool once more and selected the two points I wanted to join together. Sometimes it can be difficult to single out the points without selecting other objects, so if this happens use the Lasso tool and draw around the points. Once the two points were selected I joined them together using Command + J (you can also use Object > Path > Join from the menu). Once the half circle was joined to both sides of the rectangle, I tweaked and moved it into position along the guidelines.

Join paths together using Command + J.

Using this technique is great for building up shapes, but unlike Compound Paths and the Pathfinder options, shapes cannot be altered or moved once they are fused together. If you're using this technique, remember to make a copy of the shapes before you cut them so you have a clean copy to go back to if you need it.

The final result.

Shape Builder Tool in CS5

The Shape Builder tool is new to Illustrator CS5 and works a bit like you would imagine a Pathfinder brush would be like. You can use it to add and subtract areas from overlapping shapes making it quick and easy to stack shapes together and craft objects with a single tool.

As an example, I'm working with an expanded version of the magnifying glass. For the Shape Builder tool to work, it has to be used on shapes that are not grouped or part of a compound shape.

Create shapes for the layers.

Creating shapes is really straight forward, first select the Shape Builder tool and mouse click + drag over area that you want to combine, multiple shapes can be combined with a few clicks. Areas that are affected will show up in a dotted pattern as you mouse over the areas.

Combine the shapes.

Once a group of shapes are merged they may take on a different appearance. The style of the new shapes will either be the same one as the first shape that was selected, or if there's no style selected first then the style that's ready to be applied to a new shape will be applied to the merged shape, such as a selected fill or line style.

The style of the new shape is the same as the first shape that was selected.

To delete shapes, simply hold down the Option key and click or drag over the areas you want to subtract. This is good for areas you want to cut out from a shape or to tidy up the outside area of a shape that has already been made. That's how simple it is to use the Shape Builder tool. This technique doesn't always make neat paths, so you may need to go around and delete any stray anchor points.

Remove the center of the magnifying glass.

Working with

Return Main Page Previous Page Next Page

®Online Book Reader