1. Object-Oriented Software Engineering Practical Software Development using UML and Java Chapter 7: Focusing on Users and Their Tasks Use Cases and User Interfaces (slides modified by Allen Tucker)

2. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks2 7.1 User Centered Design Software design should focus on the needs of users. Design software based on an understanding of the users’ tasks Ensure users are involved in the design processes Design the user interface following guidelines for good usability Have users work with prototypes Obtain user feedback about GUI functioning and on-line help

3. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks3 7.3 Developing Use-Case Models of Systems Use case analysis describes typical sequences of actions that users perform while completing given tasks A use case model consists of —a set of use cases —a diagram showing how they are related A use case includes only actor-computer interactions. —Not actor-actor interactions —Not internal computations of the system A use case should be as independent as possible from any particular user interface design.

4. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks4 Use case diagrams Register in Course Add Course Add Course Offering Student Find information about course Instructor Registrar Enter Grade for Course

5. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks5 UML Use Case Diagrams in Eclipse

6. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks6 An Eclipse Use Case Diagram (see workspace260/Registration)

7. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks7 Use case diagrams: Extensions, Generalizations and Inclusions 1.Extensions make optional interactions explicit and handle exceptional cases. —By making separate extensions, the basic use case remains simple. 2.Generalizations represent several similar use cases. —Much like a superclass in a class definition. 3.Inclusions allow one to express commonality between several different use cases. —Enable avoiding repetition in multiple use cases. —Much like instance variables in a class definition.

8. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks8 Example of extension, generalization, and inclusion

9. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks9 How to describe a use case Name: A short, descriptive identifier for the use case. Actors: People who can perform this use case. Goals: What are the actors trying to achieve? Preconditions: State of the system before the use case. Postconditions: State of the system after the use case. Related use cases. Where does this use case fit in the system? Description: a short and precise summary of the events. Steps: What actions occur and in what order?

10. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks10 Example Use Case (addACourse) Name - addACourse Actors - any student Goals - to add a course to his/her course record Preconditions - 1.Courses, course record, and transcript are available for viewing 2.transcript satisfies course’s prerequisites 3.course record is not already full 4.course record does not already contain the course to be added 5.course’s time slot does not conflict with the course record 6.course is not already filled to capacity Postconditions - Either 1-6 are satisfied, and the student is added to the course and the course is added to the course record, or 1-5 are satisfied (but not 6), and the student is added to the course’s waiting list, or else no changes occur for the course or the course record. The student is notified about the outcome.

11. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks11 Example Use Case (addACourse continued) Related Use Cases - registerInCourses, viewMyCourses, viewCourseOfferings, viewATranscript Description - a student has logged into the registration server and has obtained a class list and his/her course record. The student then selects a course to add to her course record and the system checks to be sure that the preconditions are met. If so, the system satisfies the postcondition and notifies the student that the course has been successfully added. If not, the system notifies the student that the course was not added, along with a reason (which of the preconditions was not satified). Steps - this can be described with a UML sequence diagram.

12. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks12 Another example use case

13. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks13 Another example (continued)

14. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks14 Example (continued)

15. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks15 Example (continued)

16. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks16 Example (continued)

17. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks17 The modeling processes: Choosing use cases on which to focus Often one use case (or a very small number) can be identified as central to the system —The entire system can be built around this particular use case There are other reasons for focusing on particular use cases: —Some use cases will represent a high risk because for some reason their implementation is problematic —Some use cases will have high political or commercial value

18. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks18 Use cases: benefits and drawbacks Benefits —They can help to define the scope of the system —They help plan the development process —They help develop and validate the requirements —They can be used to structure User Interfaces and On-line Help —They can guide the structuring of test cases Drawbacks —Use cases themselves must be validated —There are some aspects of software that are not covered by use case analysis. E.g., -Database design -System architecture (e.g., client-server) —Innovative solutions may be overlooked

19. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks19 7.4 Basics of User Interface Design User interface design should be done in conjunction with other software engineering activities. Use case analysis to help define the tasks that the UI must help the user perform. Do iterative UI prototyping to address the use cases. Results of prototyping will enable you to finalize the requirements.

20. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks20 Aspects of usability Learnability —The speed with which a new user can become proficient with the system. Efficiency of use —How fast an expert user can do their work. Error handling —The extent to which it prevents the user from making errors, detects errors, and helps to correct errors. Acceptability —The extent to which users like the system.

21. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks21 Some basic terminology of user interface design Dialog: A specific window with which a user can interact, but which is not the main UI window. Control or Widget: Specific component of a user interface. Affordance: The set of operations that the user can do at any given point in time. State: At any stage in the dialog, the system is displaying certain information in certain widgets, and has a certain affordance. Mode: A situation in which the UI restricts what the user can do. Modal dialog: A dialog in which the system is in a very restrictive mode. Feedback: The response from the system whenever the user does something, is called feedback. Encoding techniques. Ways of encoding information so as to communicate it to the user.

22. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks22 6.5 Twelve Usability Principles 1. Always test with real users. 2: Base designs on users’ tasks. —Use case analysis guides the UI structure. 3: Ensure that sequences of actions are simple. —Minimize the amount of reading. —Group steps on the same page (few pages). 4: Ensure that the user always knows what can be done next. —Make the most important commands stand out. 5: Provide good feedback and effective error messages. —When something goes wrong help the user to resolve the problem. 6: Ensure that the user can always exit, back up, or undo an action. —Make it easy to do.

23. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks23 Twelve Usability Principles (continued) 7: Ensure that response time is adequate. —Warn users of long delays; inform them of progress. 8: Use understandable encoding techniques. —Use labels to ensure that codes are fully understood by users. 9: Ensure that the UI’s appearance is uncluttered. —Avoid displaying too much, and organize information well. 10: Consider the needs of different groups of users. —Ensure that the system is usable by both beginners and experts. 11: Provide all necessary help. —Organize and integrate help with each task. 12. Be consistent. —Use similar layouts and graphic designs for all user tasks —Mimic other successful UIs.

24. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks24 Some UI encoding tools Text and fonts Icons Photographs Diagrams and abstract graphics Colours Grouping and bordering Spoken words Music Other sounds Animations and video Flashing

25. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks25 Example (bad UI)

26. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks26 Example (better UI)

27. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks27 7.7 Implementing a Simple GUI in Java The Abstract Window Toolkit (AWT) Component: the basic building blocks of any graphical interface. — Button, TextField, List, Label, ScrollBar. Container: contain the components constituting the GUI — Frame, Dialog and Panel LayoutManager: define the way components are laid out in a container. — GridLayout, BorderLayout

28. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks28 Example public class ClientGUI extends Frame implements ChatIF { private Button closeB = new Button("Close"); private Button openB = new Button("Open"); private Button sendB = new Button("Send"); private Button quitB = new Button("Quit"); private TextField portTxF = new TextField(""); private TextField hostTxF = new TextField(""); private TextField message = new TextField(); private Label portLB = new Label("Port: ", Label.RIGHT); private Label hostLB = new Label("Host: ", Label.RIGHT); private Label messageLB = new Label("Message: ", Label.RIGHT); private List messageList = new List();... }

29. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks29 Example public ClientGUI(String host, int port) { super("Simple Chat"); setSize(300,400); setVisible(true); setLayout(new BorderLayout(5,5)); Panel bottom = new Panel(); add("Center", messageList); add("South", bottom); bottom.setLayout(new GridLayout(5,2,5,5)) bottom.add(hostLB); bottom.add(hostTxF); bottom.add(portLB); bottom.add(portTxF); bottom.add(messageLB); bottom.add(message); bottom.add(openB); bottom.add(sendB); bottom.add(closeB); bottom.add(quitB);

30. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks30 Example sendB.addActionListener(new ActionListener() { public void actionPerformed(ActionEvent e) { send(); } }); } public void send() { try { client.sendToServer(message.getText()); } catch (Exception ex) { messageList.add(ex.toString()); messageList.makeVisible(messageList.getItemCount()-1); messageList.setBackground(Color.yellow); }

31. © Lethbridge/Laganière 2001 Chapter 7: Focusing on Users and Their Tasks31 7.8 Difficulties and Risks in UI Design Users differ widely User interface implementation technology changes rapidly User interface design and implementation can often take the majority of work in an application Developers often underestimate a GUI’s weaknesses