1. ©RavichandranUser interface Slide 1 User interface design

2. ©RavichandranUser interface Slide 2 Objectives l To understand what is an User Interface l To explain different types of User interface and its advantages and disadvantages l To explain the principal activities in the user interface design process

3. ©RavichandranUser interface Slide 3 Topics covered l Design issues l The user interface design process

4. ©RavichandranUser interface Slide 4 What is an User Interface It is a means of communication between the user and the computer

5. ©RavichandranUser interface Slide 5 The user interface l User interfaces should be designed to match the skills, experience and expectations of its anticipated users. l System users often judge a system by its interface rather than its functionality. l A poorly designed interface can cause a user to make catastrophic errors. l Poor user interface design is the reason why so many software systems are never used.

6. ©RavichandranUser interface Slide 6 Human factors in interface design l Limited short-term memory People can instantaneously remember about 7 items of information. If you present more than this, they are more liable to make mistakes. l People make mistakes When people make mistakes and systems go wrong, inappropriate alarms and messages can increase stress and hence the likelihood of more mistakes. l People are different People have a wide range of physical capabilities. Designers should not just design for their own capabilities. l People have different interaction preferences Some like pictures, some like text.

7. ©RavichandranUser interface Slide 7 UI design principles l UI design must take account of the needs, experience and capabilities of the system users. l Designers should be aware of people’s physical and mental limitations (e.g. limited short-term memory) and should recognise that people make mistakes. l UI design principles underlie interface designs although not all principles are applicable to all designs.

8. ©RavichandranUser interface Slide 8 User interface design principles

9. ©RavichandranUser interface Slide 9 Interaction styles

10. ©RavichandranUser interface Slide 10 Colour displays l Colour adds an extra dimension to an interface and can help the user understand complex information structures. l Colour can be used to highlight exceptional events. l Common mistakes in the use of colour in interface design include: The use of colour to communicate meaning; The over-use of colour in the display.

11. ©RavichandranUser interface Slide 11 Colour use guidelines l Limit the number of colours used and be conservative in their use. l Use colour change to show a change in system status. l Use colour coding to support the task that users are trying to perform. l Use colour coding in a thoughtful and consistent way. l Be careful about colour pairings.

12. ©RavichandranUser interface Slide 12 Error messages l Error message design is critically important. Poor error messages can mean that a user rejects rather than accepts a system. l Messages should be polite, concise, consistent and constructive. l The background and experience of users should be the determining factor in message design.

13. ©RavichandranUser interface Slide 13 User error l Assume that a nurse misspells the name of a patient whose records he is trying to retrieve. In the box and click ok

14. ©RavichandranUser interface Slide 14 Good and bad message design Error #27 Invalid patient id OKCancel System-oriented error message User-oriented error message Name not in list Click on Patients for a list of patients Click on Retry to re-input the patient’s name Click on Help for more information PatientsHelpRetryCancel Bad message design Good message design

15. ©RavichandranUser interface Slide 15 The User interface design process l User interface design is an iterative process involving close liaisons between users and designers. l The 3 core activities in this process are: User analysis. Understand what the users will do with the system; System prototyping. Develop a series of prototypes for experiment; Interface evaluation. Experiment with these prototypes with users before the final user interface is framed.

16. ©RavichandranUser interface Slide 16 The design process

17. ©RavichandranUser interface Slide 17 Types of User Interface There are different types of User Interface 1)Graphical User Interface (GUI) 2)Menu User Interface 3)Form based User Interface 4) Command Line User Interface 5) Natural Language Processing UI

18. ©RavichandranUser interface Slide 18 Graphical user interfaces l This User Interface mainly relies on the use of window, icon, menus and pointer (WIMP). The use is able to select his/her options by use of menus of choices and by using small pictures (icons) which represent the different options available. These choices are basically selected by the user by using the pointer device such as mouse.

19. ©RavichandranUser interface Slide 19 Graphical user interfaces

20. ©RavichandranUser interface Slide 20 GUI characteristics

21. ©RavichandranUser interface Slide 21 They are easy to learn and use. Users without experience can learn to use the system quickly. The user may switch quickly from one task to another and can interact with several different applications. Information remains visible in its own window when attention is switched. Fast, full-screen interaction is possible with immediate access to anywhere on the screen Graphical user interfaces

22. ©RavichandranUser interface Slide 22 Menu systems l Users make a selection from a list of possibilities presented to them by the system l The selection may be made by pointing and clicking with a mouse, using cursor keys or by typing the name of the selection l May make use of simple-to-use terminals such as touchscreens

23. ©RavichandranUser interface Slide 23 Example for Menu based interface

24. ©RavichandranUser interface Slide 24 Advantages of menu systems l Users need not remember command names as they are always presented with a list of valid commands l Typing effort is minimal l User errors are trapped by the interface l Context-dependent help can be provided. The user’s context is indicated by the current menu selection

25. ©RavichandranUser interface Slide 25 Problems with menu systems l Actions which involve logical conjunction (and) or disjunction (or) are awkward to represent l Menu systems are best suited to presenting a small number of choices. If there are many choices, some menu structuring facility must be used l Experienced users find menus slower than command language

26. ©RavichandranUser interface Slide 26 Form-based interface l This type of user interface is where an operator is inputting information while asking a customer questions over the telephone. l Prompts the operator to ask all the questions. l Makes the user input the information in the correct order and in correct format. l It is user-friendly as the user is able type in the specified areas in the form as the cursor moves to the next box once the current box is filled with correct data.

27. ©RavichandranUser interface Slide 27 Example for Form-based interface

28. ©RavichandranUser interface Slide 28 Command interfaces l Command line interfaces are one where the user types series of commands at the keyboard which tell the computer what their intentions are. l The user should know previously all the commands which are available. l This user interface restrict the options that the user has available to them as it is mainly mean t for computer literate people.

29. ©RavichandranUser interface Slide 29 Problems faced in Command line interfaces l Users have to learn and remember a command language. Command interfaces are therefore unsuitable for occasional users l Users make errors in command. An error detection and recovery system is required l System interaction is through a keyboard so typing ability is required

30. ©RavichandranUser interface Slide 30 Command languages l Often preferred by experienced users because they allow for faster interaction with the system l Not suitable for casual or inexperienced users l May be provided as an alternative to menu commands (keyboard shortcuts). In some cases, a command laCnguage interface and a menu-based interface are supported at the same time

31. ©RavichandranUser interface Slide 31 Example for Command line user interface Turbo Pascal Version 7.0 Copyright (c) 1983,92 Borland International Type EXIT to return to Turbo Pascal...Microsoft(R) Windows DOS (C)Copyright Microsoft Corp 1990-2001. C:\TP\BIN> copy ravi.txt c:\

32. ©RavichandranUser interface Slide 32 Natural language interfaces l The user types a command in a natural language. Generally, the vocabulary is limited and these systems are confined to specific application domains (e.g. timetable enquiries) l NL processing technology is now good enough to make these interfaces effective for casual users but experienced users find that they require too much typing

33. ©RavichandranUser interface Slide 33