"Don't make me think.” : Steve Krug Interaction Design

User interface development Why is this important

Why is this important

What is the problem?

http://www.guuui.com/browse.php?cid=194

User Interface Development How do we do it?

How do we do it?

Understand the different perspectives a user and a developer have to a program Mental Models. User and developer have different mental models.

Know your user

Know your user

consult with users "Know thy user, and you are not thy user.” - Arnie Lund

effective user interfaces

factors affecting readability

use of white space

effective prompts

Guess a number

Please guess a number between 78 and 83

Guess a number 78 to 83

78 to 83

judicious use of colour and graphics

grouping of information

unambiguous and non-threatening error messages

unambiguous and non-threatening error messages

unambiguous and non-threatening error messages

legibility of text: justification, font type (serif vs sans serif), size, style

recognition of relevant social and ethical issues Speaking the same language (actual, cultural, and economic)

Speaking the same language (actual, cultural, and economic)

Consistency

Image References http://www.maplin.co.uk/images/Full/A90FL.jpg http://www.w3.org/2008/Talks/09-mwbp-smart/mobilecrazy.png http://www.offchild.com/ http://www.maplin.co.uk/images/Full/A90FL.jpg http://www.disambiguity.com/when-to-use-drag-drop-some-informal-research-results/ http://archive.salon.com/21st/chal/1998/02/10chal2.html http://www.pcd-innovations.com/infosite/ms_parody.htm http://img353.imageshack.us/i/microsoft1978ew7.jpg/#q=microsoft http://www.alistapart.com/articles/whitespace/ http://www.w3.org/TR/2000/NOTE-ATAG10-TECHS-20000504/techimages/HS-tag-editor-img1.gif http://www.rightattitudes.com/blogincludes/images/20061031_resume_fonts_serif_sans-serif.png http://www.skillsforaccess.org.uk/media/ht_b6_a2_collage1.jpg

http://www.maplin.co.uk/images/Full/A90FL.jpg

http://www.w3.org/2008/Talks/09-mwbp-smart/mobilecrazy.png

http://www.offchild.com/

http://www.maplin.co.uk/images/Full/A90FL.jpg

http://www.disambiguity.com/when-to-use-drag-drop-some-informal-research-results/

http://archive.salon.com/21st/chal/1998/02/10chal2.html

http://www.pcd-innovations.com/infosite/ms_parody.htm

http://img353.imageshack.us/i/microsoft1978ew7.jpg/#q=microsoft

http://www.alistapart.com/articles/whitespace/

http://www.w3.org/TR/2000/NOTE-ATAG10-TECHS-20000504/techimages/HS-tag-editor-img1.gif

http://www.rightattitudes.com/blogincludes/images/20061031_resume_fonts_serif_sans-serif.png

http://www.skillsforaccess.org.uk/media/ht_b6_a2_collage1.jpg