4

I've been recently implementing a custom icon-font & I decided to use those icons for Sign-in/sign-out:

enter image description here
enter image description here

My only real reason being that choice is that it seems to be a convention in all major icon font library & icon font database. A quick search for "login" or "logout" on http://fontello.com/ or http://thenounproject.com/ will show that they are most of the time use this way (with 1-2 exceptions).

My coworker (3 persons) on the other hand think that they should be inverted, because it feel wrong to them, and one of them bring up the similarity between login icon and a exit sign:

enter image description here enter image description here

My questions are

  1. How well those icons are accepted, used and understood by all users?
  2. What is the history of those icons? (where are they from?)
  3. Which icon is right for which action (login/logout) in your opinion?
  4. If you had a similar experience, what icon did you choose for sign-in/sign-out?
2
  • With the login/logout copy right on the icon, I doubt anyone is going to mistaken them for something else or even question the image next to the copy. You would have a problem if your design only included: "->] [->" and no copy. Mar 12, 2014 at 23:41
  • On my Android phone incoming calls point left and outgoing calls point right with the icons are on the left of the call log. Keeps confusing the heck out of me. The addition of the brackets makes it much clearer, regardless of which way the arrows point. The green "running people" icons are completely useless for me. It took me a long time to figure out that the left one must be exiting because the hind foot was indoors. The right one still has me wondering whether he's coming in or going out... Mar 13, 2014 at 18:45

1 Answer 1

2

Short answer

Don't use the green running man, use the set of icons with text, arrows and lines. Their meaning is more clear, even though the green running man is a common and understood sign

Long answer

The green exit sign has been used for many years now and is well recognized as intuitive and clear, even on countries that still use text signs predominantly. Obviously, the advantage is that the pictogram makes the idea clear "move fast through this hole/door to a safe place". You can read a bit more about how Yukio Ota's design was conceived in this wikipedia entry.

If you consider the meaning of the sign itself, using it as login/logout, it's a bit stretched since the only remaining part is the movement, but not the speed or emotional state associated. But, our brain is used to abstract and extrapolate ideas, so since we know that the green running man is going to cross the door, we can keep that part as a concept and use it, so you could use the icon with the text "login" and people would understand it, but I have my doubts if it's used as standalone icon with no text of input fields close to it.

The idea associated with the green running man, is exit, not entrance.

Your set of icons with arrow and text are clear to almost anybody; obviously not as clear to people that don't speak English, but still quite clear.

As an extra reference for the green running man, in this article on slate.com, you can read how there was also a very similar design from the Soviet Union. To be fair, I think that both designs convey the same idea with the same clarity, I wonder how much influence had the cold war on the decision, but that is just my curiosity.

Also, considering a common emergency exit, we see that it opens to the outside of the room we are in, so the common green running man, and your grey icon on the left, seem to use the same "push to do the action" idea.

emergency exit

About your grey icons, they are an evolution, or transformation of some icons that have been in use for some time now, which are the abstraction of the idea of crossing the door, but look like going "into" and "out" of a box.

This login icon http://icons.iconarchive.com/icons/visualpharm/icons8-metro-style/48/System-Login-icon.png and this logout icon http://icons.iconarchive.com/icons/visualpharm/icons8-metro-style/48/System-Logout-icon.png.

2
  • Thank you but I don't think you've read the question fully, I'm trying to understand why those icon confuse some and where they're from. I don't want to use the green man exit symbole, I just bring up the similarities between the sign and the login sign.
    – kirkas
    Mar 13, 2014 at 19:05
  • @kirkas: That's what the explanation is about, it tell you exactly where they come from, at least the green man. About the confusion, "The idea associated with the green running man, is exit, not entrance.". It's assumed that it represents exit. About the similarities, I mention that the grey one is a simplification of the last ones I posted, which are also a simplification of the green man exiting the door. They take the man out and leave the action, plus using a box where the arrow is superimposed, gives the idea of entering or exiting.
    – PatomaS
    Mar 14, 2014 at 0:11

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.