1
edit
Changes
no edit summary
Ken (Expandable menus and submenus of Office < 2007)
== Drafts ==
<u>'''Kiu Kwan Leung'''</u>
The Ribbon User Interface – A study of Microsoft’s effort to comply HCI Principles
The Ribbon user interface marked one of the most well-known examples of user interface shifting. In this section, the team will first disscuss the common HCI and graphical user interface design principles and willl explain how did different versions of Microsoft Word, version 2003, 2007 and 2010, follow/violate the principles..
NOTE: To simplify the complexity of our research, the team will focus on the default setting of the Word user interface in this section.
Common HCI and Graphical User Interface Design Principles
Throughout the research process, the team had been able to apply a list of HCI and graphical user interface design principles to explain Microsoft’s action taken in each version of Word. These principles are:
Principle of Consistency
Principle of Familiarity
Applications should customizable to meet users’ unique needs.
[REFERENCE NUMBER, https://www-01.ibm.com/software/ucd/designconcepts/designbasics.html]
Principle of Feature Exposure
Features of a program should be easily exposed. This allows users to determine the function of the feature by quick visual scanning. [REFERENCE NUMBER, http://www.sylvantech.com/~talin/projects/ui_design.html]
Principle of Flexibility
Principle of Minimizing Access Cost
When the user’s attention is diverted from one location to another to access his/her desired information/feature, there is an associated cost in time or effort. User interfaces should be designed to minimize is cost.
[REFERENCE NUMBER, http://www.google.ca/url?sa=t&rct=j&q=steering%20law%20sub%20menu&source=web&cd=2&ved=0CCMQFjAB&url=http%3A%2F%2Fciteseerx.ist.psu.edu%2Fviewdoc%2Fdownload%3Fdoi%3D10.1.1.118.7601%26rep%3Drep1%26type%3Dpdf&ei=0iq7To-uFaXZ0QHx5eDeCQ&usg=AFQjCNHrOOm9nR54M4rbGAuFJ8fq1CteiA&cad=rja]
Principle of Navigation
Steering Law
The Steering Law is a derived 2D model of the Fitt’s law, which can be used to approximate the average time taken for humans to perform mouse navigation. Assuming the actor is moving a mouse in a straight path, the formula of the model will take the following form:
T = a + b (A/W)
Where T is the average time for the action; a and b are experimentally fitted constants; A is the total length of the path and W is the width of the path.
Principle of Top-down Processing
Signals are likely perceived and interpreted in accordance with what is expected based on a user’s past experience. User interfaces should be designed in a way that will meet common users’ expectation.
[REFERENCE NUMBER, http://www.google.ca/url?sa=t&rct=j&q=steering%20law%20sub%20menu&source=web&cd=2&ved=0CCMQFjAB&url=http%3A%2F%2Fciteseerx.ist.psu.edu%2Fviewdoc%2Fdownload%3Fdoi%3D10.1.1.118.7601%26rep%3Drep1%26type%3Dpdf&ei=0iq7To-uFaXZ0QHx5eDeCQ&usg=AFQjCNHrOOm9nR54M4rbGAuFJ8fq1CteiA&cad=rja]
Word 2003
Since its first version for Windows, Word for Windows 1.0, Word had been using the WIMP (windows, icons, menus, pointing device) design. After fourteen years of time (1989 to 2003), Word had grown into a very complex word processor with a long list of features. To handle such a rich feature base, Word’s WIMP user interface had developed sophisticated techniques such as adaptable menus, submenus and sub-submenus to reduce the amount of information presented to its user.
Adaptable menus
Adaptable menus can reduce the amount of information displayed to the user by hiding less frequently used menu items. When menu item/s is/are being hidden, an extra ‘﹀’ button will appear as the last item of the menu. By clicking or placing the mouse on the ‘﹀’ button for two seconds, the menu will expand to display all the menu items available.
Although this approach helps simplifying the menu, it violates the Principle of Feature Exposure and the Principle of Minimizing Access Cost. Fundamentally, this feature was design to hide instead of expose the features and hence, violation of the first principle is inevitable. In case of access cost, the action of expanding the menu requires extra mouse click or time hovering on the ‘﹀’ button. And as the menu expands, users will also need extra time to look at the menu and learn what else has been made available to him/her.
Submenus and sub-submenus
Submenus and sub-submenus are ways to shorten a menu by categorizing related menu items together to form a submenu and place the category name as a menu item at the parent menu with an extra ‘▶’ at the end of the category name. By clicking the menu item or hovering onto the menu item for one second, the submenu/sub-submenu will appear. As submenus and sub-submenus are designed to hide information, they violate the Principle of Minimizing Access Cost and Principle of Feature Exposure in the same way as adaptable menus.
Other than feature exposure and access cost, submenus and sub-submenus also violates Principle of Consistency and yield low selection time performance. Due to the fact that a menu can have zero to many submenus/sub-submenus, it is impossible for one to find any two menus that shares the same structure. Therefore, users must spend time and effort to remember the organization of each of the menus. Finally, regarding selection time, [REFERENCE NUMBER, http://www.google.ca/url?sa=t&rct=j&q=steering%20law%20sub%20menu&source=web&cd=2&ved=0CCMQFjAB&url=http%3A%2F%2Fciteseerx.ist.psu.edu%2Fviewdoc%2Fdownload%3Fdoi%3D10.1.1.118.7601%26rep%3Drep1%26type%3Dpdf&ei=0iq7To-uFaXZ0QHx5eDeCQ&usg=AFQjCNHrOOm9nR54M4rbGAuFJ8fq1CteiA&cad=rja] indicates that general mouse users would require two seconds to access any menu item on a sub menu and three seconds to access any menu item on a sub-submenu. And as a reference point, [REFERENCE NUMBER] also mentioned that it takes an average of one second for selecting any first level menu item.
Word 2007
Secondly, the team looked at Word 2007, which marks the initial release of the Ribbon UI. In this version, Microsoft Word received a major user interface redesign with the introduction of the Ribbon UI, the Office button, the Office menu and mega-menus.
The tabbed Ribbon UI / The elimination of sub-submenus
The major departure of Word’s classic WIMP user interface is the introduction of the Ribbon UI. The Ribbon UI is a tabbed menu aimed at easing user navigation by eliminating most of the expendable menus, submenus and sub-submenus found in the classic Word user interface. The goal was successfully achieved by moving all menu items found in the classic menu bar to Ribbon as buttons with icons and converting all the sub-submenus to pop-up menus activated by clicking the Ribbon buttons.
However, by introducing the Ribbon UI, Microsoft had failed to obey the Principle of Familiarity. According to [REFERENCE NUMBER, http://www.useit.com/alertbox/familiar-design.html], users are interested in completing their task with skilled performance (as fast as the user can finish the task, based on his/her familiarity of the user interface) without spending extra time to analyze a new user interface. In this regard, the team did a small research into the user acceptance and the average Office productivity of the Ribbon UI. According to [REFERENCE NUMBER, http://www.wseas.us/e-library/conferences/2010/Faro/DNCOCO/DNCOCO-25.pdf], users with longer word processing experience share the feeling that the Ribbon UI is not well organized and are less satisfied with it. And [REFERENCE NUMBER, http://www.exceluser.com/explore/surveys/ribbon/ribbon-survey-results.htm], pointed out that on average, users experience a twenty percent productivity drop after using the Ribbon UI. This outcome can be explained by using the Principle of Familiarity - the Ribbon UI destroyed experienced user’s skilled performance by introducing uncertainty and extra time spent on analyzing and learning the new user interface.
The Office button and Office menu
In Word 2007, a new Office button is added to the top left corner of the window. The Office button is a large, circular button with the Office Logo icon to replace the classic File menu. Clicking on the button will lead to the Office menu containing all file operations such as new, open, save, save as and print to appear.
By studying the design of the Office button, the team believes that Microsoft had failed to obey four of the user interface design principles: Principle of Familiarity, Principle of Top-down Processing, Principle of Navigation and Principle of Minimizing Accessing Cost. As the Office logo provides no hint that it is meant for file operations, users cannot apply any expectation nor user interface knowledge to determine the meaning of the Office button. Therefore, one can conclude that the Office button is simply an unfamiliar and meaningless button with very low usability.
NOTE: The Office button’s violation of Principle of Navigation and Principle of Minimizing Accessing Cost will be discussed in the Word 2010 subsection.
Use of mega-menus
Another Ribbon’s achievements to ease navigation are the use of mega menu to allow all shapes to be easily selected and inserted by the user in the insert tab. According to [REFERENCE NUMBER, http://www.useit.com/alertbox/mega-dropdown-menus.html]’s list of characteristics, the insert shape has the following characteristics:
In compliance of the Principle of Top-down Processing, the insert shape menu is a big and two-dimensional pop-up menu with its shape divided into labeled categories. This format allows users to search for their desired shapes easier by scanning only the desired category to narrow down their search.
To follow the Principle of Consistency, all menu categories and items are structured and follow the same layout.
Obeying the Principle of Feature Exposure and Principle of Minimizing Access Cost, all shapes are visible and hence users can see all of them without scrolling.
Word 2010
Finally, the team studied the user interface of Word 2010. The Ribbon UI featured in Word 2010 can be considered a slightly improved version of the original. Noticeable enhancements include a new minimize/maximize Ribbon UI menu button, the elimination of the Office button and a new File tab.
Minimize/Maximize Ribbon UI menu button
Since the introduction of the Ribbon UI, Microsoft had built in a Ribbon minimize/maximize function. This function offers the user a choice to hide/expose the Ribbon and, by reducing the screen area occupied by the ribbon, reduces the occasion of scrolling (move the uses hand to the scroll wheel and back to the keyboard). Hence, the act can be considered an effort to comply the Principle of Flexibility and Principle of Minimizing Access Cost.
However, the problem of the function is that it can only be activated by doubling clicking the active tab, the keyboard combination Ctrl+F1 or the Ribbon’s right click menu [REFERENCE NUMBER, http://blogs.technet.com/b/office2010/archive/2009/12/03/minimizing-the-ribbon-exposed.aspx]. The above listed ways of accessing the function are not obvious and requires extra effort to access, yielding a very low usability and even introduce errors by accidentally activating it. This is supported by the large amount of threads on Microsoft’s support forum indicating users are having difficulty accessing it or accidentally activated it [REFERENCE NUMBERS, http://answers.microsoft.com/en-us/office/forum/office_2007-word/ribbon-disappeared/c6f0418b-8a12-46b3-af1b-35d260b82978
, http://answers.microsoft.com/en-us/office/forum/office_2007-outlook/how-do-i-restore-the-ribbon/e0a1f0a8-d94a-e011-8dfc-68b599b31bf5
,
http://answers.microsoft.com/en-us/office/forum/office_2007-word/default-ribbon-on-word-2007-has-disappeared/1677de51-fc69-e011-8dfc-68b599b31bf5
, http://answers.microsoft.com/en-us/office/forum/office_2007-access/how-to-minimize-ribbon-on-access-application-when/e128cfe7-c0c6-4b75-a80c-09ba13880629]. Therefore, it is logical to conclude that the function has a very low usability.
To improve the situation, Microsoft provided a minimize/maximize Ribbon button in Word 2010. Locating at the top right corner of the Ribbon and using the ‘︿’ and ‘﹀’characters as its icon for minimize and maximize respectively, the button obeys the Principle of Top-down Processing where users can apply their common knowledge of graphical user interface and expect that button to hide/expose the Ribbon.
Elimination of the Office button / The File Tab and File Screen
In Word 2007, the Office button was the equivalent of Word 2003’s File menu. By clicking the Office button, a pop-up menu (the Office Menu) with common file menu operations such as Save as and Print will appear. As mentioned previously, the Office button provides no evidence that it is meant for file operations. In addition, the Office Menu also inherited Word 2003’s submenus including Permission and Send To, which are considered violation of the principle of navigation and principle of minimized accessing cost.
To address the issue, Microsoft replaced the Office button/menu with the File Tab. Obeying the Principle of Familiarity, the File Tab button is located at the leftmost corner of the Ribbon to resemble the location of the classic File menu. Clicking on the File Tab button will cause the entire editing area of Word 2010 to be replaced by a file screen with left and right section. The left section of the file screen is used to store most of the menu items of the Office button. Instead of animating the “fade in” of the submenu, clicking a submenu will cause the right section of the file screen to show the submenu items of that submenu.
Without the size limit of a submenu, the height of the submenu item had been increased from 6 millimeters to about 1.5 centimeters while the distance between the main menu item and the submenu item remains unchanged. According to the Steering Law, this height increase is equivalent to an increase in the W variable of the law (width of the travelling path). This renders a large reduction of the b(A/W)term and hence easing the navigation by reducing the average time of selecting the submenu item (the cost of accessing the submenu item). In addition, the elimination of the “fade in” animation is also an effort to better comply the Principle of Minimizing Access Cost – instead of paying attention with the animation, the user can better focus on his/her task and hence reducing the time and mental effort spent on handling the context switching.
Recap of the Ribbon UI Research
In order to find out the reason behind the Ribbon user interface, the team studied three different versions of Microsoft Word (2003, 2007 and 2010) as well as the HCI and graphical user interface design principles Microsoft had succeed/failed to follow. Result of the research suggested that the act of dropping the classic Word user interface, Microsoft had sacrificed the flexibility of adaptable menus and submenus and the familiarity of the classic user interface design. However, by introducing the Ribbon user interface (the Ribbon UI), Microsoft had successfully achieved ease of navigation; reduced information/tools access cost of the adaptable menus and a consistent yet predictable tabbed user interface.