User-Centered Design and Testing Unit 1 - PowerPoint PPT Presentation

Loading...

PPT – User-Centered Design and Testing Unit 1 PowerPoint presentation | free to download - id: 4df2fc-NzU3Y



Loading


The Adobe Flash plugin is needed to view this content

Get the plugin now

View by Category
About This Presentation
Title:

User-Centered Design and Testing Unit 1

Description:

User-Centered Design and Testing Unit 1 * * * * * * 1.1.3 Basic Psychology Needed for Interface Motivation Overview Perception Memory Cognitive Processes Motor ... – PowerPoint PPT presentation

Number of Views:56
Avg rating:3.0/5.0
Slides: 97
Provided by: Dham7
Learn more at: http://read.pudn.com
Category:

less

Write a Comment
User Comments (0)
Transcript and Presenter's Notes

Title: User-Centered Design and Testing Unit 1


1
User-Centered Design and TestingUnit 1
2
Unit 1. Overview of User-Centered Design and
Testing
  • In this unit, we introduce
  • the basic principles of user interface design.
    We cover two facets of UI (User Inteface) design
  • the construction of interactive programs
  • the design of their behavior. It is grounded on
    the principles of human psychology and carried
    out through the techniques of heuristic
    evaluation and think-aloud user testing.

3
1.1 Foundation for User-Centered Design and
Testing
  • 1.1.1 Iterative Design
  • Why Iterative Design?
  • Visual Basic
  • Heuristic Evaluation
  • Think-Aloud Studies

4
  • Why Iterative Design?
  • The goal of this course
  • to learn to design and build usable
    software
  • Programs that people can use easily,
    efficiently, and correctly.
  • Experiences with commercial software, and
    everyday objects like VCRs(Video Cassette
    Records) and microwave ovens, should convince us
    that this is not an easy task.
  • Many systems built by talented people are
    perfectly functional but nearly unusable.

5
  • The fundamental our course based is
  • that system designers cannot fully anticipate
    the usability of their designs. In simpler terms
    you are not the user.
  • This limitation stems from several sources
  • Users are diverse, while you are a single person.
  • Users are (usually) not technical experts, while
    you are.
  • Users do not know what you were thinking when you
    designed the system, while you do.

6
????- ??(USER)
  • ????
  • ???????????????????

7
  • ?????????
  • ????????????????????
  • ????????,???????
  • ??????????????
  • ???????,???????????--?????

8
1?????
  • ??
  • ?????????????????
  • ?????????????????
  • ????????????,????
  • ????????????,??????,??????,??????,?????????????

9
  • ??????????????????????
  • ??????????????????????
  • ??????,??????????,???????????
  • ?????????????????????????,????????????????
  • ???????????????????????

10
??????????
  • ?????
  • ??????????
  • ???????????????,????????????
  • ??????????,????????,???????????????????,??
    ????????????????????

11
2?????
  • ???????
  • ??
  • ???????????,????
  • ??????,????
  • ??????
  • ??????????????????????????

12
3?????
  • ???????
  • ??
  • ???????,????????????????????
  • ?????????????????????,?????????????????????????
  • ????????????,???????????
  • ?????????,???????????????,????????????????????

13
  1. ????????????????
  2. ?????????????????????,?????????????
  3. ?????????????????????????????????????????????????,
    ??????????????,???????????????
  4. ???????????????????10?????????????,????????????
  5. ??????????????????,???????????

14
4?????
  • ???????????
  • ??
  • ????????
  • ???????,?????????????

15
  • In order to deal with this issue, we must adopt
    an iterative approach to system design. Rather
    than using a feed-forward (or open-loop)
    approach, as in the diagram below.

Figure Feed-forward, or open-loop, design approach

16
  • It include steps to refine the design that
    incorporate factors other than our personal
    opinion and acumen(??).
  • A step to analyze a preliminary design according
    to some "rules of thumb."
  • A test that gathers and incorporates user
    feedback on what has been built.


Figure 2 Iterative design with feedback
17
  • The rules of thumb ( ???????) we use in the
    smaller feedback loop often embody(??) design
    wisdom accumulated through the years and attained
    through many past errors and tests.
  • In the testing step, we get feedback from users
    on the system's actual usability, and incorporate
    that information into subsequent rounds of
    analysis, design, and construction.

18
  • This approach raises two major questions
  • It's hard enough to build something once how can
    we afford to build things more than once?
  • How do we accumulate experience and get feedback
    from users in a way that yields useful guidance
    to further work?

19
  • The key to answering the first question is to
    adopt a rapid prototyping approach.
  • To implement enough of a design to allow
    testing, without committing the effort needed to
    create a complete product.
  • For example, one might mock up the various
    displays seen by a user, without writing all of
    the code required to create them and navigate
    among them. Or,

20
  • To write code that works for just a single
    execution case, limiting the choices available to
    a user at any time.
  • Once user feedback is obtained for the aspects of
    a system that have been prototyped, design
    choices for those aspects can be narrowed down,
    and other aspects can be prototyped and tested.

21
  • The answer to the second question requires a
    body of knowledge and technique.
  • Good user testing relies on
  • some knowledge of human psychology.
  • good techniques for eliciting(??), recording,
    and analyzing user feedback.

22
  • This course provides you with three important
    tools of iterative, user-centered design
  • User interface programming in Visual Basic
  • Heuristic evaluation of user interfaces based on
    accumulated design experience,
  • Empirical think-aloud usability testing.

23
Visual Basic
  • Visual Basic is one of the most popular
    programming languages in use today, especially in
    the area of user interfaces.
  • It supports rapid prototyping of user interfaces,
    making it possible to test many aspects of a
    system's usability before its implementation is
    complete.
  • Once you have learned to use Visual Basic, you
    will also be able to apply this approach to other
    languages and systems,such as Power Builder,
    Develop 2000,etc.
  • Some supplement knowledge about UI and GUI.

24
What is UI(User Interface)?
  • All applications include two parts
  • User interface It is the contents a application
    display on the screen.
  • Program a group of Instructions which can finish
  • specific tasks. It runs behind the computer.
  • Every application has its UI form,
  • User interacts with applications by UI.
  • all interactions happened between user and
    application are finished by UI.

25
What is a good User Interface?
  • Three necessary conditions
  • Ease to learn
  • Ease to use
  • Attractive
  • Character-based systemcommands, inconvenience,
  • time consumption,difficult to
    learn and use
  • Graphical User Interface(GUI)What you see is
    what you get.

26
Visual programming Design and visual programming
design environment
  • Aim supply user with an intuitionistic and
    ease-using interface
  • A visual programming environment has all parts
    needs by GUI development. Programmer uses these
    user-friendly parts or widgets(??), such as
    windows,menu,button,and list boxes,etc.

27
Advantages of visual programming design
  • It is an ease-using and ease-learning GUI
    ,visual development
  • Programmer can display controller or widgets
    easily without writing codes
  • They can move,change size,or delete it ,if
    neccesary.
  • These is no limitation to the number of widgets
    in a window.
  • Programmers create UI by their vision.

28
Disadvantages of visual programming design
  • Larger harddisk content
  • Larger RAM(random access memory)
  • Even larger processor
  • Limitation visual development environment can
    only use GUI operating system, such as windows.

29
Heuristic Evaluation
  • A process that designers use to estimate the
    usability of their designs prior to submitting
    them to actual user testing. In this context, the
    word heuristic means a general principle or "rule
    of thumb" that usually leads to a good answer.
  • In this course, you will learn a small set of
    heuristics that will help you to make good
    user-interface design decisions, and also learn
    how to apply them in your work.

30
Think-Aloud Studies
  • The think-aloud approach is a powerful method
    empirically evaluating the usability of a system.
    In this method, a user is presented with a system
    or prototype and asked to perform a task while
    "thinking aloud" the steps and decisions
    involved. The collection and analysis of
    think-aloud data requires a disciplined approach,
    which you will learn in this course.
  • Used together, these three tools will help you to
    design usable and successful systems.

31
1.1.2 Basic Concepts of Interactive Programming
  • Direct Manipulation(????)
  • Affordance (?????????) and Feedback
  • Essential Task and the Event/Redraw Cycle
  • Controls, Model Objects, and Interpreting Events
  • Encapsulation(??) and Accessor Patterns

32
Direct Manipulation
  • Modern graphical user interfaces make use of a
    style of interaction called direct manipulation.
  • Direct manipulation interfaces are designed to
    give the user the illusion that they are directly
    manipulating the objects of interest to them.
  • The images portrayed to the user indicate the
    nature and state of those objects, and the
    program is structured so that interactions are
    performed (primarily) in terms of those
    representative images.

33
  • For example, In a desktop interface of a
    typical personal computer, files and folders are
    represented to the user by
  • a series of icons small representative images
    placed in windows
  • windows overlapping regions that are designed
    to be analogous to sheets of paper sitting on a
    desktop
  • The icons representing folders are shaped to
    remind the user of physical file folders, and the
    user may manipulate file system objects by moving
    them about, putting them in folders, etc.

34
  • Direct manipulation interfaces have been highly
    successful because they provide the illusion of
    directnessthey operate so that users feel that
    they are directly acting on objects, not working
    through the intermediary of a computer. 
  • The property of directness is not one that an
    interface either does or does not have.  Instead,
    interfaces can be more or less direct depending
    on how much of this feeling of directness they
    induce in a user.  

35
  • Further, the feeling of directness will vary from
    individual to individual, from interface to
    interface, and even between parts of an
    interface. 
  • For example, the action of dragging a file
    icon into a trash can icon to delete it is likely
    to seem more direct for most users than acting on
    the file by selecting a command from a menu. 

36
  • Interfaces that exhibit more directness for a
    majority of their intended user population are
    typically preferable because they tend to be
    easier to learn and use. 
  • (However, it is important to note that
    directness can go too far when it requires users
    to be direct in cases where operations might be
    much more efficiently handled in an indirect or
    automated fashion.)

37
Affordance and Feedback
  • In order to provide and reinforce the feeling of
    directness, interface designers often
    concentrate, among other things, on providing two
    particularly key characteristics in an interface
    affordance and feedback. 
  • Affordances are opportunities to act that are
    readily apparent to the user. 

38
  • For example, the handle of a hammer provides an
    affordance for grasping it in the hand (in a
    particular way that is useful for its intended
    purpose).  Another example is knurlingthe series
    of small ridges often found on knobs that make
    their surfaces rough, as shown in Figure below.
    Because knurling increases friction, it provides
    a good affordance for gripping an object with the
    fingers.

39
  • Figure Knurling provides
  • affordance for gripping.

Figure Simulated knurling invites the user to
"grip" with the mouse.
40
  • Because most objects in a graphical user
    interface appear only as pictures on a screen,
    the physical affordances that they can offer are
    limited.  However, by properly manipulating the
    visual appearances of objects, we can still make
    the purpose, state, and opportunities for action
    associated with objects apparent to the user. 
    This provides what might be thought of as a
    virtual affordance.
  •   For example, while we cannot knurl objects
    on the screen, we can provide simulated knurling
    as illustrated in Figure above.

41
  • Here we see the "resize handle" in the corner of
    a window in the Microsoft Windows standard user
    interface.  It appears to have raised ridges much
    like a knurled surface.  As a result, it reminds
    us of the affordance for grip found in the
    physical world, and hence invites us to act using
    the graphical user interface analog of grip
    (pressing and holding the mouse button over the
    area, in preparation for dragging).  Since the
    ridges are oriented diagonally, this in
    particular invites us to "grip" and drag towards
    the southeastwhich is appropriate for resizing a
    window. 

42
  • Note that we don't have to understand what
    knurling is, or that it affords grip, in order
    for this appearance to be effective as an
    affordance for "grip" in the interface. 
  • It can be effective simply because it reminds
    us of our past experience with many real world
    objects.

43
  • By manipulating the visual appearance of objects
    to provide proper affordances (or technically, to
    remind the user of affordances from their past
    experience, which typically has the same
    practical effect), we make the operation of
    interfaces more apparent, and we reduce the
    effort needed to learn them and perceive their
    important properties.  As a general rule (which
    we will see later in the form of a usability
    heuristic) a good user interface design will
    provide some visual indication of (affordance
    for) the actions that the user can carry out with
    it.

44
  • The important concept of feedback has a
    conceptually similar purpose. Feedback is the
    response by the system to the actions of the
    user.  This often comes in the form of updated
    visual representations, but can also be provided
    in other modalities such as audio.  If a system
    provides immediate feedback that clearly
    indicates the nature and consequences of their
    actions, it is much easier for users to evaluate
    whether those actions are having the desired
    effect. 

45
  • In the physical world, we normally get direct and
    strong feedback about the objects we manipulate
    in the form of vision, touch, and sound. 
  • In the virtual world, however, such strong
    and immediate feedback is often lacking because
    computational actions are normally invisible and
    silent. 
  • One of the best ways to increase the
    apparent directness of an interface is by
    providing strong and immediate feedback for all
    user actions.

46
Essential Task and the Event/Redraw Cycle
  • Although providing the appearance of directness
    is a goal of much modern user interface design,
    the user, of course, can never reach directly
    into the computer and manipulate computational
    objects.  They must use the intermediary of the
    input devices provided by the computer and
    express their actions with those devices.

47
  • To provide the user with the feeling of
    directly manipulating the objects of interest, an
    interactive program must do several things.  It
    must
  • Provide visual images that represent the objects
    of interest to the user (and indicate how they
    may be acted upon, that is, provide good
    affordances)
  • Accept inputs from the available input devices
  • Interpret those inputs in the context of the
    objects on the screen (and other parts of the
    system)
  • Modify internal structures modeling the objects
    of interest (and invoke application routines)
  • Update the visual display to reflect the
    consequence of the users' actions (provide good
    feedback)

48
This structure is so common in fact, that it is
in most cases provided for you by various
interactive systems (including Visual Basic which
will be used here), and, hence, in many cases
you must use this basic control flow for your
program.
49
  • Output on the screen is produced by a series of
    calls to a graphics library, which is normally
    part of a window(ing) system, or window manager. 
    As will be considered in later sections, a window
    system supports an abstraction of a series of
    independent drawing surfaces.  Although these
    drawing surfaces appear to the programmer as
    independent drawing spaces, they are normally
    presented to the user in a (potentially)
    overlapping fashion in the familiar form of
    windows.  It is the window system's job to
    internally track current overlap relationships
    and modify the outputs actually delivered to the
    screen to reflect this structure. 

50
  • Similarly, in some cases the window system may
    keep copies of surface areas currently overlapped
    by other windows, and automatically redisplay
    previously hidden material without involving the
    program.  Since this can be performed
    transparently, each program (or even different
    parts of the same program that use different
    windows) can have the illusion of directly
    drawing on their own display device.  This makes
    drawing code easier to create and allows many
    independent programs (or parts of the same
    program) to share the limited resources of a
    single display device gracefully.

51
  • Inputs in modern interactive systems are
    generally modeled as input event records (often
    just simply events).  Such an event record is a
    record of some significant action.  The most
    common events record changes in the state of
    input devices (resulting from user manipulation
    of the devices) for example, pressing a
    keyboard key or moving the mouse.  However, other
    kinds of event records are also possible, such as
    those recording the arrival of data on a network
    connection.

52
  • Events may record information such as what
    happened, when it happened, the context
    of important input devices at the time of the
    event (for example, where the mouse was pointing
    when it happened, and the status of various
    modifier keys, such as SHIFT and CTRL).  Finally,
    events record any data associated with the input
    (such as the character value associated with a
    key press event).

53
  • Since it is possible for events to be generated
    by the user faster than the program can respond
    to them, event records are normally placed in a
    queue to ensure they are not lost. 
  • Programs operate by requesting the next event
    from the input queue, interpreting and processing
    that event, producing any new output that is
    needed as a result (for example, redrawing the
    screen), and then returning for the next event. 

54
  • If there are no events currently waiting in the
    input queue, the program normally simply waits
    for the next event to arrive.  By modeling all
    "significant actions" of interest to an
    interactive program as events (even things such
    as interprocess communications and asynchronous
    file I/O), it is possible to support various
    forms of asynchronous input together using only
    the control flow outlined above.

55
Controls, Model Objects, and Interpreting Events
  • Given the basic event/redraw cycle described
    above, the central question becomes one of how to
    actually interpret and respond to incoming
    events, and how to structure the output creation
    process.  While it is possible to write code that
    directly responds to events and directly draws as
    a result, most interactive programs written today
    (including the ones you will write in Visual
    Basic) make use of a toolkit to support these
    operations.

56
  • A toolkit provides a much higher-level
    abstraction of the event/redraw cycle and
    automates a number of important steps.  In
    particular, toolkits provide a reusable library
    of objects that can appear on the screen and be
    the target of user input. 
  • Examples of such objects include the buttons,
    sliders, text areas, icons, check boxes, and
    menus familiar to most users.  These objects are
    sometimes called widgets, interactors, or
    interactive components.

57
  • In Visual Basic and several other systems, these
    objects go by the name of controls.  One of the
    major benefits of using a toolkit is that it
    provides a rich set of such controls and allows
    new types of controls to be created when
    necessary.  This means that a programmer does not
    necessarily need to recreate, for example, a
    button control, and that all button controls the
    user sees will work in the same way.

58
  • In direct manipulation terms, controls provide a
    presentation of the objects of interest to
    users.  However, because controls come from a
    generic library (??), they do not generally
    support the detailed semantics of those objects. 
    For example, in an interface to set the time, a
    text entry control can represent minutes. 

59
  • However, the standard text entry control does not
    have anything built into it that recognizes the
    fact than the minute value must be an integer
    between 0 and 59.  In addition, it is often the
    case that one object of interest is represented
    to the user by several different controls. 
  • For example, when providing
  • an interface to minutes, it might be
  • convenient to provide both a text entry
  • control and a set of arrows (what we
  • will later see is an up-down control)
  • to increment or decrement the value
  • as shown in the Figure.

60
  • By way of review, the overall relationship
    between parts of an interactive system is
    illustrated in the figure below

61
  • Note that, in this organization, model objects
    have a central organizing role.  They accept
    changes to their modeled information (either from
    controls or from application code), validate
    those changes, and respond to them by updating
    the properties of any controls related to that
    information. Occasionally it is convenient for
    controls to invoke application routines directly,
    bypassing the model. This is particularly so in
    the case of menus and buttons that represent
    "commands" in the application. However, the
    application should normally avoid manipulating
    controls directly, without going through the
    model.

62
Encapsulation and Accessor Patterns
  • Because model objects need to be informed
    whenever the information they manage changes and
    because they need to respond to those changes
    with action of their own (that is, updating
    various control properties), it is critical that
    they maintain encapsulation of that information.
    That is, it is critical that they completely
    control access to their internal data, not
    allowing it to be changed without their
    knowledge.  The normal way to ensure
    encapsulation is to use some form of information
    hiding (for example, declaring the field or
    variable to be private so that it cannot be
    accessed directly)and then allow access to the
    information only through special accessor
    methods.

63
  • Here we have provided only very basic
    implementations of accessor methods.  The
    accessor methods in a user-interface model object
    would contain additional. 
  • This general pattern of using a private field
    for data and providing get and set methods to
    read and write the field's value together
    constitute what we will call the accessor
    pattern.

public class myModelClass private
myDataType myDataValue public myDataType
getMyDataValue()return myDataValue public
void setMyDataValue(myDataType val)myDataValue
val
64
  • Visual Basic was not originally designed as an
    object-oriented language.  As a result,
    implementing the accessor pattern normally
    involves using individual variables and access
    procedures that are not nested inside a class
    definition.  Some of the Visual Basic code that
    follows is equivalent to the accessor pattern
    described above. Note that we don't expect you,
    at this point, to understand the Visual Basic
    code entirely, but do try to understand the gist
    of the code presented in this section.

65
  • Public Sub setMinuteValue(min As Integer) Dim
    minStr As String
  •     'Force into valid range If min lt 0 Then min
    0 If min gt 59 Then min 59
  •     'Update internal value If min ltgt
    minuteValue Then     minuteValue min '
    Nothing in the application to inform in this case
    End If
  •     'Prepare a two digit string (zero filled) to
    display minStr CStr(min) If min lt 10 Then
    minStr "0" minStr
  •     ' Update the text display if this is a change
    If MinutesText.Text ltgt minStr Then
    MinutesText.Text minStr End Sub

66
1.1.3 Basic Psychology Needed for Interface
  • Motivation
  • Overview
  • Perception
  • Memory
  • Cognitive Processes
  • Motor Capabilities
  • Errors
  • References

67
Motivation(??)
  • Most computer programs are designed to be used by
    people to perform a task.
  • Thus, in order for developers to design good
    computer systems, they must understand
  • 1) not only how computers work
  • 2) but also what the task is and how people
    work.

68
  • Designs that require people to perform beyond
    their limitations
  • 1) cause them to commit errors (which can
    be costly or even fatal in safety-critical
    systems),
  • 2) cause them to seek "workarounds" (which
    are usually inefficient),
  • 3) cause them to abandon systems (if they
    have the choice) or resist adopting new systems
    (if they are forced to use them).
  • 4) On the other hand, designs that augment
    human capability and help overcome people's
    limitations can be truly helpful, cost effective,
    and pleasurable to use.

69
  • Figure The triad of good system design
    understanding the
  • task, the computer technology,
    and the people

70
  • The purpose of this module is to give you some
    basic understanding of how people work, of their
    capabilities and of their limitations, in order
    to help you design better systems. Obviously,
    there is much more to know about this topic than
    one module can teach, but this brief presentation
    is still useful for two reasons.
  • First, the facts and principles of psychology are
    embedded in the methods this class teaches (we'll
    refer back to them as they come up in subsequent
    materials), so that when you master and use the
    methods, you will be implicitly applying these
    basic principles of psychology.

71
  • Second, you will often be working in
    interdisciplinary teams where at least one other
    team member might have extensive training in one
    of the behavioral sciences (for example,
    psychology, sociology, anthropology, or
    organizational behavior). What you will learn in
    this module will help you work together with
    these differently trained people to design
    effective systems.

72
Overview
  • When people use computer systems, they engage in
    many different activities (Figure 2).
  • They usually get information from
  • 1) the computer screen
  • 2) local hard copy like the manual,
  • 3) papers that they have brought with them to
    work on,
  • 4) other people.
  • Then, they usually process that information to
    come up with a plan of action either by
    formulating a new plan or using one they have
    used before. They then execute the planned
    actions and process the computer's response.

73
  • Throughout these activities people are learning
    (in the form of acquiring new knowledge or
    practicing old skills), and they are also
    committing and detecting errors.
  • Decades of psychological research have produced
    data and theories that can help developers design
    computer systems that facilitate a user's cycling
    around this loop, enhancing their learning and
    minimizing their errors.

74
Human activities involved when using a computer
system
75
An information processing model
  • A way to think about how people perform these
    activities that will help us understand some
    issues in computer interface design is called an
    information processing model (Figure below).
  • This model assumes that a person is like three
    separate computer processors
  • 1)a perceptual processor,
  • 2)a cognitive processor,
  • 3)and a motor processor.
  • The perceptual processor perceives information in
    the outside world, does some processing on that
    information related to the activities in Figure
    below (reading, listening, visual search, etc.),
    and deposits symbols in working memory (WM) that
    represent that information.

76
  • Figure The staged information processing
    model of people performing activities in the
    world

77
  • Once information is in WM, the cognitive
    processor can do the necessary processing
    (problem-solving, planning, determining a course
    of action, etc.). The cognitive processor can
    also retrieve (recall) additional information
    from long-term memory (LTM) to help in its
    processing, and information from WM can be stored
    in LTM (learning). When the cognitive processor
    determines that some action needs to be taken in
    the outside world (e.g., type a command, use the
    mouse to select a menu item, scroll the screen,
    etc.), it deposits a symbol in WM that the motor
    processor recognizes as a command to do some
    action.

78
  • The motor processor then does the action and the
    cycle begins again. These processors can work in
    parallel with each other, which reflects the fact
    that a person can perceive at the same time as
    thinking and performing motor actions. For
    example, when you drive you are looking at the
    road, thinking about where you will need to turn
    next, and steering the carall at the same time.
    However, the cognitive processor can only do one
    thing at a time, so there is a bottleneck in the
    model that is very important in UI design.

79
Perception
  • Modern computer systems communicate to the user
    primarily through
  • 1)The users sense of Vision
  • 2)Hearing (is becoming more important as speech
    interfaces mature).
  • 3)Some computer systems communicate to the user
    through touch, e.g., a computer racing car arcade
    game that shakes the seat more violently for a
    bumpy road than for a smooth straightaway.
  • Neither smell nor taste has been brought into
    commercial use in computer systems yet.
  • Visual Basic makes visual communication very
    easy to program therefore, we will concentrate
    on the perception of visual signals.

80
  • A person can only see detail with a very small
    area of their eye called the fovea. The fovea
    sees only about 2 degrees of visual angle. Only
    when the fovea is pointing at an area on the
    screen can a person see enough detail to read
    text or discriminate a detailed icon. To see more
    than 2 degrees of visual angle, the eye has to
    move. The rest of the eye is much more sensitive
    to changes in the visual field than the fovea.
    That is, in the rest of the screen, where the
    person is not directly looking, changes in the
    display will be very noticeable (e.g., blinking,
    animation, changes in color).

81
  • The fovea(??) can perceive detail in 2 degrees of
    visual angle. To read the whole screen, the eye
    would have to move the fovea around the screen.
    The eye is very sensitive to changes in the
    display area outside the foveal region

82
  • Visual search is the process by which a person
    looks for an object such as a word or an icon on
    a computer display. Visual search is very fast
    and easy if the target is different, along some
    dimension, from everything else on the computer
    display. For example, the target's color,
    orientation, size, or curvature could be
    different from that of other objects on the
    screen. In this case, the target "pops-out" at a
    person visually, and it doesn't matter if there
    is a cluttered screen or a very sparse screen.

83
  • If the target requires a person to discriminate
    multiple features, then the visual search is much
    slower because a person has to look at one item
    at a time to decide if it is the thing they are
    looking for. Then aspects of the design like
    screen clutter, location, display density, and
    grouping make a lot of difference in how fast the
    search can be completed. Again, these facts of
    visual searching bear on the design principles
    we'll talk about later in the class.

84
Memory
  • for purposes of UI design, we need to know only a
    few general things about memory.
  • As we learned earlier, there are two important
    memories working memory (WM) and long-term
    memory (LTM).
  • WM can be thought of as that part of LTM that is
    active at any time. WM is where the perceptual
    processor deposits the symbols it perceives and
    where the cognitive system keeps its intermediate
    results when processing information.
  • LTM is the permanent store of information that
    holds everything the person knows all facts,
    procedures, and history (things that happened to
    the person). This includes vocabulary, procedures
    for accomplishing tasks, relationships between
    concepts, etc.

85
  • 9 5 3 1 6 4 8 7 5 0 5 4 2

86
  • WM stores information in an acoustic form or a
    visual form.
  • LTM, on the other hand, stores the gist of
    information instead of the actual acoustic or
    visual form. This is an important fact because it
    predicts the type of mistakes people will make.
  • For example, a person who has just read a story
    about Jane may confuse the name with Jean because
    the names look so similar (all the same letters)
    and even sound very similar (the "j" and "n"
    sounds). However, the next week the person may
    not remember the name at all, but only remember
    that the story was about a girl (the gist) .
  • WM can hold only a limited amount of information
    at any one time, about 3 chunks .

87
  • LTM seems to be essentially infinite, but it is
    often difficult to retrieve information from it.
    Things are remembered more readily in the context
    in which they were learned.
  • Another property of LTM is that similar pieces of
    information interfere with each other's
    retrieval.
  • A third important property of memory is that
    recognition is easier than recall.
  • Finally, here again is the figure we encountered
    in the section of this page titled Overview

88
  • Note that information can get into WM from
    perception or from LTM, but information can only
    get into LTM from WM. This has implications for
    design and the design methods we will encounter
    later in the course.

89
Cognitive Processes
  • The cognitive processor does all the "thinking"
    in this model.
  • That is, it takes symbols in WM (deposited
    there either from perception or from LTM
    retrieval) and manipulates those symbols to solve
    a problem, plan a series of actions in response
    to that problem, and tell the motor processor how
    to execute those actions. For UI design, there
    are two important classes of cognitive processor
    activities routine skill and problem-solving.

90
  • Routine skill is the type of behavior exhibited
    by a person who knows a system well. They know
    all the menu items, commands, dialog boxes, etc.
    They only have to recognize what task situation
    (context) they are in and they know exactly what
    to do.
  • For instance, when using your word processor and
    determining that you want to delete a paragraph,
    you probably know exactly how to accomplish that .

91
  • On the other hand, when a system is new to a
    person, or when they use it only occasionally,
    they usually have to problem-solve to accomplish
    a task.
  • (Note Even when a person knows a system
    well, if it is a complex system, they usually are
    skilled in some aspects of it but novices in
    others. For instance, you may know very well how
    to use your word processor to write documents,
    but you might not know how to merge a document
    with a database of addresses to print address
    labels and write customized form letters.)

92
  • When a person problem-solves, it is as if they
    are searching through a maze(??).
  • They take their best guess about what to do
    next and go a short ways down that path. If it
    doesnt look like they are making progress toward
    their goal, they will retrace their steps and try
    another route.
  • This is typical problem-solving behaviorand
    we can either deliberately design user interfaces
    to support that behavior or inadvertently produce
    user interfaces that hinder it.

93
Motor Capabilities
  • The primary human motor behaviors used in
    computer systems today are typing, pointing, and
    clicking. These are also the interaction
    techniques best supported by Visual Basic, so we
    will concentrate on the psychology of those
    actions.

94
  • In Figure, we see that the motor processor takes
    information from WM and uses it to act on the
    world. For instance, the cognitive processor may
    determine that a menu item needs to be selected
    and deposits that menu item into WM. The motor
    processor would then see that menu item in WM,
    move the mouse to that menu item on the screen,
    and click the button. Alternatively, if the
    keyboard shortcut for that menu item is in LTM,
    the cognitive processor might deposit that
    knowledge into WM, and the motor processor would
    type the keyboard shortcut.

95
Errors
  • People make errorsat all stages of information
    processing.
  • 1) They will perceive information
    incompletely (by not seeing it at all) or
    incorrectly (by interpreting what they see
    incorrectly).
  • 2) They will remember information
    imperfectly, mistaking words for ones that sound
    alike (if presented aurally), look alike (if
    present visually), or are similar in meaning (if
    retrieved from LTM).
  • 3) They will have incomplete knowledge, so
    they will retrieve incorrect plans. When
    problem-solving, their "best guess" will be
    wrong.
  • 4) Finally, they will "slip" when executing
    motor actions, hitting the wrong key on the
    keyboard, or missing the menu item with the
    mouse.
  • Mistakes are inevitable, and, mostly, specific
    mistakes are unpredictable (though generally
    error-prone situations can be identified).

96
  • This concludes the module on the basic psychology
    needed for designing user interfaces.
  • In summary, the simple model of staged
    information processing presented in this module,
    which describes how people interact with the
    world, is the basis for many UI design
    guidelines, methods, and predictive analytic
    techniquesincluding many of those found later in
    this course. Therefore, as was mentioned earlier,
    when you master and apply the methods taught in
    this course, you will be implicitly applying the
    insights from this psychological research.
About PowerShow.com