Part II of textbook: Design Process
5 elements
6 design process
7 design rules
8 implementation support
9 evaluation
10 accessibility
11 user support and documentation

Chapter 5: interaction design basics

Achieve goals within constraints:
Design is iterative (waterfall vs agile)
Get to know users
Scenarios
	Help users find their way
	Iteration and improvement
Section 1
Focus on design
How does design affect how people work?

Section 2
What is design
	Achieve goals within constraints:
		Goals
		Constraints
		Tradeoffs
		(good, fast, cheap)
	Golden rule of design
		Understand your materials
			Computers
			People
		To err is human
			We make mistakes
			Systems should reduce likelihood of errors
			(reduce impact of errors)
		Put user first, keep user in center, remember user at end

Section 3 process of design
	Requirements
		Interviews, documents, objects, ethography
		(see SE and SA)
	Analysis
		Models
		Scenarios
		As is (rather than) as desired or official portrait
	Design
		From what to do,
		To how to do it
	Iteration/prototype
		Feedback as developed
	Implement/deploy
		Code 
		Hardware
		Documentation
		Tradeoff between design effort and quality

Section 4 user focus
	Rarely only one (type of) user
	Collaboration between users
	Stakeholders
	Know your users
		Generic software or website, hard to know users
		Do not assume users are like you
		Young male programmers are NOT typical
		Imagine several specific users
		Talk to them
		LISTEN to them
		Participatory design
			Involvement
			Commitment
			Desireable
			Real vs theory
			Watch them
			Look at artifacts
				Sticky notes
				Handwritten annotations
				Anything constantly referred to
			Use imagination
				Not what YOU would do 
				What USER would do

Section 5 scenarios
	e.g. user hits quit by accident
	details help verify design
	communicate
	validate models
	express dynamics
	remember
		time is linear
		choices
		scenarios does not always show alternatives
	
section 6 navigation design
	widgets and wording
		a small software application that is designed 
		to provide a specific piece of information  
		or specific function  on demand (button)
	screens and windows
	navigation within applications
	environment
	to come up with navigation
		who will use
		how do they think about it
		what are they going to do with system

	local structure
		perfect knowledge would imply shortest path
		each screen needs to say how to get closer to goal
		where you are
			bread crumbs
			current situation
		what you can do from here
			options
			don’t let cool design interfere with useable design
			mode: same button different context
		where you are going
			hover
			allow back button
			icons not obvious
		where you have been
		what you’ve done
		confirmation

	global structure
		often hierarchy
		(which needs to be understandable to use)
		Deep hierarchy hard to navigate
		Menu breadth (maybe 7, working memory)
			Can be larger if can see
		List by state, region, county, city, ….
		Dialog
			Pattern of interaction between user and system
‘no man is an island’
	Style
	Functional
		Files, cut, paste, common formats
	Navigation
		Linkage
		Other may not link to our main page
		We do not control web sites we link to

Section 7 screen design and layout
	Ask: what is user doing?
	Think: 
		What info required?
		What comparisons may be needed?
		What order may things be needed in?
	Design: let required interaction drive layout

Grouping and structure
	Alphabetical order?????
	Group (logically similar) things together physically
	Order of groups
		Natural order?
		Tab keys
	Decoration
		Boxes, lines, colors, can emphasize grouping
		Alignments
			Numbers aligned by decimal point
			Text aligned to left
			Names: first, last M (or two columns)
			Sort by time
			White space

	User action and control
		Data entry 
		Layout important
	What to do
		Passive vs active
		Nice if buttons and menus look the same
		Labels and icons clear
		Is label a current state or a (possible) action?
	Affordances
		Suggest by shape
		Handle vs button
		Depend on background and culture of users
			Nobody pushes on pictures in a real art gallery
			Novices rarely think of right click or double click
		Appearances
			Different purposes require different representations
			Bar chart, table line diagram, …..
			List by name, date, size, type
			Make easy for user to change
		
Aesthetics and utility
	Pretty<>good
	Sometimes need diversity of controls
		(subsystems)
	Backgrounds that look good can be hard to read
		Don’t get carried away with color (especially for color blind)
		3D effects, text in perspective, 3D pie charts
	Localization/internationalization
		In Germany, do they want menus in English?
		Resource identifier:
			Have a database of phrases for each language
			Some languages do not read left to right, top to bottom
		
Section 8 iteration and prototyping
	Formative evaluation
		Prototype in need of improvement
	Summative evaluation
		Is final product good enough?
	Prototyping is a hill climbing approach
		Blind paratrooper
		(local maxima; not necessarily best product)
		You need a good starting point
		Generate several different ideas