10/12/2020

I was chatting with my mom the other day about redesigning parts of her website. Which got my thinking about the use of icons and how picking something that doesn’t fit can be so distracting.

While most of us probably know this information like the back of our hand, I thought for other designers just starting out. This could be a useful reminder, or maybe even a first time hearing this helpful hint.

Just as typography is important with heigharchy, so is iconography with consistency. Now im not talking about keeping your icons consistant throughout your design. Because that should be common sense. Im referring to how icons need to be consistent to eachother.

Lets say you pick an icon that is bold in nature, like a magnifying glass with a transparent cross. But then your zoom out icon is a magnifying glass with a solid bar for the minus and a transparent lens. You might not think much of it at the moment, but it can be entirely distracting or even throw off your design consistency to a point that makes someone question the professionalism of the page or app.

So that might be a very simple example, but imagine picking 15 icons for your entire design. Making sure that they are either all bold and filled in, or all thin lines will complete a project to that extra detail that can be make or break for your client.

I remember one of my first professional projects, that I over looked this detail. It was so embarrassing to explain to the client why the profile icon wasn’t a filled icon, when the home icon was a solid house. She questioned the integrity of the entire project moving forward, and was an invaluable lesson that I wont forget.

Moral of the story, if you are paying attention to the important things like type and color. Dont make the silly mistake of small inconsistancies like a bad icon choice.

-until next time-