91.527 - Human Computer Interaction Mid-Term...
Transcript of 91.527 - Human Computer Interaction Mid-Term...
91.527 - Human Computer Interaction
Mid-Term Paper
Word User Interface Evolution
By
M. Michael Nourai
Mid-term Paper M. Michael Nourai
91.527 - Human Computer Interaction Page 2
Table of Contents 1. Abstract ................................................................................................................................................. 3
2. Introduction .......................................................................................................................................... 3
3. Microsoft Word 97-2003 ...................................................................................................................... 4
3.1 Overview ............................................................................................................................................. 4
3.2 Menu bar ............................................................................................................................................. 5
3.3 Office Assistant ................................................................................................................................... 6
4. Evolution of Word icons ........................................................................................................................ 7
5. Microsoft Word 2007 and 2010 ............................................................................................................ 8
5.1 Overview ............................................................................................................................................. 8
5.2 Ribbon Interface.................................................................................................................................. 9
5.3 Ribbon Interface Issues ..................................................................................................................... 10
5.3.1 Office Button is ambiguous ........................................................................................................ 10
5.3.2 Dialog box invoking icon is too small ......................................................................................... 11
5.4 Ribbon Interface Improvements ....................................................................................................... 12
5.4.1 New File Tab ............................................................................................................................... 12
5.4.2 Proposal for improving dialog box invoking icon ....................................................................... 13
6. Conclusion ........................................................................................................................................... 14
7. References .......................................................................................................................................... 14
Mid-term Paper M. Michael Nourai
91.527 - Human Computer Interaction Page 3
1. Abstract Microsoft has come a long way in improving user interaction with their Office applications. The
new ribbon menu and toolbar style was introduced and presented in Office 2007, and soon after
it showed up in other Microsoft applications. This paper describes the Microsoft Office Word
user interface evolution from earlier revisions to their latest revision.
2. Introduction Today, almost everybody in the developed world interacts with personal computers in some form
or another. We use them at home and at work, for entertainment, information, and as tools to
leverage our knowledge and intelligence. It is pretty much assumed whenever anyone sits down
to use a personal computer that it will operate with a graphical user interface (GUI) [1].
Microsoft, Apple and other leaders in the computer industries have made significant
contributions in this area transitioning users from older computer user interface such as batch
jobs or text based to GUI level user interface we know of today.
Since the release of Microsoft Windows 1.0 (Figure 1), Microsoft used a menu bar with pull-
down menus at the top of application window showing different options the application supports.
Pull-down menus are menus that the user can always access by making selections on top menu
bar. Introduced by the early Xerox Star, Apple Lisa, and Apple Macintosh interfaces these
menus are used by the majority of desktop applications today. Common items in the menu bar
are File, Edit, Format, View and Help [3].
Figure 1 – Microsoft Windows 1.0 [2]
Mid-term Paper M. Michael Nourai
91.527 - Human Computer Interaction Page 4
3. Microsoft Word 97-2003
3.1 Overview
My initial introduction to Microsoft Office was with Word 97. Its user interface was a
combinations of menu bar with pull-down menus and list of icons for most frequently used
options such as New Document, Open Folder, Save As, Font selection, etc. (Figure 2a). This user
interface was somewhat familiar to the users of Windows, so the user didn’t have to learn a
brand new user interface from scratch when using this application. User knew enough to get
started and then learned the Word 97 user interface as they used it.
Throughout the years, Microsoft released Office 2000, Office XP and Office 2003 (Figure 2b).
With each revision there were some user interface changes to make the office applications easier
to use. However, some changes such as addition of Office Assistant, and hiding menu items in
pull-down menus, didn’t make the user interface easier to use, and in fact had a reverse effect.
Figure 2a – Word 97 main window
Figure 2b – Word 2003 main window
Mid-term Paper M. Michael Nourai
91.527 - Human Computer Interaction Page 5
3.2 Menu bar The menu bar for Word 97 (Figure 3a) consisted of the following: File, Edit, View, Insert,
Format, Tools, Table, Windows, and Help. When user clicks on a menu bar title, it brings up a
list of related items, and user can then make a selection by moving the pointing device over the
items (which respond by highlighting), and clicking on the desired choice (or by using the up and
down arrow keys to highlight their selection and pressing Enter to select) [3]. These pull-down
menus were very convenient for hiding all the options until user clicks on them when they
needed them. This technique increased screen space for the user’s document area.
Figure 3a – Word 97 menu bar
Figure 3b – Word 2000 menu bar
With the Office 2000 and 2003 release, Microsoft changed the pull-down menus based on how
frequently you used the items listed in the menus (Figure 3b). Some menu items were hidden if
you didn’t use it often. Although this feature sounded good at first, it started to be extra work for
the users to find menu items they needed. I disabled this feature whenever I used Word.
Mid-term Paper M. Michael Nourai
91.527 - Human Computer Interaction Page 6
3.3 Office Assistant Microsoft Word 97 included for the first time a feature known as Office Assistant (Figure 4a),
which was "supposed to" assist the user in common tasks. In reality, it was nothing more than an
irritant and was quickly slammed by users [4].
Figure 4a – Word 97 Office Assistant
Figure 4b – Word 2000 Office Assistant
Since I was new to Word 97 and it had a different look and feel to it than my favorite word
processor, AMI Pro, I wanted to try to learn as much as I can about this new feature. But after
playing with the Office Assistant for several weeks, I didn’t find it useful and started turning it
off whenever I did a new install of Office.
Office Assistant went through some changes over the years since its initial introduction. In Word
2000 it got a new look (Figure 4b), but it remained as a not so useful feature. Office Assistant
was enabled by default for Word 97 and 2000.
While the Office Assistant was still present in Office XP, it was (thankfully) switched off by
default in this version of Word [4].
Mid-term Paper M. Michael Nourai
91.527 - Human Computer Interaction Page 7
4. Evolution of Word icons I love arts and icons, so when I was researching Microsoft Office Word for my mid-term paper, I
decided to present their icon changes from each releases (Figure 5). The following are Microsoft
icons for Word 97 – Word 2010.
Word 97 Word 2000
Word XP Word 2003
Word 2007 Word 2010
Figure 5 – Word 97 – Word 2010 icons
Mid-term Paper M. Michael Nourai
91.527 - Human Computer Interaction Page 8
5. Microsoft Word 2007 and 2010
5.1 Overview
Word 2007 was released in 2007 along with Office 2007. This version of Word differed radically
in looks from the previous versions, and went more with a Vista kind of theme (Figure 6a). A
major and easily noticeable feature was the Ribbon user interface design which was a bit
confusing (at least at the start) to users of the previous versions since it was result-oriented rather
than the traditionally command-oriented Menu system. Also new in this version is the new
XML-based DOCX format, which is not compatible with previous versions [4].
Word 2010 was released this year along with Office 2010. The Word 2010 User interface (Figure
6b) remains the ribbon interface and looks similar to Word 2007. However, there have been
some improvements made to ribbon interface of this version. The most noticeable difference
between Word 2007 and 2010 is the addition of File tab.
Figure 6a – Word 2007 main window
Figure 6b – Word 2010 main window
Mid-term Paper M. Michael Nourai
91.527 - Human Computer Interaction Page 9
5.2 Ribbon Interface Although at first the Office 2007 ribbon interface seems challenging to use (Figure 7), since it
looks so different than the traditional menus and toolbars that users were used to using. Over
time users got used to the new way of using Office applications and perhaps prefer it over the
traditional way. As part of my full-time job, I help students and faculty in using Office 2007 on
day to day basis and have gotten similar feedback from them. This feedback is very valuable to
me since I know that I am not the only one preferring the new interface over the previous
versions of Office.
Figure 7 – Word 2007 Ribbon interface
The ribbon interface is all about organizing and grouping most frequently used commands in a
tabbed-based format to allow the user to quickly find the commands they need to complete a
task. In older revisions of Office, the menus and toolbars seem to hide the commands and user
needed to click on the toolbars to see the contents. With ribbon interface, the contents of the
menus and toolbars are right there in front of you.
A great feature of ribbon interface is the capability of hiding and showing different menus based
on your current activity, which reduces clutter. For example, if you are on Insert tab and clicking
on Table to insert a table, a table context tab is added to the tab interface (Figure 8) to allow you
to select different options for your table.
Figure 8 – Word 2007 Ribbon Interface Showing Table Tools’ Design Tab
Mid-term Paper M. Michael Nourai
91.527 - Human Computer Interaction Page 10
5.3 Ribbon Interface Issues
5.3.1 Office Button is ambiguous
Although I like the ribbon interface over the traditional windows menus and toolbars interface, it
can be further improved. For example, when we first installed Office 2007 in the lab, almost
every student using it for the first time asked me, “where is the print button?” or “how do I print
my document?”
The print button is in a brand new menu accessible to the user only when the Office button is
pressed (Figure 9). The Office button is ambiguous and doesn’t seem to provide any function, at
first glance, unless you knew about it before hand.
Figure 9 – Word 2007 – Showing Office button pressed
Mid-term Paper M. Michael Nourai
91.527 - Human Computer Interaction Page 11
5.3.2 Dialog box invoking icon is too small
Most groups in the ribbon interface contain a dialog box to allow user change more options that
are normally hidden. Dialog box can be displayed if the user clicks on the dialog box icon. One
of the issues of the dialog box icon is that it is tiny and tough to see and it’s time consuming to
place the cursor on that little area to click on it (Figure 10a). The other issue is that it looks
ambiguous looking unless you knew about it ahead of time, or discovered what it does by play
with it.
Once you figure out what that icon means and get used to clicking on it, a dialog box will be
shown (Figure 10b) to allow you to view and change your editing options. This is a very valuable
resource available to the user for fine tuning extra editing options.
Figure 10a – Word 2007 Paragraph dialog box icon
Figure 10b – Word 2007 Paragraph dialog box
Mid-term Paper M. Michael Nourai
91.527 - Human Computer Interaction Page 12
5.4 Ribbon Interface Improvements
5.4.1 New File Tab
The hidden menu under office button was not liked by Word users. It was difficult to use for
beginners as well as extra clicks needed for advanced user to bring up those options.
Word 2010 improved the ribbon interface introduced with Word 2007 by replacing the
ambiguous office button with a File menu tab. In addition, some of the options that were
available under the office button were improved and modified.
However, File menu tab comes at a cost of interface inconsistency which behaves differently
than any other tabs in ribbon interface. This interface inconsistency at first is surprising, but the
added features make up for it. Some of the great features of File menu tab are “Info” selection
which provides information about the document (Figure 11a), “Print” selection which shows a
preview of the document as well as printer and settings (Figure 11b).
Figure 11a – Word 2010 – File tab->Info
Figure 11b – Word 2010 – File tab->Print
Mid-term Paper M. Michael Nourai
91.527 - Human Computer Interaction Page 13
5.4.2 Proposal for improving dialog box invoking icon
The dialog box icon mentioned in section 5.3.2 is yet to be improved. The Word 2007 (Figure
12a) and Word 2010 (Figure 12b) are using the same graphics and icon for displaying the dialog
box which I find it hard to use.
Figure 12a – Word 2007 Paragraph Group
Figure 12b – Word 2010 Paragraph Group
My suggestion is to remove the tiny icon and make the group’s name clickable (Figure 13). This
way user has more clickable area which is easier to see and click on.
Figure 13 – My propose changes to the dialog box invoking icon
Mid-term Paper M. Michael Nourai
91.527 - Human Computer Interaction Page 14
6. Conclusion Creating and improving a Human-User Interaction is a lot harder than one can image. Every
types of application may require a whole set of new design to improve the interface. In my
opinion, Microsoft made a great attempt in improving the Office Human-User Interaction
introducing the ribbon interface in Office 2007, then improving it further with Office 2010
considering 2-3 years of field testing and customer feedbacks. Ribbon interface for Word is
definitely a step in the right direction but there is always room for improvement.
7. References
[1] Jeremy Reimer, May 5, 2005. A History of the GUI.
http://arstechnica.com/old/content/2005/05/gui.ars
[2] Alex Castle and Florence Ion, October 22, 2009. A Visual History of the Windows GUI.
http://www.maximumpc.com/article/features/windows_throughout_ages_evolution_gui
[3] Ben Shneiderman, Catherine Plaisant, Maxine Cohen, Steven Jacobs. 2010. Designing the
User Interface: Strategies for Effective Human-Computer Interaction, 5/E.
[4] Jayesh Limaye, Apr 23, 2009. Evolution of MS Word.
http://www.techtree.com/India/Reviews/Evolution_of_MS_Word/551-101355-575-1.html