Icon Designers Blog

Illustrator Icon Design Tutorial

Step by Step Illustrator Icon Design Tutorial

  |

In this Illustrator icon design tutorial we look at creating a small set of ‘almost flat‘ icons from scratch. First, open the Adobe Illustrator and create a new document. Then create a rounded rectangle using Rounded Rectangle Tool with: Width:200px; Height:155px; Corner Radius:10px. After that create another Rectangle with: Width:36px; Height:36px; Rotate it 45°. Unite… Read more »

Email Icon

Designing Cross Platform App Icons

  |

I thought it might be useful for designers and clients alike to see how we approach a typical App Icon design project. In this case study the client requested an App Launcher Icon for an Email App developed on multiple platforms. The first thing to consider when creating an icon for different platforms is how to… Read more »

Icon Design Tutorial - Small Icons

Designing 16×16 pixel icons in Photoshop

  |

Small Icon sizes such as 16×16 pixels are often neglected in Icon Design, in my opinion though, this is where the real skill lies. In most cases simply scaling down a larger icon is not going to work and is often why for 16×16 pixel icons it is acceptable to drawn them in a slightly… Read more »

Recolor Icons

Recoloring Flat Icons in Adobe Illustrator

  |

In a lot of projects we are asked to produce different color versions of the same icon, sometimes this is to represent a different icon state or to provide the end user with interface skinning options. By creating Icon sets you can make working with color easier, faster and prepare your Illustrator document for simpler editing. Global… Read more »

Pixel Preview v2

Icon Design Tips: Multiple Windows And Pixel Preview Mode

  |

Despite the fact that most of my icons are drawn in vector editors, their output is almost always in a bitmap format. Use Pixel Preview mode to understand how Illustrator divides objects into pixels. In Adobe Illustrator you can open multiple windows of a single document at the same time. Each window can have different… Read more »

Slice Tools

Icon Design Tips: Exporting Slices

  |

When designing Icons I prefer to create a page with multiple icons displayed so I can see how the icons look together as a set. I find this very important and convenient when trying to ensure a consistent style across all the icons I am designing. For example, I have a file in Adobe Illustrator… Read more »

Title

Perspective and point of view in icons

  |

One of the most complicated things in 3D icon creation is selection and construction of right perspective. You are lucky, if specification for the development of an icon follows some style guide, which has a detailed description of required perspective and points of view. Mac OS X Human Interface Guidelines: Windows User Experience Interaction Guidelines (three-dimensional… Read more »

result

How to create the globe icon in Photoshop

  |

In this lesson I’ll tell how to draw an object that is very often used in icons. This object can easily either spoil or improve image, the thing is in details. I’ll use 256x256px icon size in the lesson, but all the rules below are valid for any size. Perhaps only for icons in size… Read more »

Custom Icon Design Tutorial

Step-by-step: How to Design a Custom Icon

  |

Designing a Button Style Custom Icon This tutorial will explain the process of designing and creating an icon from one of my favourite sets of custom icons. This dark, metallic and slightly glossy set was produced for a ‘button-type’ custom icon design to be used in a PDA driven software application. The icons all feature… Read more »

adobe logos

Why Fireworks Rocks for Rendering Crisp Icons

  |

As an Icon Designer I am a big fan of Adobe Fireworks, which doesn’t get the kudos of its more popular siblings such as Photoshop and Illustrator but there are some things it does far better and most revolve around its excellent handling of the PNG file format. What is so great about PNG? The… Read more »

Contact our Icon Design team

Ask Adam a question or tell us about your icon design project

Telephone: +44 (0) 7801292181
Email: adam@creativefreedom.co.uk
Whatsapp: WhatsApp Adam

Please enable JavaScript in your browser to complete this form.
Click or drag a file to this area to upload.
Contact Creative Freedom to talk about Icon Design