SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

20
SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005
  • date post

    21-Dec-2015
  • Category

    Documents

  • view

    213
  • download

    0

Transcript of SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

Page 1: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

SIMS 213: User Interface Design & Development

Marti HearstThurs, Feb 17, 2005

Page 2: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

Today

Raskin’s Locus of AttentionErrorsModesTime permitting: – Design Guidelines

Page 3: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

Mental Models Redux

Good Representations• capture essential elements of the event / world• deliberately leave out / mute the irrelevant• appropriate for the user, their task, and their interpretation

Page 4: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

Raskin on Cognition

Cognitive Engineering– Ergonomics:

• Takes into account the statistical variation of human variability– Design a car seat that fits 95% of the population

• Says that designing products that interact with us physically is reasonable straightforward

– Cognetics: Ergonomics of the mind• The study of the “engineering scope of our mental abilities”

– This is the applied side of cognitive science

Page 5: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

Image from Newsweek, Jan 2001

Raskin on Cognition

Cognitive Conscious / Unconscious– Examples?

• What is the last letter in your first name?– You know it but weren’t consciously accessing this information a

moment ago, but now you are.• How do your shoes feel right now?• How did “The Shining” make you feel?• Having a name on the “tip of your tongue”

– Differences?• New situations/routines• Decisions / one standard choice• Sequential / simultaneous

Page 6: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

Image from Newsweek, Jan 2001

Raskin on Cognition

Locus of Attention– What is it?

• An idea/object/event about which you are intently and actively thinking.• The one entity on which you are currently concentrating

– You see and hear much more– E.g., white noise

» Turn the lights off, you have a full-fidelity recording of their sound in your mind, which fades quickly

– Why locus?• Focus implies volition; locus not always under conscious control• Attention can be either active or “going with the flow”

– Why is it important for HCI?

Page 7: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

Raskin on Cognition

Locus of Attention– Why is it important for HCI?

• Cannot be conscious of more than one task at a time• Make the task the locus of attention

– Don’t count on people to read labels or directions• Beware of the power of mental habits

– Repetitive confirmations don’t work• Take advantage of it

– Do pre-loading while user thinking about next step– Streamline resumption of interrupted tasks

Page 8: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

Error Messages

Page 9: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

Cooper on error dialog boxes

Why are they problematic?How related to locus of attention?What are the alternatives?– Cooper is talking to programmers

• “Silicon Sanctimony”• You should feel as guilty as for using a goto – an

admission of failure in design

Page 10: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

What happens when you cancel a cancelled operation?

Do I have any choice in this?

Umm, thanks for the warning,but what should I do?

Uhhh… I give up on this one

Page 11: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

Inane Dialog Boxes

Page 12: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.
Page 13: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

Slide adapted from Saul Greenberg

“HIT ANY KEY TO CONTINUE”

Page 14: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

Modes

What are they?– The same user actions have different effects in different

situations.– Examples:

• Adobe reader example: vs. • Powerpoint drawing example• Keycaps lock

Page 15: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.
Page 16: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.
Page 17: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

Modes

When are they useful?– Temporarily restrict users’ actions– When logical and clearly visible and easily switchable

• Drawing with paintbrush vs. pencil• Autocorrect (if easy to switch the mode)

Why can they be problematic?– Big memory burden– Source of many serious errors

How can these problems be fixed?– Don’t use modes – redesign the system to be modeless– Redundantly visible– Raskin -- quasimodes

Page 18: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

Modal Blooper

Page 19: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

Modal Blooper(and other

problems too)

Page 20: SIMS 213: User Interface Design & Development Marti Hearst Thurs, Feb 17, 2005.

A Summary Statement

Raskin, p. 69– “We must make sure that every detail of an interface

matches both our cognitive capabilities and the demands of the task…”