P1: RAZI
December 18, 2014 12:47 K24618 K24618˙Book
4
Case Study: Expert
Evaluations of Complex
UIs
4.1 UI ANNOTATION AND ANALYSIS
We present our analysis results from the SA and HE of both of the compared UIs
following the extracted UI corpus. We annotated the UIs using a transcript of inter-
action sentences from actions. The following subsections present our analysis of five
selected functions from two image-processing applications.
4.1.1 RED-EYE REMOVAL
Adobe Photoshop steps
(0) Open the picture to adjust.
(1) Find the proper function in the menu bar or toolbox (Figure 4.1).
(a) The subtask involved was to look through the menu items (especially
in what seemed as most related: Image -> Adjustments and Filter)
for a relative command, but it was not found.
(b) The subtask involved was to look in the toolbox for a button resem-
bling the intended action. Because many of the buttons with a similar
function are grouped together (this fact is represented by a black tri-
angle in the bottom-right corner of the button, however, only the first
icon is shown as representing the group), the user needs to click and
hold on every such group button to find out the group members.
(2) Click and hold the group button and select “Red Eye Tool” (Figure 4.2).
(The cursor changes to a crosshair.)
(3) Click on the center of the red eye and repeat the same for other red eyes in
the picture. (The eye color turns to a natural one.)
(4) Save the result in the file.
FIGURE 4.1 Adobe Photoshop menu bar. Source: Adobe Photoshop CS2. Adobe product
screenshot(s) reprinted with permission from Adobe Systems Incorporated.
45
P1: RAZI
December 18, 2014 12:47 K24618 K24618˙Book
46 Cross-Cultural Human-Computer Interaction and User Experience Design
FIGURE 4.2 Adobe Photoshop red eye tool. Source: Adobe Photoshop CS2. Adobe product
screenshot(s) reprinted with permission from Adobe Systems Incorporated.
HE analysis
Fitt’s Law.
The buttons on the toolbar are quite small, even if they represent often-used functions.
The toolbar layout supports rather advanced users familiar with accelerators.
Help and documentation.
The task 1b was not even described in the help documentation, so the user had to
explore different possibilities by himself or herself.
Recognition rather than recall; perceived stability.
The button icon for the group comprising the “Red Eye Tool” changes every time
a tool from that group is selected. Although the tools are semantically connected,
their function and position on the menu has to be learned. This continual change of
location could also affect the perceived stability of the UI.
SA analysis
Actors, audience, paradigm.
All of the objects involved in the interaction pertain to the leading paradigm of
“window, icon, menu, pointing device” (WIMP). The paradigm is constituted by the
menu bar, toolbars, main window containing the image, dialog windows, icons, and
pointer. The paradigm is bound to the GUI metaphor. Adobe Photoshop is meant for
professionals. This distinction of audience is manifested implicitly by the channel
of distribution (commercial software) and explicitly in the marketing documentation
(Adobe Photoshop’s slogan reads: “The professional standard in desktop digital imag-
ing” (Adobe, 2005)). The menu paradigm is constructed by combining noun-verb or
verb-noun items, which seems deliberate (only one model should be chosen). A more
specific audience for this function consists of photographers and home users.
Symbols.
The users are addressed by symbols pertaining to the user domain. In this case, the
application icon and splash screen of Adobe Photoshop features a colorful feather.
The connotations are elegance, simplicity, and naturalness which one would expect
from a professional tool. What might break the expectation, however, is the historical
usage of the image that symbolizes a writing pen. The other screens (and toolbars)
are very compact and gray. The button activating the “Red Eye Tool” is found in

Get Cross-Cultural Human-Computer Interaction and User Experience Design now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.