9

As of Ice Cream Sandwich, the new standard icon for menus is three vertically aligned squares as such:

ICS menu icon example

Before that, the menu expansion was three horizontal lines like this, but without the triangle:

enter image description here

Annoyingly enough, that icon (again, without the triangle) looks a lot like a list. In fact it looks so much like it that I have a hard time picking something else to signify a list view of something.

Even Google's own Roman Nurik has used that icon for a list (pre-ICS):

enter image description here

But yet it's not consistent or clear that it is not the menu icon. I have gotten feedback from multiple long-time Android users that the list view looks like a menu icon to them. Even worse, Facebook still uses the list to mean menu:

enter image description here

And Chrome on OS X uses it to mean menu as well (Jelly Bean Android uses the three squares):

enter image description here

So my question is this:

What is the correct (according to Google) and consistent icon to indicate a list view as of the latest Google OS?

Is confusion from users to be expected and should we just deal with it until pre-ICS users die off and everyone is on board with the new icon set?

5
  • 4
    I don't know the answer, but could it be 'overflow menu' is a different icon than 'menu' itself? The overflow appears to be vertical elipses (as silly as that may sound...)
    – DA01
    Dec 20, 2012 at 1:46
  • @DA01 What do you mean?
    – yarian
    Dec 20, 2012 at 2:04
  • 1
    I mean it seems that they are two different things. "Menu overflow" and "Menu". So maybe it makes sense to have them different. Just my interpretation.
    – DA01
    Dec 20, 2012 at 2:12
  • 1
    The overflow icon represents "action overflow" and is very different from the concept of a menu. It represents additional actions that are either off-screen intentionally or due to lack of space. The point above about it representing a vertical ellipsis is spot on. Dec 20, 2012 at 16:42
  • 1
    @RomanNurik and DA01 : Ah! Okay. I had no mental blueprint for an action overflow. It's not something I have consciously come across before. The distinction between that and menu makes sense now though.
    – yarian
    Dec 20, 2012 at 17:03

2 Answers 2

9

Google's Action Bar Icon Pack (link taken from this page) includes a special icon specifically for this purpose (the icon name is 4-collections-view-as-list.png):

Android View As List icon

The three-dots symbol you list is called ic_action_overflow.png (corroborating DA01's comment that the symbol means overflow—as in 'more…'—not necessarily menu).

Android's convention for menus is the arrow you mentioned in the question, and apps are really taking to the sort of thing your Facebook example uses. In fact Google have added the same exact control to its mobile website:

Google's mobile website demonstrating the menu icon
Image from Search Engine Roundtable

There's a StackOverflow question about those kinds of menus with some interesting examples too.

6

Consider using an icon like this one from GLYPHICONS:

enter image description here

It is likely that users would find it intuitive because we have been using unordered lists for so long.

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.