Design Process

…and understanding users

Agenda

Finish history Design process Understanding users

Reminder: history lesson

Time

Use

r P

rodu

ctiv

ity

Batch

Command Line

WIMP(Windows)

1940s – 1950s 1980s - Present1960s – 1970s

?

?

Interaction has evolved from communication in the language of the Interaction has evolved from communication in the language of the computer, to communication in the language of people and their activitiescomputer, to communication in the language of people and their activities

New paradigms?

And the future?

Course ReCap

To make you notice interfaces, good and bad– You’ll never look at doors the same way again

To help you realize no one gets an interface right on the first try– Yes, even the experts– Design is HARD

To teach you tools and techniques to help you iteratively improve your designs– Because you can eventually get it right

What is design?

achieving goals within constraints

goals - purpose– who is it for, why do they want it

constraints– materials, platforms

trade-offs

What is a user-centered approach?

Early focus on users and tasks: directly studying

cognitive, behavioral, & attitudinal characteristics Empirical measurement: users’ reactions and

performance to scenarios, manuals, simulations &

prototypes are observed, recorded and analysed

Iterative design: when problems are found in user

testing, fix them and carry out more tests

A simple interaction design model

Exemplifies a user-centered design approach

Basic HCI process of design

requirements

analysis

design

implementand deploy

prototype

interviewsethnography

what is therevs.

what is wanted

guidelinesprinciples

dialoguenotations

precisespecification

architecturesdocumentation

help

evaluationheuristics

scenariostask analysis

ISO 13407

Discussion

How would you incorporate HCI design into larger software engineering design frameworks?

Traditional ‘waterfall’ lifecycle

Requirements analysis

Design

Code

Test

Maintenance

Spiral Lifecycle model

From cctr.umkc.edu/~kennethjuwng/spiral.htm

Why is HCI Design Difficult?

Difficult to deeply analyze human behavior May be too close to the domain Cost/features may be considered over good

human factors

Creativity is challenging!

Summary

Four basic activities in the design process1. Identify needs and establish requirements2. Design potential solutions ((re)-design)3. Choose between alternatives (evaluate)4. Build the artefact

User-centered design rests on three principles1. Early focus on users and tasks2. Empirical measurement using quantifiable & measurable

usability criteria3. Iterative design

Lifecycle models show how these are related

Know Thy User

You want to know– Who your users are– What they are doing– When they are doing it– Why they are doing it– What tools they are using– How they are using them

Know They User

Physical attributes(age, gender, size, reach, visual angles, etc…)

Physical work places(table height, sound levels, lighting, software version…)

Perceptual abilities(hearing, vision, heat sensitivity…)

Cognitive abilities(memory span, reading level, musical training, math…)

Personality and social traits(likes, dislikes, preferences, patience…)

Cultural and international diversity(languages, dialog box flow, symbols…)

Special populations, (dis)abilities

Design implications

Consider the implications:

Fact Implications

Users 16-80 yrs Range of text sizes

Range of grip strength

Some French speakers Multilingual interface

Astronaut users Extensive training available

Military context Aesthetics less of an issue

Ruggedness is critical

What are the implications?

Young, busy professionals. Product for use in their home/personal lives

Busy professionals. Product for use in the office, discretionary use.

Range of office workers. Product for us in the office, mandatory use.

Are cultural differences important?

5/21/1960 versus 21/5/1960?– Which should be used for international services and online

forms?

Anna, IKEA online agent

Designed to be different for UK and US customers

What are the differences and which is which?

What should Anna’s appearance be like for other countries, like India, South Africa, or China?

Persona

Description of user and what user wishes to do

Be specific/detailed, even give names and picture

Three personas for ATM usage follow– Adapted from User Interface Design and

Evaluation, The Open University Developed by Cooper (1999)

Felix (representing teenage ATM users)

Felix is 13 and gets pocket money each week. He spends it with

his friends, so doesn’t make regular deposits. He does receive

gifts for his birthday, Christmas, etc. and saves that money for

special purchases, such as a computer games console or trendy

clothes. He has an ATM card allowing him to make withdrawals

when needed for his purchases.

Sandra (representing young adults thru middle age)

Sandra is 30, is married to Jason, has two children Todd(6) and Carly (18

months). They live in a subdivision that is about three miles from the town

center, where the bank and stores are located. Jason uses the car for

work, and works long hours, leaving at 6:45 am and returning at 8:00 pm.

Sandra does not drive, so has to use public transportation. She tries to

run errands and shop while Todd is in school, so she only has to take

Carly to town with her. She typically needs to make two trips to town each

week to get everything done. She uses a stroller with Carly, and the bank

is one flight up via escalator, so she prefers to use the ATM outside the

first floor, even though there is no canopy to protect customers from bad

weather.

Grandpa Marvin (representing middle age to senior citizens)

Marvin is 68 years old, and his social security is deposited into his

bank account at the start of each month. He goes to the bank

every week, withdrawing enough cash for the week - for

miscellaneous expenditures. Regular bills are paid by check. He

stands in line for a live teller, as he prefers the social interaction to

using an ATM, even though his new artificial hip makes standing in

line uncomfortable. He does not have an ATM card.

Example: bus stop kiosk

Make a persona

Assignment: Make a Persona

Due Monday, Sept. 8 One paragraph – like examples in class, with

good details Make it clear what your project topic or idea

is

Turn in on Wiki by class time on Sept. 8

Next Wednesday

More project details Project topic brainstorming Group formation Design inspiration