First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.
-
Upload
nathan-hurst -
Category
Documents
-
view
219 -
download
1
Transcript of First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.
![Page 1: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/1.jpg)
![Page 2: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/2.jpg)
First steps to usability and User-Centred Design
Gemma RichardsonJISC programmeFebruary 2008
![Page 3: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/3.jpg)
Some familiar (and unfamiliar terms• Usability
• User Experience (UX)
• User-Centred Design (UCD)
• Human-Computer Interaction (HCI)
• Computer-Human Interaction (CHI)
![Page 4: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/4.jpg)
Waterfall developments
![Page 5: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/5.jpg)
UCD developments (Agile)
![Page 6: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/6.jpg)
Usefulness vs Usability
• USEFULNESS – The value of the system or service (over existing methods)
• USABILITY – How easy the system or service is to use
Source: Expero Inc.
![Page 7: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/7.jpg)
Development layers
Source: based on model from Expero Inc.
Audience Needs &Goals
Functionality &Usefulness
Global Navigation
DetailedInteractions
Content &Terminology
Visual Design
![Page 8: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/8.jpg)
Audience needs & goals
ASK!
![Page 9: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/9.jpg)
Audience needs & goalsOriginal bid
“There will be six study packages. It is planned that they will cover the following areas:
• The creation of the welfare state 1942-51
• De-colonisation in Africa 1954-75
• The special relationship with the United States during the mid-Cold War crisis 1959-63
• Economic crisis, the unions and government 1919-39
• Cabinet and the prosecution of global war 1914-18, 1939-45
• The permissive society: social change and government 1964-75
Each package will include a selection of up to 60 documents to highlight key issues, themes and arguments for teachers of history organising taught graduate, undergraduate and A level courses or modules.”
Study Packages SoR
“The requirement is to create a guide to the Cabinet papers for A level, undergraduate and graduate students of history and politics.
This will be done in three distinct ways
• Two A-level study packages linked to specific topics covered by the national curriculum are built around a selection of Cabinet papers. These will be linked to other resources to explain government’s role in defining and implementing policies.
• HE students benefit from a broad overview of the government’s role within 100 separate packages linked to selected Cabinet papers. Search keywords linked to each section guide them towards productive searches of the full collection.
• A separate resource section provides additional guides to assist students search the collection effectively. The resources can be browsed independently as well as providing contextual links within study packages.”
![Page 10: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/10.jpg)
Functionality & Usefulness
• Translate user need into system requirements
• Be imaginative – what is your USP
Source: www.useit.com
![Page 11: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/11.jpg)
Global Navigation
![Page 12: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/12.jpg)
Global Navigation
![Page 13: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/13.jpg)
Global Navigation
0 Homepage
6 News5 Services forprofessionals
3 Research,education...
4 Search thearchives
2 Visit Us1 About Us7 ShopOnline
1.1Welcome
1.2 Whowe are...
1.3 FOI
1.2.3 Howwe
operate
1.2.2 Whatwe do
1.2.1 Whowe are
2.1 Whyvisit us?
2.2 Planyour visit
2.3 What’son
5.1Welcome
5.2 RM
5.2.1 Intro
5.2.2Advice
5.2.3Selection
5.2.3.1Policy
5.2.3.2FAQs
0.1 ContactUs
0.2 Help 0.3 A-Z Index0.4 Sitesearch
Session 2: Example site map
![Page 14: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/14.jpg)
Detailed Interactions
![Page 15: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/15.jpg)
Detailed Interactions
![Page 16: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/16.jpg)
Content & Terminology
• Be succinct
• Write for scannability
• Use hypertext
• Be appropriate to the audience but remember Plain English!
Source: www.useit.com
![Page 17: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/17.jpg)
Content & Terminology
• British Governance in the 20th Century: Cabinet Papers 1916 - 1976
• Cabinet Papers 1916 - 1976
![Page 18: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/18.jpg)
Content & Terminology
![Page 19: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/19.jpg)
Visual Design
Source: ‘The Glass Wall’ - BBC
![Page 20: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/20.jpg)
Visual Design• Big Ben Clockface concept
The very recognisable clockface of Big Ben is set on the horizon of the background, while the cogs and sprockets of the clock fly out below, indicating looking in detail at the workings of government. The horizon line evokes the world but
also adds a sense of balance.
• Number 10 Downing Street concept
People are walking past the iconic door of 10 Downing Street in a blur, indicating not only the workings of government but the activity which goes on inside. Number 10 Downing Street is also linked to the Cabinet Papers because the
building is part of the Cabinet Office
• Typewriter concept
The word “Cabinet Papers” has been typed on an early 20th century typewriter. The overall colour is sepia, which denotes age and the history of the papers. There is also something of the newspaper reporter about the presentation.
![Page 21: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/21.jpg)
Visual Design
![Page 22: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/22.jpg)
Visual Design
Source: ‘The Glass Wall’ - BBC
![Page 23: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/23.jpg)
What is evaluation?
• Tests the usability, functionality and acceptability of an interactive system
• Laboratory vs Field
• Expert vs User
• Occurs throughout the design lifecycle
![Page 24: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/24.jpg)
Goals of evaluation
• Assess the extent and accessibility of the system’s functionality
• Assess users’ experience of the interaction
• Identify specific problems with the system
![Page 25: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/25.jpg)
Expert reviews
• Expert reviews are quick and cheap
• Can be used early, on incomplete designs and prototypes as well as on complete systems
• Does not replace user testing!
![Page 26: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/26.jpg)
Types of expert review
• Cognitive Walkthroughs
• Heuristic evaluation
![Page 27: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/27.jpg)
Heuristics
• A commonsense rule (or set of rules) intended to increase the probability of solving some problem. A rule of thumb.
![Page 28: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/28.jpg)
What you need to start
• A system or prototype
• A scenario of use
• Information about the users, their knowledge and experience
![Page 29: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/29.jpg)
Heuristic list
1. Visibility of system status
2. Match between system and the real world appear in a natural and logical order.
3. User control and freedom
4. Consistency and standards
5. Error prevention
Source: Nielsen’s 10 Heuristics – useit.com
![Page 30: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/30.jpg)
Heuristic list
6. Recognition rather than recall
7. Flexibility and efficiency of use
8. Aesthetic and minimalist design
9. Help users recognize, diagnose, and recover from errors
10.Help and documentation
Source: Nielsen’s 10 Heuristics – useit.com
![Page 31: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/31.jpg)
Cognition
• The mental process of knowing, including aspects such as awareness, perception, reasoning, and judgment
• A detailed review of a sequence of actions
Walkthrough
![Page 32: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/32.jpg)
What you need to start
• A system or prototype
• A description of the task
• A complete, list of the actions needed to complete the task successfully
• A corresponding list of the system display or response for each action
• Information about the users, their knowledge and experience
![Page 33: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/33.jpg)
Methodology
• Step through each action in the sequence
• At each action ask four questions
• Be the user not the expert!
![Page 34: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/34.jpg)
Question One:
Does the action match the user’s goal at that point?
• For example, if the effect of the action is to save a document,
is ‘saving a document’ what the user wants to do?
![Page 35: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/35.jpg)
Question Two:
Will the user see that the action is available?
• Is the button or menu item visible, or is unobvious or hidden?
![Page 36: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/36.jpg)
Question Three:
Will the user recognise the action is the one they need?
• Not to be confused with whether the action is visible. For
example, a help button may be visible but labelled with a ? –
the user may see it but not recognise it as help
![Page 37: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/37.jpg)
Question Four:
Will the user understand the feedback they receive?
• In order to successfully complete an action the user must get
sufficient feedback. For example, the page may change or a
‘waiting’ signal may appear.
![Page 38: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/38.jpg)
ExampleProgramming a video recorder by remote control
Left: handset in normal use
Right: handset after the timed record button has been pressed
Time: 21:45
Channel: 3
1 2 3
4 5 6
0987
C<
><< >>
Start:End:Channel:Date:
1 2 3
4 5 6
0987
C<
><< >>
Source: Dix et al – Human Computer Interaction
![Page 39: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/39.jpg)
Action sequence
UA1: Press the ‘timed record button’SD1: Display moves to timer mode. Flashing cursor moves to ‘start’
UA2: Press digits 1 8 0 0SD2: Each digit is displayed as typed and flashing cursor moves to next position
UA3: Press the ‘timed record’ buttonSD3: Flashing cursor moves to end
![Page 40: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/40.jpg)
Four questions for UA1 & SD1UA1: Press the ‘timed record button’
Is the effect of the action the same as the user’s goal at that
point?
YES. The timed record button initiates timer
programming. We can assume that the user would be
doing this as their first goal.
![Page 41: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/41.jpg)
Four questions for UA1 & SD1UA1: Press the ‘timed record button’
Will the user see the action is available?
YES. The timed record button is visible on the handset.
![Page 42: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/42.jpg)
Four questions for UA1 & SD1UA1: Press the ‘timed record button’
Once the user has found the correct action, will they know it
is the one they need?
NO. It is not clear which button is the ‘timed record’ button.
There is one that looks a bit like a clock but this could
change the time rather than be related to recording.
![Page 43: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/43.jpg)
Four questions for UA1 & SD1SD1: Display moves to timer mode. Flashing cursor moves
to ‘start’
After the action is taken will the user understand the
feedback?
YES. We can assume that the user would recognise the
change in display as an indication of the successful
completion of the first action.
![Page 44: First steps to usability and User-Centred Design Gemma Richardson JISC programme February 2008.](https://reader034.fdocuments.us/reader034/viewer/2022051819/5515c64555034689058b47c7/html5/thumbnails/44.jpg)
So what have we learnt about the handset design?
• NB. This is a potential problem. Further testing with the user group may show that they are able to identify the right button easily