Rockstar Icon Designer - Kate McInnes [41]
Add some blurry bokeh style circles to the wallpaper and apply layer effects to create circles of varying opacity and blending modes.
Applying a single Layer Effect to multiple layers at the same time is a massive time saver if you're working with lots of little details that need the same effect, but cannot be part of a single shape layer.
Adding the Finishing Touches
Once the screen is finished, it's time to go back to the main icon and apply the final layer effects. For this icon, the finishing effect is a radial gradient to add a secondary highlight to the screen and an outline to add definition to the shape.
Add some more highlights to the screen to exaggerate the light source.
As you can see, the large scale icon looks like it's missing something, so I added an embossed logo to the bottom and a LED style light to create some focal points. When the design is scaled below 256px, the layers with these details will be removed in order to de-clutter the design.
Add an embossed logo to the bottom and a LED style light to create some focal points.
Desk View Icons
Items drawn in desk view can be drawn in any angle as long as part of the top of the item is visible, and the lighting casts a shadow underneath the object. Mac OS X specifies that the light is from above, casting a soft shadow underneath the item, and Microsoft Windows specifies that the light is from the top and slightly to the left casting a shadow across the right side of the design.
This is where the perspective of icons differs from actual perspective in drawing theory. Loosely based on the concept of different surface views, desk view is the common way of drawing Mac and Windows application icons. In the Apple Human Interface Guidelines, designers are simply asked to imagine looking down on an object that is placed on a surface that is light from above. This seems simple enough, but special care should be taken with perspective in order to achieve the illusion.
The viewing angle for desk view icons.
Desk view can be used for Toolbar or desktop icons depending on the vanishing point. Icons with an exaggerated sense of perspective are best used as application icons where icons with a subtle sense of perspective are suitable for Toolbars.
There are no exact rules to this style of icon, except to make the icon appear like it's viewed from the front and slightly above the item, like it's resting on a desk. This can be confusing and will take some time to become familiar with. Once again, sketching out the design is a great way to refine the icon without spending unnecessary rendering time.
Icons with this style of perspective can become blurry at smaller scales. A common method of dealing with a smaller rendering size is to make the large icons (anything above 25px) with perspective and then change the design to Front View for the small scale icons.
It's important to note that Microsoft Windows requires all icons that are drawn with perspective to have a zero-point perspective version for Toolbars and list view.
Tips for Creating a Realistic Desk View Icon
There's a certain frustration that occurs when an icon design gets off to a bad start and no matter how many tweaks you make, it never seems to look right. I like to call this a "Tweaking Loop." Believe me, it can happen to anyone. When I was thinking of objects for the following lesson, I spent an entire day rendering a paint bucket. The textures and lighting effects looked great, but no matter how hard I tried to get the handle right, I just couldn't achieve the correct perspective. Even the most experienced icon designers can get off to