Let’s fix the “user” icon

If you’re a designer or developer you probably are familiar with the hard work of choosing icons to represent concepts in your app.

Certain icons are obvious and easy choices, like a “+” sign for adding things.

Other icons, not so much.

One of these is an icon that many apps — especially business apps — use. It’s the representation for the concept of a “user”.

The usual suspect is a silhouette or two of a middle-aged short-haired man. Now, of course not everyone looks like this. In fact, if you look at the whole of humankind it’s just a tiny minority. As an icon, which should represent “the whole” and not just some small sample of it, it’s simply just lazy design (it’s likely that the designer of this icon was a middle-aged short-haired man).

If you don’t want a person silhouette, a popular choice is featureless aliens, or game pieces.

In How We Changed the Facebook Friend Icon, Caitlin Winner writes, “It didn’t seem fair, let alone accurate, that all friend requests should be represented by a man, so I drew a silhouette for cases where a gendered icon was inappropriate.”

It’s a good step in the right direction — however, now all your friends are shaped mysteriously like a bunch of 20-Somethings from San Francisco.

Amy Hoy and I are hereby suggesting an alternative. A radical step — let’s not try to represent a human being at all.

We want to represent the “user” concept, aka the living being interacting with your software.

We want it to not cause cultural headaches or misrepresentation, and we want it to be fun and cheerful.

To be perfectly honest with you, we’re not dog people, so instead of using a dog face, we’ll use the most popular pet in the world, a pet that’s cross-cultural and loved by (almost) everyone.

Yes, it’s a cat

Think about it, it’s not weirder than using a floppy disk to indicate “save”.

For your convenience, we’ve desgined a ready-to-use icon, and it’s licensed under the MIT license. You can use it for all your projects, commercial or not.

We call this icon the purrson-icon.

To grab a copy, please visit the GitHub repository at https://github.com/madrobby/purrson-icon

How we’re using it

Right now, we’re using this icon in two different places. Here it is in our time tracking app Noko:

We’re also using a very similar icon on Amy’s landing page for 30x500 Academy:

Let us know if you use it in your app! :)

Amy Hoy and Thomas Fuchs

Do you want to be more productive, earn more with less work and have time for all those fun side projects? This story and more first appeared on the Noko Time Tracking Productivity blog. Head on over!

I make and run web apps: pep.cards and nokotime.com. I made Zepto.js and script.aculo.us. Started web dev in '94.

I make and run web apps: pep.cards and nokotime.com. I made Zepto.js and script.aculo.us. Started web dev in '94.