Adding a search function to your site can greatly improve its user experience, and spicing that search experience up with a beautifully designed search icon can help, too.
In this tutorial screencast, I will demonstrate several techniques in Adobe Illustrator CS4 that can be used to create custom search icons for use in ecommerce website or application projects.
What You’ll Learn From This Video
First, I will create an ellipse with a large stroke and use Object»Expand along with the Pathfinder tool to create two shapes. One shape will act as my lens and the other shape will act as the metal rim around my lens. Once I have created these two shapes, I will use different gradients and strokes to style the lens portion of the magnifying glass.
Next, I will show you how to use the Line tool, along with the Expand command, to create the handle for my magnifying glass. After creating a base for my handle, I will use the Eyedropper tool and Gradient tool to style them.
To add some final touches, I will show you how to add an inner glow to the lens and create a lens highlight using the pen tool. After drawing the highlight path, I will show you how to add a white-to-black gradient and set the Blending mode to Screen.
At this point, the magnifying glass search icon is complete. Beyond this design, I will show you a few simple steps to create two additional icons. These icons can easily be modified with different color schemes to fit your site’s overall design.
