Getting a new icon set for your website or application often means going back to the drawing board. You would be considering many aspects during the design process such as how your new icons will convey your business or brand’s identity, and whether the images used are relevant in identifying the functions they represent or what colour scheme you are using.

In some cases however, if you have already gone through most of these design processes and are quite happy with the icon set you have, you may simply be seeking for tips or professional design assistance on achieving some different effects. This may be because your product or application has upgraded and therefore your icons need tweaking to finish off the new look. Similarly, you may have redesigned your website and want your icon set revamped with some effects to suit the new, fresh site. There are different effects you can apply on your icons, achieving a revamped and more polished look to the icons.

Going 3D with icon design

3D icons

As you will no doubt have noticed, 3D icons come in all types. You may even want to go as far as to animate your icons, which may require designing 360 degree variations. Whatever your approach however, light and shadow always play an essential role. It’s important to identify or create your light source, which will then determine which part of your icons are in shadow, and which parts are reflective. In almost all cases you will want to keep the light source constant throughout a particular icon set. Shadow may also be used to give the icons the appearance of standing out from a surface.

Creating a wet look on your application

Another popular look at the moment for icons, which has stemmed off of the 3D concept, is recreating the elements. Making an icon resemble water or gel for example makes them more ‘real’ and tangible as does the popular ‘wet floor’ look, which makes icons appear as though they are resting horizontally on a 3D surface. Again this is determined by rendering and highlights as well as layering. And water is not the only element that is being recreated in icon effects. Fire is also a popular one, where the choice of deep colour as well as blurring can create the visual impact of fire as well as giving the impression of heat. Equally, giving an icon what appears to be a white film over it can help achieve an effect of cool temperature and sometimes frozen effect if cracks are added to give the impression of an icy texture.

Adopting textures for your website

There are a myriad of textures you can create simply by adopting a background that mimics what you are after – wood and paper being prime examples as they are materials with distinguishing features such as creases, rips and grain and have proven popular on many blogs as a background for icon sets. For a more rustic effect you could approach your icons with a hand drawn effect. Handwritten or school style fonts have become increasingly popular, especially with music and indie sites, so having an icon set to match that would work well. This scratchy, freestyle and almost doodled effect is best achieved using Adobe Illustrator, changing your brush settings as desired. Whether you attempt to create these effects yourself or approach designers for assistance, you know there is a lot of choice out there, where you don’t necessarily have to accept the norm.

Adam Parrish

Owner and creative director at Creative Freedom Ltd. Unbelievably cool icon design expert, husband, and father of two awesome girls. A proper decent chappy and thoroughly fab to work with. Ok, so I wrote my own bio…

Leave a Reply

Your email address will not be published. Required fields are marked *