The Advent of Confusing Icons

Icons: the metaphorical stand of affordance. 

The usage of an icon spans from functionality to brand image of service on your screen.

Recognize these icons:

I hope you got it right. They are the guiding light to engagement and the synonym to a service. Now, the problem is when you tweak an icon for a more refreshed look.

Our brain very easily fixates onto an image model and isn’t very flexible to quickly adapt.

So, while we refresh an icon, some points worth considering would be:

  1. The core architecture of the icon or shape should remain the same.
  2. The metaphorical semantics of the action or service should remain intact.
  3. Be distinctive.

It doesn’t sound like a challenge. Phweff, Shape, size, and meaning. Piece a cake. 

Well, hold your horses. When I say be distinctive, I meant – the color palette of an icon.

As I was saying earlier, our brain gets quickly attached to things.

And, we lay on pattren matchnig instnicts to recongize smoething.

See what I did there 😉. You still read it.

This same psychology is applicable in the case of icon design.

When we design, there should be a fundamental relation to the color and shape that crafts it.

The puzzle of recent times is that applications have grown exponentially, and an app icon has transformed into just a doorway of access. 

Now, imagine having very similar doorways where you have to pinpoint the difference to get it right? This case is significant when several app icons are close to each other.

Various shades of blue color have turned out to be the favorite pick of brands (or they just copy competitor brands) when it comes to filling in the app icon shape. And, those apps that don’t fill in a unique color will be provided with a white background to maintain consistency (Android design guidelines).

In the real world, I have tapped the Trucaller app instead of To-Do or Maps (recent update) instead of Google Fit. Several times!

See what I mean.

A friend of mine had a problem tapping the messaging app of OnePlus instead of Hangouts. And yes, unfortunately, they were under the category folder – Messaging.

I would argue, Google screwed it up all the more, recently. Yeah, I get it, they released Material Design 2.0 a while ago, and they might have been directing on a unified image for their app icons.

Frankly, it has been a nightmare so far, and they aren’t done with the entire icons yet. The color palette resembles the color (of Google brand), and at times overpowers the shape in the icon.

The former design palette was distinct for each service they provided. It was easily recognizable. 

Sigh! Can’t imagine how they will undo Gmail now. 

However, I’m glad one company among the BIG FIVE, who again arguably is lesser-known in the design front, thought this through when they were refreshing their Office icon pack.

New Microsoft Office Icon Pack.

Source: Verge.com

Isn’t it quite a refresh. 

There is a distinction in it. There is grace in the shapes and palette of choice. Moreover, it stands true to being recognizable and meaningful.

This article was in-fact a shout out to voice a simple frustration that I’ve been encountering for a while. Thanks to user-testing, I wasn’t alone on the boat.

Though this wasn’t a Microsoft endorsement, a genuine appreciation was thought necessary for a company that is fortifying its stand in this small detail termed icon design. Because sometimes even a bland icon design can be an itch in user experience. And, I can’t rephrase any more on how distinction is key in quickly tapping an application.