Order of items in a context menu

Question

Are there any styleguides, recommendations, best practices how to order items within a context menu? They question is about classic context menus, but I'm also interested in stuff about radial or more experimental approaches.

Basically what I've found in the Windows (and apple) guidelines:

Use a separator between groups of commands in a context menu to:

• Distinguish groups of related commands.
• Group together sets of commands.
• Divide a predictable set of commands, such as clipboard commands (Cut / Copy / Paste), from app-specific or view-specific commands.

Answer 1

Google's guidelines explicitly mention something about the order of the items in a menu:

Menus with static content should have the most frequently used menu items placed at the top of the menu.

Menus with dynamic content may have other behavior, such as placing previously used fonts at the top of the menu. The order can change based on user actions.

And that seems to make sense for most cases. Within a specific item group, ordering should be intuitive as well. Some items have their own logical ordering (XS - S - M - L - XL); for others you might just want to use alphabetical ordering (apple - banana - cherry).

Conventions

While the first few items usually consist of the most important ones, the last item in the list is special as well. It is very easy to find the last item in a list.

A few examples that typically go last:

• Log out
• Save as..
• About / info / properties
• Preferences
• More...

Steps

1. Choose what to include. Which items are really needed? Do all of your users need them? Are there alternative ways available to access the same functions?

2. Group. Group similar items together. (You could even use card sorting here to arrive at a good structure.)

3. Aim for efficiency. Most important / most used items at the top. Esoteric functions at the bottom (or better yet: not at all). This does not have to be the same solution for everyone - consider if it makes sense to put the most recently used commands at the top.

4. Test and adjust. Observing real people working with the menu will give you a lot of insight on what works and what does not.

Answer 2

The guidelines you have found are a good start. While I'm not aware of any other basic guidelines, these might be good ideas to consider:

• Put most frequent items at the top. These will be closest to the mouse and first to be read.
• Put more specific or variation commands under the command they are similar to. For instance, "Edit as hex" and "Edit with interface builder" might be directly under "Edit".
• If an "Information" button is included, put it at the bottom. Both Windows and OS X have some version of this, and both place it at the bottom of the menu.
• Don't include too many items. Many of the options on a Windows context menu are rarely used by most users. If there are options that would be less used, but then under a "More commands"item or other menu.

Answer 3

I wouldn't use radial if it's a desktop app. When you have to select a button/action, you have to move your mouse. With the radial approach is more difficult to move it in two direction.

I prefer context menus with one direction, even on mobile devices. Your eyes is also a cursor, it's easier looking at a list.

I think the grouped list is the best approach. Put important things near to the starting point. Like on the example: if you click on the item, your cursor is on the item, the context menu will open below it. The first important action is to play it or add it to a playlist, near to the current cursor position.

But you mentioned ordering, in this case drag 'n drop a helpful solution, because the user can add and order at the same time