Following Deskbar redesign proposal is based on discussion in the 3D-Accelerated Haiku Desktop RFC comment thread. One problem that came up was that current menu designs do not support good organization.
Only ways to organize a cascading menu (or variant like Deskbar and Windows start menu) is to use subcategories and separator lines. One good thing about subcategories is that you have a short description (i.e., folder name) attached to the group of items in the category, but those items are hidden most of the time and inefficient to use. Using separator lines for grouping does not affect efficiency, but does very little to aid usability. They have no describing properties and they do not visually connect items between them.
My proposal for Deskbar design that attempts to support both good organization and efficient use, is essentially a new way to visualize subcategories.
The image is from an interactive prototype I made to test this idea. The prototype requires an SVG capable browser (up-to-date versions of Firefox, Safari and Opera work). Please note that the categories and applications shown are just for illustrating functionality and not a proposal for default Deskbar organization.
If your browser supports SVG, please explore the prototype a bit before reading further.
Explanation of the proposed menu visualization and behavior
- Instead of having to click category name to show its content, we have the content listed below the category name. For example, “Browsers” catagory in the image above.
- Often everything in a category is not equally important. To solve this, we add ability to limit which items of the category are shown below its name. A complete list of items can then be accessed by clicking the category name. For example, complete content of “Internet” category, show in the image above.
- Finally, since categories can include subcategories, any item in a lower category can be shown below the name of the higher level. For example, “Firefox” and “BitTorrent” are shown below “Internet” category name in the image above.
To the best of my knowledge, exactly this type of menu has not been used anywhere. It is a combination of cascading menu and index menu that hopefully has the best qualities of both. Names and icons of items are equally well presented. Items are arranged to vertical list, which are easy to skim trough. Grouping of items should be visually obvious. Etc. There is some research results about efficiency and user preferences to vertically arranged cascading menus and index menus here
Visual appearance of this prototype is close to my idea of how this could be done, but contains some rough spots. E.g., how to visualize case where some applications do not belong to any subcategory (see “Productivity”category in the prototype).
Prior art of grouping, showing and hiding menu items
The idea of not always showing complete content of a menu has been used before by Microsoft, but their way was to “intelligently” hide items. There is also a feature in Windows XP start menu that tries to “intelligently” put often used applications to the beginning of the menu. Both of these “intelligent” features are essentially usability bloopers because they implicitly chance the interface. Although my proposal has some similarity to these, I believe it would work, because there would not be any “intelligence”. All decisions to show prominently or hide to sub level would be done explicitly by the user or have default setting that the user can chance.
OS X system preferences has some similarity to my proposal. There is grouping, but it is not visually clear in my opinion. Plus, horizontally arranged large icons with small text may look good but are not easy to skim trough, and place too much importance to the icon.
Blender's button groups interface is a clear source of visualization ideas in my proposal.
Comments?
All comments welcome. Is it appealing or an eyesore? Does it violate known usability principles? If you tried the prototype before reading the explanation, was it hard or easy to figure out how it works?