1. 1 CS 501 Spring 2003 CS 501: Software Engineering Lecture 13 Usability 1

2. 2 CS 501 Spring 2003 Administration

3. 3 CS 501 Spring 2003 Quiz 2, Question 1(b) A bank has many small branches. The bank is developing a new computer system to be used at all its branches. It will be used by the staff who serve customers directly, by the office staff at each branch, and by the staff at the head office. You are a member of a team that is developing the requirements for this system. (b) List four possible non-functional requirements that might be important for this application. (Be specific. General answers, such as, "the system must be reliable", are not adequate.)

4. 4 CS 501 Spring 2003 Non-Functional Requirements (From Lecture 8) Product requirements performance, reliability, portability, etc... Organizational requirements delivery, training, standards, etc... External requirements legal, interoperability, etc... Requirements about the context in which the system is built: documentation and training, resources, security, physical environment, quality assurance

5. 5 CS 501 Spring 2003 Quiz 2, Question 1(b) continued 1. When head office computers are unavailable, counter staff at branch offices must be able to cash checks for local customers. Not: "The system must be reliable." 2. Interactive training materials are required such that a junior clerk, who is employed at a branch back office, can learn how to use the system in one day working independently. 3. There is a computer center at the head office with 7x24 operator coverage. There are no computer staff located at the branch offices. 4. The worst case for a counter transaction must be 10 seconds from when the transaction is submitted to first response.

6. 6 CS 501 Spring 2003 Required Reading Required Reading: Mitchell Kapor, A Software Design Manifesto. Dr. Dobbs Journal, 1991. http://hci.stanford.edu/bds/1-kapor.html "Software design is not the same as user interface design." "Architects, not construction engineers, are the professionals who have overall responsibility for creating buildings.... in the actual process of designing and implementing the building, the engineers take direction from the architects."

7. 7 CS 501 Spring 2003 What is Design? Design is conscious Design keeps human concerns in the center Design is a dialog with materials Design is creative Design is communication Design has social consequences Design is a social activity Terry Winograd Bringing Design to Software, 1996

8. 8 CS 501 Spring 2003 Progress? Examples of change: 1990 to 2003

9. 9 CS 501 Spring 2003 1990

10. 10 CS 501 Spring 2003 1995

11. 11 CS 501 Spring 2003 2003

12. 12 CS 501 Spring 2003 1995

13. 13 CS 501 Spring 2003 2003

14. 14 CS 501 Spring 2003 1995

15. 15 CS 501 Spring 2003 2003

16. 16 CS 501 Spring 2003 1995

17. 17 CS 501 Spring 2003 2003

18. 18 CS 501 Spring 2003 The Design/Evaluate Loop Evaluate ? Design Build Analyze requirements

19. 19 CS 501 Spring 2003 Design for Usability Usability of a computer system is a combination of factors: User interface design Functionality Performance Help systems and documentation Freedom from errors Anything else?

20. 20 CS 501 Spring 2003 Elements of an Interface metaphors: terms, images, concepts that can be learned mental model: organization and representation of data, functions, tasks and roles navigation rules: how to move among data functions, activities and roles look: characteristics of the appearance that convey information feel: interaction techniques that provide an appealing experience Marcus (1993)

21. 21 CS 501 Spring 2003 Levels of Usability interface design functional design data and metadata computer systems and networks conceptual model

22. 22 CS 501 Spring 2003 The Conceptual Model The conceptual model is the user's internal model of what the system provides: The desk top metaphor -- files and folders The web model -- click on hyperlinks The library model -- search and retrieve The form filling model -- fill form, submit Example: The Mercury page turner

23. 23 CS 501 Spring 2003 Interface Design The interface design is the appearance on the screen and the actual manipulation by the user (look and feel) Fonts, colors, logos, key board controls, menus, buttons Mouse control or keyboard control? Conventions (e.g., "back", "help") Example: Screen space utilization in the Mercury page turner

24. 24 CS 501 Spring 2003 Principles of Interface Design Interface design is partly an art; there are general principles: Consistency -- in appearance, controls, and function. Feedback -- what is the computer system is doing? why does the user see certain results? Users should be able to interrupt or reverse actions Error handling should be simple and easy to comprehend Skilled users offered shortcuts; beginners have simple, well-defined options The user should feel in control

25. 25 CS 501 Spring 2003 Disabilities What if the user: is visually impaired or color blind? does not speak English? is a poor typist? There is a tradition of blind programmers Navigation of web sites need not be only visual You may have a legal requirement to support people with disabilities

26. 26 CS 501 Spring 2003 Functional Design The functional design, determines the functions that are offered to the user Selection of parts of a digital object Searching a list or sorting the results Help information Manipulation of objects on a screen Pan or zoom

27. 27 CS 501 Spring 2003 Same Functions, Different Interface Example: The desk top metaphor Mouse -- 1 button (Macintosh), 2 button (Windows) or 3 button (Unix) Close button -- left of window (Macintosh) right of window (Windows)

28. 28 CS 501 Spring 2003 Data and Metadata Data and metadata stored by the computer system enable the functions and the interface The desktop metaphor has the concept of associating a file with an application. This requires a file type to be stored with each file: -- extension to filename (Windows and Unix) -- resource fork (Macintosh) Data validation often requires that a user interface has access to a database (e.g., names and addresses)

29. 29 CS 501 Spring 2003 Computer Systems and Networks The performance, reliability and predictability of computer systems and networks is crucial to usability Response time instantaneous for mouse tracking and echo of key stroke 5 seconds for simple transactions Example: Pipelined algorithm for the Mercury page turner Quality of Service for real time information

30. 30 CS 501 Spring 2003 Design Tensions in Networked Systems Client computers and network connections vary greatly in capacity Client software may run on various operating systems; it may be current or an earlier version System designers wish to control clients; users wish to configure their own environments

31. 31 CS 501 Spring 2003 User Interfaces: Iterative Design Requirements Design Implementation (prototype) Evaluation