1. Process of Interaction Design

2. Overview Some general guidelines What is Interaction Design?
Four basic activities
Three key characteristics
Some practical issues
Who are the users?
What are ‘needs’?
Where do alternatives come from?
How do you choose among alternatives?
Some general guidelines

3. What is Interaction Design?
It is a process:
a goal-directed problem solving activity informed by intended use, target domain, materials, cost, and feasibility
a creative activity
a decision-making activity to balance trade-offs
It is a representation:
a plan for development
a set of alternatives & successive elaborations

4. Four basic activities
There are four basic activities in Interaction Design:
1. Identifying needs and establishing requirements
2. Developing alternative designs
3. Building interactive versions of the designs
4. Evaluating designs

5. Three key characteristics
Three key characteristics permeate these four activities:
1. Focus on users early in the design and evaluation of the artefact
2. Identify, document and agree specific usability and user experience goals
3. Iteration is inevitable. Designers never get it right first time

6. Some practical issues Who are the users? What are ‘needs’?
Where do alternatives come from?
How do you choose among alternatives?

7. Who are the users? Not as obvious as you think:
those who interact directly with the product
those who manage direct users
those who receive output from the product
those who make the purchasing decision
those who use competitor’s products ???

8. Who are the stakeholders?
Check-out operators
• Suppliers
• Local shop owners
Customers
Managers and owners

9. User categories Three categories of user: Wider term: stakeholders
primary: frequent hands-on
secondary: occasional or via someone else;
tertiary: affected by its introduction, or will influence its purchase.
Wider term: stakeholders

10. Who are the users? (contd)
What are their capabilities? Humans vary in many dimensions!
Some examples are:
size of hands may affect the size and positioning of input buttons;
motor abilities may affect the suitability of certain input and output devices;
height if designing a physical kiosk;
strength - a child’s toy requires little strength to operate, but greater strength to change batteries

11. What are ‘needs’? Users rarely know what is possible
Users can’t tell you what they ‘need’ to help them achieve their goals
Instead, look at existing tasks:
their context
what information do they require?
who collaborates to achieve the task?
why is the task achieved the way it is?
Envisioned tasks:
can be rooted in existing behaviour
can be described as future scenarios

12. Where do alternatives come from?
Humans stick to what they know works
But considering alternatives is important to ‘break out of the box’
Designers are trained to consider alternatives, software people generally are not
How do you generate alternatives?
‘Flair and creativity’: research & synthesis
Seek inspiration: look at similar products or look at very different products

13. How do you choose among alternatives?
Evaluation with users or with peers e.g. prototypes
Technical feasibility: some not possible
Quality thresholds: Usability goals lead to usability criteria set early on and check regularly
safety: how safe?
utility: which functions are superfluous?
effectiveness: appropriate support? task coverage, information available
efficiency: performance measurements

14. Testing prototypes to choose among alternatives

15. ISDE Lecture Activity

16. Lecture Activity Consider the design issues involved for the following
A mobile phone for old people
A mobile phone for young children
An office phone

17. Lecture Activity 10 – 15 mins
Select one of these
Identify the key functionality required
Identify key user & task characteristics
Consider the design trade offs that might be required
State some usability criteria that could be used to evaluate the design
Produce a ‘front’ end for your device

18. General design Principles
Wide range of design principles
Examples include
Neilsens Heuristics
Shneiderman’s ‘Golden Rules’
Windows Interface Guidelines
They cover
Guidelines for physical design
Menu design
Screen formatting and presentation issues
Designers can apply these – but need to do so with care!
Applying design guidelines alone does not lead to good design

19. Heuristics (after Neilsen)
use simple and natural dialogue sequences
speak the users language
minimise user memory load
be consistent
provide feedback
provide clearly marked exits
provide shortcuts
provide good error messages
prevent errors

20. Shneiderman’s ‘Golden Rules’
Here is another similar list
strive for consistency
enable frequent users to use shortcuts
offer informative feedback
design dialogues to yield closure
offer simple error handling
permit easy reversal of actions
support internal locus of control
reduce short term memory load

21. Windows Interface Guidelines
Set of general principles for interface design in Microsoft's software development documentation
directness
user in control
consistency
forgiveness
feedback
aesthetics
simplicity

22. Many common elements… Be consistent Nielsen
Shneiderman
strive for consistency
enable frequent users to use shortcuts
offer informative feedback
design dialogues to yield closure
offer simple error handling
permit easy reversal of actions
reduce short term memory load
Microsoft
directness
user in control
consistency
forgiveness
feedback
aesthetics
simplicity
Nielsen
use simple and natural dialogue sequences
speak the users language
minimise user memory load
be consistent
provide feedback
provide clearly marked exits
provide shortcuts
provide good error messages
prevent errors
Be consistent

23. Consistency……
important to enable user to build a reliable model of how the interface works
makes the interface familiar and predictable by providing a sense of stability
allows users to transfer existing knowledge to new tasks and focus more on tasks because they need not spend time trying to remember the differences in interaction.
important through all aspects of the interface, names of commands, layout of information, and operational behaviour.

24. Many common elements… Reduce memory load Shneiderman Nielsen Microsoft
strive for consistency
enable frequent users to use shortcuts
offer informative feedback
design dialogues to yield closure
offer simple error handling
permit easy reversal of actions
support internal locus of control
reduce short term memory load
Nielsen
use simple and natural dialogue sequences
speak the users language
minimise user memory load
be consistent
provide feedback
provide clearly marked exits
provide shortcuts
provide good error messages
prevent errors
Microsoft
directness
user in control
consistency
forgiveness
feedback
aesthetics
simplicity
Reduce memory load

25. Minimise user memory load
Basic rule: don’t expect the user to remember what has already been done, make this visible at the interface
If a command is made up of a number of pieces of data entered by the user in sequence, display these rather than expect the user to remember the data already entered
Help the user remember where they are in a transaction sequence – Menu 2/5 Step 1 - 4
Will cover design implications later

26. Feedback: American Airlines site
Place in transaction sequence
Data previously entered

27. Many common elements… Feedback to user Nielsen
use simple and natural dialogue sequences
speak the users language
minimise user memory load
be consistent
provide feedback
provide clearly marked exits
provide shortcuts
provide good error messages
prevent errors
Shneiderman
strive for consistency
enable frequent users to use shortcuts
offer informative feedback
design dialogues to yield closure
offer simple error handling
permit easy reversal of actions
support internal locus of control
reduce short term memory load
Microsoft
directness
user in control
consistency
forgiveness
feedback
aesthetics
simplicity
Feedback to user

28. Feedback from the system
Every action the user makes should produce a perceptible response.
The intention is to reduce user uncertainty that the system has:
received the last input,
is currently doing something about it,
or is waiting for the next input.
Commands should result in some visible change to the interface
E.g ‘mail has been sent’ in response to a ‘Send’ command
Presentation of objects on screen updated to reflect their current state
Task analysis should enable appropriate information to be identified as feedback for a specific task

29. Feedback: Response Time
Response time for feedback should be appropriate to the type of user action:
e.g. response to keystroke - instantaneous; response to command input - may take longer
Provide ‘system busy’ feedback if time will exceed a few seconds or is unpredictable
Provide indication of how many transactions remain, for example as a bar chart or as a percentage.
This largely disappeared as a problem with fast single user PCs and has re-appeared with distributed web-based applications

30. Many common elements… Appropriate user support Nielsen Shneiderman
use simple and natural dialogue sequences
speak the users language
minimise user memory load
be consistent
provide feedback
provide clearly marked exits
provide shortcuts
provide good error messages
prevent errors
Shneiderman
strive for consistency
enable frequent users to use shortcuts
offer informative feedback
design dialogues to yield closure
offer simple error handling
permit easy reversal of actions
support internal locus of control
reduce short term memory load
Microsoft
directness
user in control
consistency
forgiveness
feedback
aesthetics
simplicity
Appropriate user support

31. Appropriate user support
HELP messages
important to recognise different types of help;
should be available when required and context-specific;
can the user get help about what responses are possible at a given point in a dialogue.
ERROR messages
should explain what is wrong and what corrective action is required;
should use ‘jargon’ familiar to the user;
often this support is poorly designed in terms of what information is given to the user.

32. Many common elements… Flexibility Nielsen
use simple and natural dialogue sequences
speak the users language
minimise user memory load
be consistent
provide feedback
provide clearly marked exits
provide shortcuts
provide good error messages
prevent errors
Shneiderman
strive for consistency
enable frequent users to use shortcuts
offer informative feedback
design dialogues to yield closure
offer simple error handling
permit easy reversal of actions
support internal locus of control
reduce short term memory load
Microsoft
directness
user in control
consistency
forgiveness
feedback
aesthetics
simplicity
Flexibility

33. Flexibility
Measure of how well a dialogue can cater for different levels of user skill.
Provide alternative means of achieving the same goal which match different models of how the interface works.
e.g. word selection: cursor to start of word and double click, click and drag, click and shift-click.
e.g. word deletion: word highlighted and Control +X key, select ‘Cut’ menu option, backspace.

34. Flexibility Adapt to the skill level of the user by:
providing accelerators: allow user to answer ahead, provide key bindings for menu options;
providing macro facility;
accepting abbreviations for command words;
accepting synonyms (alternative names);
allowing user to choose level of instructions or help.

35. Many common elements… User in control Nielsen
use simple and natural dialogue sequences
speak the users language
minimise user memory load
be consistent
provide feedback
provide clearly marked exits
provide shortcuts
provide good error messages
prevent errors
Shneiderman
strive for consistency
enable frequent users to use shortcuts
offer informative feedback
design dialogues to yield closure
offer simple error handling
permit easy reversal of actions
support internal locus of control
reduce short term memory load
Microsoft
directness
user in control
consistency
forgiveness
feedback
aesthetics
simplicity
User in control

36. User in control user initiates actions, not the computer or software
use techniques to automate tasks, but implement them in a way that allows the user to chose or control the automation.
users must be able to personalize aspects of the interface, such as colour, fonts, or other options

37. Minimal user input
Balance between number of keystrokes or mouse movements/clicks and memory load.
Reducing keying errors increases speed of data entry.
Allow selection from a list rather than typing in a value (recognise rather than recall).
Edit a command that has produced an error rather than retyping the command.
Do not request input of information which can be derived automatically or which has been entered previously.
Use default values.

38. Menus
Usually a collection of actions, structured into a list from which a user chooses
Actions applied to objects
Explicitly selected by user – format + font… [selected text]
Implicitly assumed by system – print [current file]
Pop-up menu over selected object shows common actions on that object
Actions may be represented
by text (e.g pull-down menu)
by icons (e.g toolbar)
Actions completed
Immediately by selecting menu item
Following collection of more data from user (via a dialogue box)

39. Overloading menus This approach is now used in some MS applications
Most common Windows applications use an ‘anything, anytime’ approach – ie all commands are available to the user at all times
Leads to large, cumbersome menu structures where the user can forget how to find a particular command
Toolbars attempt to provide shortcuts to frequently used items
order of icons in toolbars different from items in pull-down menus representing same actions
Many CAD systems use an alternative, moded approach where a general type of operation, or task is selected
Only a restricted set of menus relevant to that operation are displayed
This approach is now used in some MS applications

41. Menu Structure
‘Structures should reflect users expectations.. and support users flow of work’ (ISO 9241/14)
Priorities
Conventional categories (file, edit,…)
Use of dividers to break menus into groups
Logical groups of related actions (cut,copy,paste)
Arbitrary groups
consistently ordered, numerically or alphabetically

42. Sequencing options within groups
consistency - use the same relative order of items where the group is presented again
importance - place important items first in the group
conventional order e.g days of the week
order of use - e.g ‘copy’ preceeds ‘paste’
frequency of use
if frequency of option is known, place frequent items first
alphabetical order
What ordering rules have been applied in the next slide?

44. Functional Objectives with Screen Layout
arrange items on screen to give highest probability of elicting an acceptable level of human performance
the user will be able to
extract information she is seeking
identify related groups of information
distinguish exceptional items (warnings and error messages)
determine what action is necessary 2

45. Formatting recommendations
split strings more than 6 alpha numerics into smaller groups
(bad) (good)
ABBA347686A ABBA A2
ABBA456388A ABBA A3
identical data should be presented in the same way even if varaitions in input format are tolerated
30 Nov > 30/11/95 (for example)
30th nov 95 9

46. Formatting recommendations
data should be presented in full version even if abbreviated input allowed, provide feedback to user
Party:[ ]
Party:[ ch,cai] Chemical Bank, Cairo 10

47. Formatting recommendations
numeric codes displayed with right justification
lists of numeric with decimal points should be aligned around the point
34.723
43.908
2341.5 11

48. Labeling in screen design
descriptive title or phrase adjacent to a group of related items or information
ensure labels are meaningful to the user
labelling should be visually distinct from the data
data labelling should not be able to be confused with help messages or command descriptions 12

49. Labeling in screen design
use consistent relationship between labels and data being described
e.g. above and left justified
Name:
[ ]
include units in label to reduce ambiguity
e.g. Weight( Kg):
[ ] 13

50. Aesthetic issues
Design is valued for its fitness to a particular user and task
Design aesthetics is intended to make the product or system appear attractive & appealing
Nielsen advocates Simplicity – particularly for Website design
However careful use of colour, graphics and formatting can make the design more aesthetically pleasing
Need to get the right balance

51. Style guides and sources of design guidance
Plenty of these….
Manufacturers
Web-based style guides e.g Yale Style Manual
List of style guides