On the surface, designing an icon seems simple compared to designing an entire website. But there is a lot of complexity involved with icon design. Because your design comprises of a small block of design, you have to make sure that all the elements are perfect. It has to have more than great design. It also has to communicate what the product behind the icon represents. If you’re trying to learn icon design, here are seven tips that you can use to accelerate your progress.
1. Stick to the Project’s Core Identity
Whether you’re designing a logo for a brand or an icon for an app, there’s going to be a central theme behind the project. Do your research into the theme and study other designs based on it. This will provide some source material to base your initial ideas on. After establishing the theme, you want to develop the identity of the icon. If the icon design is for a cloud hosting service, you can start by using a cloud (theme) and integrating technology symbols (identity) designs into it. If the icon is for a WordPress hosting service, you can use the letters WP (identity) and build server graphics on top of or around it (theme).
2. Focus on the Fundamentals – The Color and the Shape
When it comes down to it, the most important elements of an icon are its color and shape. Try to play around with different shapes to come up with a presentation that works with your idea. You may want to start out with a flat design approach to keep things simple and focus on the shapes rather than the textures. Mix and match different colors to see which combinations work best for the icon. Try to play around with colors that create contrast to make the icon pop. Don’t be afraid of using colors that normally don’t go together.
3. Keep a Stable Light Source
You may be tempted to play around with the lighting to add more depth to your icon but this may backfire on you. Creating an icon that has multiple sources of light pointing to it gives it too much of a glossy look. This look will contribute to the identity of the logo, making future iterations that remove the lighting too drastic of a transformation. Using multiple light sources also takes the focus away from the actual icon design. You want the hero of your design to be the icon, not all the effects around it.
4. Differentiate from the Masses
(Disclaimer: This is just an example on how to differentiate designs as WordPress and other brands have regulations on how their logo can be used.)
One of the biggest challenges of designing a logo is trying to design around the fact that there will be many other logos similar to your design. It’s not enough to design a logo based on a defined theme and strong identity. This is where you want to do things like add effects, accents, lighting and styles. For example, let’s go back to the WordPress hosting example. After your initial rough draft, what if you took the icon and a WordPress icon and added striped cutaways to represent data transfer? What if you took that icon and turned it into a die cut design? These two design accents would help your icon stand out from others based on the same theme and identity.
5. Learn to Design with Typography
Many icons are entirely based on typography. If you don’t want to limit your creativity, you should start looking at typographic designs for inspiration. A great way to get initial ideas is to browse the Google font database. This can be followed by studying typographic-driven logo designs. Then you want to look for icons that combine typography with graphic design. Some good examples of icons that use typography are Uber, Malware Bytes, Pinterest and Paypal. Once you start looking at a wide range of icon designs, you’ll start getting some solid ideas on how to use typography.
6. Redesign to be Aesthetically Pleasing and Recognizable
An aesthetically pleasing icon helps with user engagement, so you want to make sure that your design is friendly to the eyes. To make your icon more aesthetically pleasing, make sure your shapes are in unity. Create balance by using more negative space and try resizing the various elements of the icon. It always helps to use a grid and start out with simple shapes. Your icon also needs to be recognizable. In order for the design to be recognizable, get to the point with your icon. Use designs that communicate the purpose of the icon. Don’t use abstract designs as they often miss the mark.
7. Remember that Less Is More
A common thing that happens with designers that are new to icon design is that they do too much with the design. They build a strong theme and identity but end up adding too many accents, too many details and too many stylistic elements. The final result may look pretty but it will simply look too busy. You have to remember that the icon design needs to impress the user as much as it needs to be visually pleasing. So when you think you’ve finished your icon design, take a step back and see if you can do less without making the design look generic.
These tips should help you accelerate the learning process of icon design. Icon design comes down to the fundamentals more than any other type of design. Unlike other designs, you often have to start from scratch if an idea doesn’t pan out. That’s why it’s important to build on the elements that work and take note of what doesn’t work. You’ll eventually find yourself in the middle and end up creating a visually pleasing and well-balanced icon.