Icon Design — Surf a Long Mileage with Pre-work

I am not here to give you tips or advices to design better icons, I am not even good at that, I am just sharing my personal way of thinking, processing and designing icons.

Icon is the minimalist pictorial representation. When a comparatively larger picture being compressed to its shortest appearance without compromising its value, appeal and contexts we can call it an icon. It is not very tough to design an icon. But if you try to make it structurally perfect you have to work a little bit harder, and it becomes really hard when you are thinking about a perfect icon with proper structure and aesthetically bold visual and easily communicative.

There are lots of books, articles regarding A to Z of icon design. But most of the writings are on technical strategies, measurements etc. I am not ignoring the technical aspects of icon but I would like to consider it as a very last stage of the design process. There are lot more things to work with before we go for technical phases. Here I am going to share my thoughts and work processes as pre-technical steps. It may be helpful for new icon designers.

Determine the purpose

There are lots of usage and utilities for icons. Firstly determine the utility of that particular icon whether it is for decorations of UI or Functional for devices or even brand icons. Every type of icon has distinct ways of representing the utilities. You should not mix it up. As an example, if you design icon following android material icon guidelines for decorating a “beauty and care” website portal, you are not going to get proper visual impact out of it. So it’s really important to understand the purpose of designing an icon before you start working on it.

Start with a subjective name

I always prefer to find an appropriate and subjective name for my icon and I do it at the very beginning with a single word or maximum two. It helps me looking deep down the visual of that icon with a very narrow angle of focus. Let me give you an example, may be you are thinking about a visual of “a man working with his laptop”. It has a very wide range of visual along with thousands of meaning. But if you name it “coding” or “designer” or anything related to core purpose of working with a laptop, it will help you finding better and meaningful visual.

Let me make it little more clear. The words “lock”, “safety”, “protection”, “security”, “password” or even “vault” every word has similar intentions but very unique nature of expression at the same time. The word “lock” or “vault” is subjective but other words are more generic, sometimes neutral or abstract. But the fact is you can’t make an icon abstract. You have to give it a form by using perfect metaphor for making a relatively meaningful sense. That’s the reason I always prefer to find a subjective name first, even if it already has a neutral name.

Visualise it/ Use right metaphor

Once you are decided to make a “designer” or “coding” icon, try to visualise the way you are thinking to portray it. May be you are thinking about “a man working with his laptop” or something like that. As I’ve said earlier that the line has thousands of meaning, so you have to apply some prominent and well recognised characteristics upon that laptop man, so that any viewer can easily identify him as a designer or a coder. You have to be very careful about how you are going to portray message through your icon.

Sketch it

It’s a good idea to make its first impression on a piece of paper rather in illustrator or any other design tools. Just make some rough sketches according to the way you’ve already described yourself. It’s not necessary to be determined about the look and feel of the pictogram at this stage, just make yourself free from making boundaries. Freehand drawings may provide you some out of the box shapes and styles for your icon that you won’t even think about it.

It would be better if you can create a unique style for your icon set at this stage. Do experiments with the style you’ve just thought about. Find out some guidelines to ensure the visual or style continuity all through the icons. While making guidelines for a particular set of icons, basic design principles should be kept in mind. It will help you to make perfectly balanced icon.

Finalise the design style

Once you are happy with the experiments and determined with the style, you should start with design tools like illustrator etc. At this stage there is nothing about creativity but to follow the rules you’ve created previously.

But most important part of this phase is measurements. Measurements of forms or strokes and spacings. As this file will be considered as outcome from all of your experiments and research, it should be perfectly measured and also be technically perfect according to its usages. You can get lots of books, online blogs regarding how to make the icon technically perfect for a particular platform.

Nowadays icon has become one of the strongest and funny ways to express ideas without using any language. Icon itself is a language now and it has been flourishing everyday. Thousands of talented minds are working behind it to take it to next level. So what’s the next step? Maybe we should remain steady and let the time to decide. When the novice graphic designers from today will grow up and blend their ideas with upcoming technologies to serve the future — is not a hard idea to believe!

You can check my iconfinder profile here. Thanks