Apple and Google are going head-to-head to define meaning of the three-horizontal-bars icon: 
In iOS this icon means "drag me to rearrange items in a list" while Google Chrome's version means "click me to bring up a menu".
Is one of these two meanings already widely established in mobile, web, or desktop software? Also, which popular apps (on any platform) use this icon and what does it mean in those apps?
I'm asking because we're building an app that has a "list re-order" feature (using the standard iOS icon of course!), but several iOS-familiar folks I talked with didn't recognize the re-order icon. This led me to wonder how popular either variant is. Even if an icon is iOS standard, if it's not used much and the other variant is very popular, then we'll have some user education challenges we want to prepare for.
Here's pictures from the newest Google Chrome:
From iOS design guidelines:
From a sample iOS app:
Answer
Three bar icons are now being used widely to indicate a "show list/menu" function - it's not just Chrome. Below are screenshots from Day One and PlaceMe (I only had to open a couple of apps to find examples of this usage).
I believe the icon was a poor choice by Apple (in hindsight) - it does not give a clear interaction cue, it's more of a reorderable state indicator. But, let's remember that Apple made this choice before all this app-madness happened.
On iOS, both uses may be able to co-exist without confusion - since use as a menu/list indicator would have a single icon and "reorderable state" would have an icon beside each list item.
A better choice may be to move toward something similar to the "draggable" icon to indicate reorder-ability and let the three bars be a "show list/menu" function cue - as it is gaining traction.
No comments:
Post a Comment