I came across the work of Piotr Kwiatkowski while browsing for user interface design. I liked the how he used drop shadows and subtle gradients to give these 2d UI elements some dimension. Piotr also provides the PSD’s on the dribble page, so I took a look to see how he made them. Once I understand what’s involved, how can I replicate this look in Adobe Illustrator.
DISSECTING PHOTOSHOP LAYERS
After examining the layers, there were no real surprises in how he put it together except for the use of two shadows. the difference between them is Y-position.
ADD FILLS, FILLS, AND MORE FILLS
Recreating this knob in Illustrator would neither be challenging or interesting so I thought I’d try to pull it off exclusively in the Appearance Panel.
The benefit of applying styles through the Appearance Panel is the ability to save them as a Graphic Style. Now you can simply click the Graphic Style to apply the look to any object.