9

Is there any research done on whether the direction an icon faces matters in the recognition of the icon representation? In other words and with a specific case:

Would a left oriented search icon (one with the glass of the search icon in the left top corner) be more recognizable and clicked on then a right oriented search icon, or vice versa?

enter image description here

  • 5
    I would use it to face the text. For example if i use the search icon in the right side of an input field(so the text goes on the left side obviously), i would use the first icon from your list. – passatgt Jul 11 '15 at 12:21
  • If you're right-handed then right oriented search icon is better for you! – Milad Jul 11 '15 at 15:33
  • Why is that the case? – Joop Jul 11 '15 at 15:35
  • Why?! I just tried it. and I realized that I don't feel good about a (you called it) left oriented search icon. Right oriented search icon is better because it's like it's ready for me. – Milad Jul 11 '15 at 15:40
  • I don't know if there's an study about this. Besides, it looks like this subject applies basically to the search icon. This being said, I always use @passatgt approach, it's a natural thing, so guess there must be some cognitive connections that apply to this matter – Devin Jul 11 '15 at 16:17
7

To answer your question: Is there any research: Not exactly. I am aware of research by NNGroup about the layout and presentation of search boxes with their labels and icons. Nothing about which way the icon is leaning.

But may I say I think it's very insightful of you to ask this question.

Images CAN have direction. That is, images can "point". This can be explicit, as with an arrow, or implicit, as with the direction in which eyes are looking or the direction in which a face is turned.

A picture of a magnifying glass definitely has direction, much like an arrow. The round glass is like an arrowhead, and the handle is like an arrow's tail. Together, they point left or right.

There's a nice little free e-book by Spencer Goldade (a former colleague, we have both since gone to work elsewhere). You can download the e-book here and then check out chapter 4. It's a light read, not an in-depth discussion.

enter image description here

Hope that helps, if only to confirm that your instinct is right: the direction of the magnifying glass does matter. Descending, now, purely into opinion: when the icon is outside the right side of the Search box I lean the icon in, toward the box, suggesting to use the box. When the icon is inside the box, I right-align it and lean it out, suggesting the action that is to come. Remember, this is just my opinion. That, plus $2, will buy you a cup of coffee.

More importantly is NN/g's advice to include the word "Search" along with the icon, because "icon-only search has some significant disadvantages" when the search box is in a non-standard location.

enter image description here

By the way, there are other factors at play, as well. In the examples you posted, none of the magnifying glasses are "upside down." They are all oriented as if ready for the user to reach out and grab the handle. Ask yourself: if direction didn't matter, then wouldn't at least SOME of these images be "upside down"?

  • 1
    +1 this is a well substantiated and well reasoned answer – tohster Jul 12 '15 at 1:17
  • 1
    I may have missed it, but does that NNG research actually talk about the direction the icon is facing? Also, I think the last question is interesting...but would argue that direction doesn't matter. But if an icon is upside down, that certainly can. (ie, "direction" and "upside down" are different enough issues in this context as to be distinct). – DA01 Jul 12 '15 at 1:22
  • LOL. I think that's a big "Whoops" on my part. NN/g talks about the use of the icon, but not the direction. The rest is my opinion. I'll amend the opening paragraph of my answer, above. – JeromeR Jul 12 '15 at 22:22
3

The magnifying glass is a skeuemorphic icon.

Classic skeuemorphic design principles suggest a right handed orientation will feel more natural to users because most people are right handed and would pick up the glass that way:

glass

But...

The magnifying glass is so widely used it really doesn't matter that much in practice, and users are not more or less likely to understand the meaning between one orientation and the other.

  • 2
    I know this is a common point of contention, but that's not really what skeuemorphic means in this context. It's a literal icon, as most are, but there's no actual interacting with the magnifying glass in the UI as you would in real life. A skeuemorph is something that is intended to be interacted with in a way akin to how you'd interact with it in the real world (eg, a virtual button is 'pushed' just like a physical button.) – DA01 Jul 11 '15 at 18:25
  • Fair point, I think that's right DA01. Surface mimicry is probably more accurate that skeuemorphism with respect to the interaction design. – tohster Jul 11 '15 at 18:30
  • 2
    Are we splitting hairs? ;) If so, let me suggest a third meaning. Skeuomorphism refers to a derivative object that retains ornamental design cues from structures that were necessary in the original, says Wikipedia. Since picking up a magnifying glass with either the right or left hand isn't "necessary" to its functioning, there's no skeuomorphism in the direction of the icon. Similarly, skeuomorphism isn't about the how an icon (or button or other control) borrows visual details from a physical object to signal its function. Isn't that called affordance? OMG I'm a nerd. – JeromeR Jul 11 '15 at 23:06
  • 1
    @JeromeR I actually like the composition of that definition... "necessary structures" is not something I'd come across before but it does a nice job distilling broad based mimicry into functional essence, which is an important part of the design process – tohster Jul 11 '15 at 23:10
  • 1
    All credit to Wikipedia, though. – JeromeR Jul 11 '15 at 23:22
0

If you look a the 100 or so magnifying glass icons you have in your question (which is a fun collection) you'll notice that the key is that they are all fairly consistent representations of a magnifying glass...essentially a circle with a stem sticking out.

I don't have research on this, but I bet if you randomly chose 100 people and showed half the icon facing one way, and half the icon facing the other way, you wouldn't see any statistical significance in terms of being able to identify. The point is that it's an identifiable icon, and it's orientation doesn't appear to change what it is meant to represent. A magnifying glass icon still looks like a magnifying glass regardless of which way it leans.

As such, I'd argue this is purely a visual design decision that should be made based on what looks best for your particular needs.

Visually, it's sometimes nice to have the icon 'lean in' to the text. Perhaps if the icon is to the left of your field, it leans right. Perhaps if it is after, it leans left. That's but just one thing to consider.

  • Your point about having the image "lean in" caused me to post my own answer, which expands on that a bit. Thanks. :) You also hypothesize that the direction of the image won't affect recognition of the symbol. It would be interesting to test this; I think it would be shown to be true. – JeromeR Jul 11 '15 at 22:59

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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