1. 1 Overview of User-Centred Design John T Burns School of Computing (chapter 1: McCracken and Wolfe – User Centred Web Development)

2. 2 Acknowledgements The majority of slides have been produced by Daniel D. McCracken (City College of New York) and Rosalee J. Wolfe (DePaul University) to accompany their book User-Centered Website Development (Pearson Prentice Hall, 2003) These have been edited to provide a European context for the examples used.

3. 3 1.2 Benefits of Usable Web sites Gaining a competitive edge Reducing development and maintenance costs Improving productivity Lowering support costs

4. 4 Gaining a competitive edge… Conversion rate is the percentage of visitors who take an action you want them to take, such a making a purchase Increasing the conversion rate lowers the cost of individual sales Ease of use is the most important driver of high conversion rates

5. 5 Reducing development and maintenance costs Learn about users first, and you will avoid –Implementing features users don’t want –Creating features that are annoying or inefficient –High cost of making changes late in the development cycle

6. 6 Improving productivity For e-commerce, productivity means that users find what they want—and succeed in buying it For a company intranet, productivity means employees become more efficient

7. 7 Lower support costs Calls to customer support are very expensive for the vendor: estimates range from $12 to $250 per call Responding to customer support calls can take a long time and can lead to major frustration on the part of users A website that reduces the need for support calls can save a lot of money and customer goodwill.

8. 8 Low resolution screen

9. 9 High resolution screen

10. 10 A major cost shift 50 years ago the cost of a computer would pay the salaries of 200 programmers for a year –People were expected to work hard to save computer time Today the salary of one programmer for a year will buy 200 computers—each vastly more powerful than the early machines –Now the goal is to make computers easy to use, to save people time

11. 11 Examples of interactive computing systems Single PC - capable of displaying web pages Embedded devices, for example in cars and in cell phones Handheld Global Positioning Systems for outdoor activities Software that allows collaboration – we need to consider how computer systems support several (many) people working together

12. 12 1.4 Goals of HCI To develop or improve the Safety Utility Effectiveness Efficiency Usability Appeal... of systems that include computers

13. 13 Safety Safety of Users—think of –Air traffic control –Hospital intensive care –Means reducing the probability of human error when using a system Safety of Data—think of –Protection of files from tampering –Privacy and security

14. 14 Utility and effectiveness Utility: how useful a system is –what services a system provides; examples: Information Instruction Purchases Effectiveness: whether the user can accomplish what they want do (i.e. achieve goals) - examples: –Find whether the library holds a particular book –Find the times of trains tomorrow afternoon from Leicester to Reading

15. 15 Efficiency A measure of how much effort it takes for users to accomplish their goals or finish their work using the system So a system may be effective (a user eventually manages to list all train times from Leicester) but if it takes a long time, or the user makes a number of mistakes before doing so, then the system is inefficient Usable systems need to be both effective and efficient

16. 16 Usability degree to which specified users can achieve specified goals in a particular environment with effectiveness, efficiency and satisfaction Which of these is most important depends on the actual system –May be ease of first time use (information kiosk in a shopping mall) –May be efficiency of use after a period of training (supermarket checkout system)

17. 17 Appeal/satisfaction How well users like using the system –First impressions –Long-term satisfaction Whether the user’s experience and impression of using the system is positive (or not) Also refers to whether the user thinks the interface looks appealing Important that the impression of the appearance of the system is positive

18. 18 1.5 User-Centered Development Methodology User-centric, not data-centric –Involves users in the design process –Usability can be quantified and measured Highly Iterative –Involves testing and revision Interdisciplinary, building on a dozen different disciplines –including computer science, ergonomics, graphics design, psychology, sociology

19. 19

20. 20 User centric vs. data centric Look at this parking sign from the centre of Leicester.. What do each of the numbers mean? If these are spaces, what would you expect to happen to the numbers if you watch the sign for 15 seconds or more? What does ‘Open’ mean? (are the others ‘Not Open’?) Where is ‘North Zone’ – where does it start? What information does the user (driver) need from this sign, glancing at it as they drive past?

21. 21 The stages of user-centered development Needs analysis User and task analysis Functional analysis Requirements analysis Setting usability specifications Design Prototyping Evaluation

22. 22 Needs analysis Summarizes the nature and purpose of the system –Type of system (website, video game, spreadsheet) –People it will serve –Benefits it will provide Define what counts as success –You won’t know if your site is successful unless you know what ‘success’ means in the context of your application or site –If you don’t know where you are going, you won’t know when you’ve got there.

23. 23 User and task analysis User analysis - characterizes the people who will use the site: –General considerations (age, education, experience with computers) Task analysis - what users will do –User’s goals - what they want to accomplish –Tasks or activities carried out to achieve the goals See Chapter 3

24. 24 Functional analysis Functionality or computer services that users will need and what will be automated –Close correspondence between functions and tasks Examples: travel site task: “find all flights to xyz, ordered by price” –Needs search function and sorting capability Music CD site: task “buy a CD” –Needs secure on-line transaction functionality

25. 25 Requirements analysis Describes the formal specifications required to implement the system: –Data dictionaries –Entity-relationship diagrams –Object oriented modeling Similar to software engineering

26. 26 Setting usability specifications We need to specify usability objectives in a measurable form so that we can test whether or not these have been met Usability becomes another system specification, rather than a loose statement of intent Performance measures (such as number of tasks completed, number of errors, etc.) Preference measures (such as first impression, overall satisfaction) using rating scales

27. 27 Design Organization –Visual organization to create clarity and consistency –Layout Appearance –“Look and feel” Now you can begin to sketch layout of pages— because you know your users and what they want to do See Chapters 4, 5, and 6

28. 28 Prototyping Greek “proto” = first Prototype is an original model or pattern –Global: entire site –Local: selected parts of the site Prototypes –Evolutionary: becomes the final project –Throw-away: serves as a pattern –High fidelity: resembles final product –Low fidelity: just rough sketch - not close to final See Chapter 7

29. 29 A low-fidelity prototype

30. 30 A high-fidelity prototype

31. 31 Evaluation Expert-based evaluation –Bring in a usability expert –Different methods or techniques for this User-based evaluation –Test the website or other interface with users –Involves user trials where the behaviour of users is observed and recorded See Chapter 8

32. 32 1.6 Characteristics of User-Centered Development Highly iterative DESIGN PROTOTYPE EVALUATE READY TO IMPLEMENT MEET USER SPECIFICATIONS? NO YES

33. 33 Summary In this chapter you have learned that a user- centered design methodology: Is industry-proven Lets you build websites or other interfaces that meet user expectations Leads to cost-effective and timely implementation Is highly interactive