design principles, guidelines and metaphor howell istance department of computer science de montfort...

28
Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

Post on 21-Dec-2015

226 views

Category:

Documents


5 download

TRANSCRIPT

Page 1: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

Design Principles, Guidelines and Metaphor

Howell Istance

Department of Computer Science

De Montfort University

Page 2: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Objectives

to provide an overview of Norman's model of interaction

to distinguish between user model, design model and system image

to explain basis for common design principles in HCI

to explain the role of metaphor as one means of building an appropriate user model

Page 3: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

The DMU PABX interface…

The university installed an well known PABX telephone system - the functionality provided is hardly used at all by staff despite regular attempts to publicise the features by printing and circulating the list of key codes and the actions they cause.

Why it this so….?

Page 4: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Fundamental requirements of good design for use by people

provide a good conceptual model make things visible use easily understood mappings

Page 5: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Affordances and Constraints

affordance - the perceived and actual properties of a thing, primarily those fundamental properties that determine just how the thing could possibly be used

when affordances are well utilised, the user can easily guess what to do by looking at the thing (no picture, label or instruction is needed)

constraints suggest natural limitations in the way in which things can be used

Page 6: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Mapping and Feedback

mapping relationship between controls and their movements, and the results in the real world

natural mappings utilise physical analogies and cultural standards additive dimensions substitutive dimensions

feedback: sending the user information about what action has actually been done and what has been achieved

Page 7: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Norman's Theory of action

bridging the gulf of execution - des igner creates input structures and information displays to f it the psychological needs of the user

bridging the gulf of evaluation - user has intentions, c reates plans and action sequences in terms of what is required by the system (the way the des igner intends the system to be used)

Interpreted

psychological variables(users knowledge)

physical variables(controlled by system)

translated into actions

(gulf of evaluation)

(gulf of execution)

Page 8: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Stages of user activities

establishing the goal forming the intention specifying the action sequence executing the action perceiving the system state interpreting the state evaluating the state with respect to the goals and intentions

Page 9: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

(illustration of 7 stage model)

Page 10: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

(fridge example)

Page 11: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Problems with the refrigerator example

matching the psychological variables of interest to the physical variables being controlled - labels on the control mechanism indicate some relationship to the psychological variables, they do not control these directly

mapping - strong interaction between controls make a simple mapping between control function and control outcome difficult to establish and represent

feedback - very slow conceptual model - none, instructions do not convey an

appropriate model

Page 12: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

UserModel

DesignModel

Design Model, User Model and System Image

Designer User

System and Documentation

SystemImage

Page 13: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Developing key interface elements

develop an appropriate interface metaphor or conceptual model suitable to the user population

communicate that model to the user in a consistent manner provide high level task-oriented operations, not low-level

implementation commands (bridge the gap of execution) make things visible (if an object has function (behaviour) ,

the interface should show this) provide informative feedback

Page 14: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Communicating Models

Page 15: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Metaphors

can be used to structure a user's mental model to facilitate ease of initial learning

use existing knowledge of familiar domains to provide explanations of unfamiliar artifacts

many terms in computing rely on common-use metaphors e.g menus, forms, windows

provides the designer with a means of building a 'myth' that the system behaves like something the user is already familiar with

Page 16: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

2D spatial metaphors

sheet of paper, forms, spread sheets pages - hold text, images, (magically) moving images drafting table - tools laid out around a working area light table - view many small images at once maps - birds eye view blackboards and whiteboards

Page 17: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

2 1/2 spatial metaphors

uses several layers of stacked 2D surfaces -each congruent with the overall metaphor

desktops and briefcases books Notebooks Index Cardfiles , NoteCards Doors and Rooms

Page 18: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Macintosh Desktop

Page 19: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

....leads to a full wastebasket

Page 20: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Components of NoteCards

Page 21: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

3D metaphors

virtual worlds buildings

Page 22: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Metaphors based on human activity

Visiting a supermarket, museum, eating in a restaurant agents - someone who does a task on behalf of someone

else stage and theatre as spatial metaphor

Page 23: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Tension between literalism and magic

literal interpretation of the spreadsheet would use an on-screen calculator to sum columns of values for the user to type back into the spreadsheet maximises understanding but does not add power

magic interpretation - rows and columns magically sum themselves and then display values maximises power but may interfer with understanding

Page 24: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Strengths in the use of metaphors

a strength of using metaphors is that they can suggest behaviours to the user based on their knowledge of the familiar domain and encourage exploratory learning of the new artefact e.g.. if I throw a file into a waste-basket, I should be able to pick it

out again, Now how do I do that ...?

Page 25: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Limitations in the use of metaphors

by definition, each metaphor has a limitation - one single metaphor is unlikely to represent all aspects of system

behaviour leads to the use of composite metaphors e.g. windows and

desk-tops user has to be encouraged to use relevant parts of the

analogy care has to be taken that the metaphor does not suggest

behaviours that can lead to errors

Page 26: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Process of generating metaphors (after Erickson)

Define and understand the functionality offered by the system

Observe users understanding of the artifact and identify problems they have

Generate metaphors Evaluate candidate metaphors using:

Amount of structure metaphor offers Applicability of structure to artifact Representability Suitability to audience Extensibility

Page 27: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

MacIntosh Guidelines

metaphor based

direct manipulation

see and point

consistency

WYSIWYG

user control

feedback and dialogue

forgiveness

perceived stability

aesthetic integrity

modelessness

Page 28: Design Principles, Guidelines and Metaphor Howell Istance Department of Computer Science De Montfort University

SOFT3057 - Interactive Systems

Alternative Principles (Genter and Neilsen)

central role of language

rich internal representation of objects

more expressive interface

expert users

shared control