©ravichandranuser interface slide 1 user interface design
TRANSCRIPT
©Ravichandran User interface Slide 2
Objectives
To understand what is an User Interface To explain different types of User interface
and its advantages and disadvantages To explain the principal activities in the user
interface design process
©Ravichandran User interface Slide 4
What is an User Interface
It is a means of communication between the user and the computer
©Ravichandran User interface Slide 5
The user interface
User interfaces should be designed to match the skills, experience and expectations of its anticipated users.
System users often judge a system by its interface rather than its functionality.
A poorly designed interface can cause a user to make catastrophic errors.
Poor user interface design is the reason why so many software systems are never used.
©Ravichandran User interface Slide 6
Human factors in interface design
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.
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.
People are different• People have a wide range of physical capabilities. Designers
should not just design for their own capabilities. People have different interaction preferences
• Some like pictures, some like text.
©Ravichandran User interface Slide 7
UI design principles
UI design must take account of the needs, experience and capabilities of the system users.
Designers should be aware of people’s physical and mental limitations (e.g. limited short-term memory) and should recognise that people make mistakes.
UI design principles underlie interface designs although not all principles are applicable to all designs.
©Ravichandran User interface Slide 8
User interface design principles
Principle Description
User familiarity The interface should use terms and concepts which are drawnfrom the experience of the people who will make most use of thesystem.
Consistency The interface should be consistent in that, wherever possible,comparable operations should be activated in the same way.
Minimal surprise Users should never be surprised by the behaviour of a system.
Recoverability The interface should include mechanisms to allow users torecover from errors.
User guidance The interface should provide meaningful feedback when errorsoccur and provide context-sensitive user help facilities.
User diversity The interface should provide appropriate interaction facilities fordifferent types of system user.
©Ravichandran User interface Slide 9
Interaction styles
Interaction style
Main advantages Main disadvantages Application examples
GUI Fast and intuitive interaction Easy to learn
May be hard to implement. Only suitable where there is a visual metaphor for tasks and objects.
Video games CAD systems
Menu selection
Avoids user error Little typing required
Slow for experienced users. Can become complex if many menu options.
Most general-purpose systems
Form based Simple data entry Easy to learn Checkable
Takes up a lot of screen space. Causes problems where user options do not match the form fields.
Stock control, Personal loan processing
Command language
Powerful and flexible Hard to learn. Poor error management.Only meant for technical users.
Only Operating systems, Command and control systems
Natural language
Accessible to casual users Easily extended
Requires more typing. Natural language understanding systems are unreliable.
Information retrieval systems
©Ravichandran User interface Slide 10
Colour displays
Colour adds an extra dimension to an interface and can help the user understand complex information structures.
Colour can be used to highlight exceptional events.
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.
©Ravichandran User interface Slide 11
Colour use guidelines
Limit the number of colours used and be conservative in their use.
Use colour change to show a change in system status.
Use colour coding to support the task that users are trying to perform.
Use colour coding in a thoughtful and consistent way.
Be careful about colour pairings.
©Ravichandran User interface Slide 12
Error messages
Error message design is critically important. Poor error messages can mean that a user rejects rather than accepts a system.
Messages should be polite, concise, consistent and constructive.
The background and experience of users should be the determining factor in message design.
©Ravichandran User interface Slide 13
User error
Assume that a nurse misspells the name of a patient whose records he is trying to retrieve.
Please type the patient’s name in the box then click on OK
MacDonald, R.
OK Cancel
Patient’s name
In the box and click ok
©Ravichandran User interface Slide 14
Good and bad message design
Error #27
Invalid patient id
OK Cancel
System-oriented error messageUser-oriented error message
Name not in listClick on Patients for a list of patientsClick on Retry to re-input the patient’s nameClick on Help for more information
Patients Help Retry Cancel
Bad message design Good message design
©Ravichandran User interface Slide 15
The User interface design process
User interface design is an iterative process involving close liaisons between users and designers.
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.
©Ravichandran User interface Slide 16
The design process
Executableprototype
Designprototype
Produce paper-based design
prototype
Producedynamic design
prototype
Evaluate designwith end-users
Implementfinal userinterface
Evaluate designwith end-users
Analyse andunderstand
user activities
©Ravichandran User interface Slide 17
Types of User Interface
There are different types of User Interface
1) Graphical User Interface (GUI)2) Menu User Interface3) Form based User Interface4) Command Line User Interface5) Natural Language Processing UI
©Ravichandran User interface Slide 18
Graphical user interfaces
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.
©Ravichandran User interface Slide 20
GUI characteristics
Characteristic DescriptionWindows Multiple windows allow different information to be
displayed simultaneously on the user’s screen.Icons Icons different types of information. On some systems,
icons represent files; on others, icons representprocesses.
Menus Commands are selected from a menu rather than typedin a command language.
Pointing A pointing device such as a mouse is used for selectingchoices from a menu or indicating items of interest in awindow.
Graphics Graphical elements can be mixed with text on the samedisplay.
©Ravichandran User 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
©Ravichandran User interface Slide 22
Menu systems
Users make a selection from a list of possibilities presented to them by the system
The selection may be made by pointing and clicking with a mouse, using cursor keys or by typing the name of the selection
May make use of simple-to-use terminals such as touchscreens
©Ravichandran User interface Slide 24
Advantages of menu systems
Users need not remember command names as they are always presented with a list of valid commands
Typing effort is minimal User errors are trapped by the interface Context-dependent help can be provided.
The user’s context is indicated by the current menu selection
©Ravichandran User interface Slide 25
Problems with menu systems
Actions which involve logical conjunction (and) or disjunction (or) are awkward to represent
Menu systems are best suited to presenting a small number of choices. If there are many choices, some menu structuring facility must be used
Experienced users find menus slower than command language
©Ravichandran User interface Slide 26
Form-based interface This type of user interface is where an operator is
inputting information while asking a customer questions over the telephone.
Prompts the operator to ask all the questions. Makes the user input the information in the
correct order and in correct format. 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.
©Ravichandran User interface Slide 27
Example for Form-based interface
Title
Author
Publisher
Edition
Classification
Date ofpurchase
ISBN
Price
Publicationdate
Number ofcopies
Loanstatus
Orderstatus
NEW BOOK
©Ravichandran User interface Slide 28
Command interfaces Command line interfaces are one where the user
types series of commands at the keyboard which tell the computer what their intentions are.
The user should know previously all the commands which are available.
This user interface restrict the options that the user has available to them as it is mainly mean t for computer literate people.
©Ravichandran User interface Slide 29
Problems faced in Command line interfaces
Users have to learn and remember a command language. Command interfaces are therefore
unsuitable for occasional users Users make errors in command. An error
detection and recovery system is required System interaction is through a keyboard so
typing ability is required
©Ravichandran User interface Slide 30
Command languages
Often preferred by experienced users because they allow for faster interaction with the system
Not suitable for casual or inexperienced users
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
©Ravichandran User interface Slide 31
Example for Command line user interface
Turbo Pascal Version 7.0 Copyright (c) 1983,92 Borland InternationalType EXIT to return to Turbo Pascal...Microsoft(R) Windows DOS(C)Copyright Microsoft Corp 1990-2001. C:\TP\BIN> copy ravi.txt c:\
©Ravichandran User interface Slide 32
Natural language interfaces
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)
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