Unit 2 Finding Your Passion Creating Icons

Introducing Icon families

A website known as “Iconfinder” was launched in 2009, they were offering only two ways to purchase icons: you could either buy a single icon or icon sets. Fast forward five years to 2014, they introduced a much-needed subscription product: the Iconfinder Pro. Since then, the two Pro plans have been great money-savers for those who need icons on a regular basis and a great way for graphic designers to make money on the side simply by making icons.

Now, observing the icon market over the recent years has brought new insights into how icon designers create their artwork and how customers buy it. In the graphic design world, we have noticed many designers release extensive icon collections made in one distinctive style. Today we are going to learn exactly how to do one style. The outline.

Styles of the Icons

Icons can be segmented into plenty of different styles and style variations. The most common among them are these:

Filled Icons

The next logical step you can take after the outline icons are filled icons which basically means incorporating colors into plain outline ones. This style is quite new, but it is becoming more and more popular these days.

Filled Icons

 

Outline Icons

As you can say from their name, these icons are created out of outlines. From my experience, this is the easiest style for beginners to start with.

Outline Icons

Glyph Icons

Most commonly, solid icons are called glyphs.

Glyph Icons

Flat Icons

Similar to the filled icons, this style is a variation of the outline icons. It is the next step from the glyphs that imply different color combinations usually “flat” colors.

 

Flat Icons

Hand-Drawn Icons

As you might guess, this style is an imitation of icons drawn by hand.

Hand-Drawn Icons

Skeuomorphic Icons

Skeuomorphism is the design concept that concentrates on creating items resembling their real-world analogs.

Skeuomorphic Icons
Skeuomorphic Icons

Remembering Icon Size and Proportion

One of the main rules to obey when creating icons is that all of the icons in your set have to fit into the same square art board. It doesn’t matter if the real-life objects you are transforming into icons are of completely different sizes, like, for example, a paperclip and a photo camera. Their icons need to fit into an artboard of one particular size and visually look as if they were the same.

However, this doesn’t mean that your icons must touch all four sides of the artboard. Some icons can be a little bit smaller if that makes the entire set look the same size. Always, go with the size that is best for your particular project. Say, if you’re creating icons for iOS or Android, you should check their icon design guidelines first before deciding on the icon size. If you’re making icons for a web project or want to practice, use any of the default sizes: 16×16, 24×24, 32×32, 48×48, 64×64, 96×96, 128×128, 256×256, 512×512.

A quick tip: If you’re at the beginning of your path as an icon designer, I’d recommend avoiding the smallest icon sizes because they are way more difficult to work with. 64 & 96 px grids should be the sweet spot, as you get better you can move smaller.