Professional Documents
Culture Documents
what it is, interventions, goals, constraints what happens when who they are, what they are like rich stories of design finding your way around a system never get it right first time!
y users
y
y scenarios
y
y navigation
y
manual: electric:
write, print, staple, write, print, staple, write, print, write, print, , staple
what is design?
achieving goals within constraints
y goals - purpose y who is it for, why do they want it y constraints y materials, platforms y trade-offs
y understand people
psychological, social aspects y human error
y
To err is human
y accident reports .. y aircrash, industrial accident, hospital mistake y enquiry blames human error y but y concrete lintel breaks because too much weight y blame lintel error ? no design error we know how concrete behaves under stress y human error is normal y we know how users behave under stress y so design for it! y treat the user at least as well as physical materials!
Central message
the user
Steps
y requirements
y
what is there and what is wanted ordering and understanding what to do and how to decide getting it right and finding what is really needed!
y analysis
y
y design
y
persona
y description of an example user y not necessarily a real person y use as surrogate user y what would Betty think y details matter y makes her real
example persona
Betty is 37 years old, She has been Warehouse Manager for five years and worked for Simpkins Brothers Engineering for twelve years. She didn t go to university, but has studied in her evenings for a business diploma. She has two children aged 15 and 7 and does not like to work late. She did part of an introductory in-house computer course some years ago, but it was interrupted when she was promoted and could no longer afford to take the time. Her vision is perfect, but her righthand movement is slightly restricted following an industrial accident 3 years ago. She is enthusiastic about her work and is happy to delegate responsibility and take suggestions from her staff. However, she does feel threatened by the introduction of yet another new computer system (the third in her time at SBE).
cultural probes
y direct observation y sometimes hard
y y
scenarios
y stories for design y communicate with others y validate other models y understand dynamics y linearity y time is linear - our lives are linear y but don t show alternatives
scenarios
y what will users want to do? y step-by-step walkthrough
what can they see (sketches, screen shots) y what do they do (keyboard, mouse etc.) y what are they thinking?
y
use scenarios to ..
y communicate with others y designers, clients, users y validate other models y play it against other models y express dynamics y screenshots appearance y scenario behaviour
linearity
Scenarios one linear path through system Pros:
y life and time are linear y easy to understand (stories and narrative are natural) y concrete (errors less likely)
Cons:
y no choice, no branches, no special conditions
y So:
the systems
start
management
messages
add user
remove user
main screen
remove user
confirm
add user
levels
y widget choice y menus, buttons etc. y screen design y application navigation design y environment y other apps, O/S
the web
y widget choice y screen design y navigation design y environment
physical devices
y widget choice y screen design y navigation design y environment
controls
buttons, knobs, dials
goal seeking
goal start
goal seeking
goal start
goal seeking
goal start
goal seeking
goal start
more things
modes
y lock to prevent accidental use y remove lock - c + yes to confirm y frequent practiced action y if lock forgotten y in pocket yes gets pressed y goes to phone book y in phone book c delete entry yes confirm oops !
hierarchical diagrams
the system
management
messages
add user
remove user
management
messages
add user
remove user
navigating hierarchies
y deep is difficult! y misuse of Miller s 7 2 y short term memory, not menu size y optimal? y many items on each screen y but structured within screen
see /e3/online/menu-breadth/
marriage service
y y
general flow, generic blanks for names pattern of interaction between people pattern of interaction between users and system but details differ each time
computer dialogue
y y
network diagrams
main screen remove user confirm
add user
main screen
remove user
confirm
add user
wider still
y style issues: y platform standards, consistency y functional issues y cut and paste y navigation issues y embedded applications y links to other apps the web
ABCDEF*HIJKLM NOPQRSTUVWXYZ
basic principles
y ask
y what is the user doing?
y think
y what information, comparisons, order
y design
y form follows function
available tools
y grouping of items y order of items y decoration - fonts, boxes etc. y alignment of items y white space between items
y instructions
y
decoration
y use boxes to group logical items y use fonts for emphasis, headings y but not too many!!
ABCDEF*HIJKLM NOPQRSTUVWXYZ
alignment - text
y you read from left to right
(English and European)
Willy Wonka and the Chocolate Factory Winston Churchill - A Biography Wizard of Oz Xena - Warrior Princess
alignment - names
y Usually scanning for surnames
make it easy!
Alan Dix Janet Finlay Gregory Abowd Russell Beale Alan Janet Gregory Russell
alignment - numbers
think purpose! which is biggest?
alignment - numbers
visually: long number = big number align decimal points or right align integers
multiple columns
y scanning across gaps hard:
(often hard to avoid with large data base fields)
75 120 35 27 85
multiple columns - 2
y use leaders
75 120 35 27 85
multiple columns - 3
y or greying
(vertical too)
75 120 35 27 85
multiple columns - 4
y or even (with care!) bad alignment
space to separate
space to structure
space to highlight
physical controls
y grouping of items
y defrost settings defrost settings y type of food
physical controls
y grouping of items y order of items
1) type ofof heating type heating 2) temperature 2) temperature 3) time to cook 3) time to cook 4) start 4) start
1)
2 3 4
physical controls
y grouping of items y order of items y decoration
y different colours
different colours for for different functions different functions y lines around related lines around related buttons buttons (temp up/down)
physical controls
y grouping of items y order of items y decoration y alignment
y centered text in buttons
physical controls
y grouping of items y order of items y decoration y alignment y white space
y gaps to aid grouping
entering information
y forms, dialogue boxes
presentation + data input y similar layout issues y alignment - N.B. different label lengths
y
Name:
Alan Dix
Address: Lancaster
Name:
Address: Lancaster
y logical layout
use task analysis (ch15) y groupings y natural order for entering information
y
y y
?
Alan Dix
top-bottom, left-right (depending on culture) set tab order for keyboard entry
knowing what to do
y what is active what is passive y where do you click y where do you type y consistent style helps y e.g. web underlined links y labels and icons y standards for common actions y language bold = current state or action
affordances
y psychological term y for physical objects
y y
presenting information aesthetics and utility colour and 3D localisation & internationalisation
presenting information
y purpose matters
sort order (which column, numeric alphabetic) y text vs. diagram y scatter graph vs. histogram
y
name chap10 chap1 chap5 chap10 chap1 chap11 chap14 chap12 chap20 chap13 chap8 chap14 size 17 12 12 16 51 17 262 22 27 83 32 22
colour and 3D
y both often used very badly! y colour
older monitors limited palette y colour over used because it is there y beware colour blind! y use sparingly to reinforce other information
y
y 3D effects
good for physical information and some graphs y but if over used e.g. text in perspective!! 3D pie charts
y
prototyping
prototyping
y you never get it right first time y if at first you don t succeed
OK?
design
prototype
evaluate
done!
re-design
pitfalls of prototyping
y moving little by little