1. User interface design

2. The user interface
User interface design is an essential part of the overall software design process
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.

3. The user interface
A poorly designed interface can cause a user to make catastrophic errors because UI does not consider their capabilities and their environments
Poor user interface design is the reason why so many software systems are never used because Users feel that the system is not helping them to do what they should.

4. Human factors in interface design
Take physical and mental capabilities of people who use the software
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.

5. Human factors in interface design
People are different
People have a wide range of physical capabilities. Designers should not just design for their own capabilities.( some are colour blind, some better in physical manipulation see and hear better than others)
People have different interaction preferences
Some like pictures, some like text.

6. 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.
These human factors are the basis for the design principles and guidelines shown below:

7. User interface design principles

8. Design principles
User familiarity
The interface should be based on user-oriented terms and concepts (related to the user environment , it should not force the user to adapt to it) rather than computer concepts. For example, an office system should use concepts such as letters, documents, folders etc. rather than directories, file identifiers, etc.
Consistency
The system should display an appropriate level of consistency. Commands and menus should have the same format, command punctuation should be similar, etc.(this reduce user learning time because knowledge learned in one commnad is applicable to other parts)

9. Design principles Minimal surprise Recoverability
As the system is used , people build a mental model on how the system works.
If a command operates in a known way, the user should be able to predict the operation of comparable commands. But if something different happens then the user is confused. Be sure that comparable actions have comparable effects.
Recoverability
Users inevitably make mistakes
The system should provide some resilience to user errors and allow the user to recover from errors. This might include :
Undo facility : restore the system to a state before the action
Confirmation of destructive actions : is really what you want ?
Checkpoints : save state of the system at periodic intervals

10. Design principles User guidance User diversity.
User guidance
Some user guidance such as help systems, on-line manuals, etc. should be supplied
User diversity
Interaction facilities for different types of user should be supported. For example, some users have seeing difficulties and so larger text should be available. For example casual users need interfaces that provide guidance , but power users require shortcuts so that they can interact as quickly as possible

11. Design issues in UIs
Designer of a user interface is faced with some design issues to be considered when designing
Two problems must be addressed in interactive systems design
How should information from the user be provided to the computer system?(how user interaction with the system?)
How should information from the computer system be presented to the user?

12. Interaction styles Direct manipulation Menu selection Form fill-in
Command language
Natural language

13. Direct manipulation Select a command from a menu
Direct Interaction
Direct interaction with objects
Involves a device (mouse, touch screen , finger…etc).
Ex: delete a file by clicking on an icon representing that file and drag it to a trash can icon.
Menu selection
Select a command from a menu
Ex: file deletion by selecting a delete command

14. User fills in the fields of a form
Form fill-in
User fills in the fields of a form
Command language
User issue special command to the system.
Ex: delete command with filename to delete a file
Natural Language
User issues a command in natural language
Natura l command is translated into system commands
Ex: type ”delete file xxx” to delete a file
Each one has advantages and drawbacks

15. Interaction styles

16. Information presentation
Information presentation is concerned with presenting system information to system users.
The information may be presented directly
(e.g. text in a word processor)
Information may be transformed in some way for presentation
(e.g. in some graphical form).

17. Information presentation
Good Design should keep the software required for information presentation separate from from the information itself

18. Model-view-controller
The Model-View-Controller approach is a way of supporting multiple presentations of data. The user can interact with each presentation in a style that is appropriate to the presentation . Data to be displayed is encapsulated in a model object. Each model object could have a number of separated view objects associated with it. Each view has an associated controller object that handles user input and device interaction.

19. Information display factors
You should when designing UI take into account
Is the user interested in precise information or data relationships?
How quickly do information values change? Must the change be indicated immediately?
Must the user take some action in response to a change?
Is there a direct manipulation interface?
Is the information textual or numeric? Are relative values important?

20. Information presentation
Static information
Initialised at the beginning of a session. It does not change during the session.
May be either numeric or textual . (takes up less space screen but cannot be read at glance). Text if data change relatively slowly and precise info required
Dynamic information
Changes during a session and the changes must be communicated to the system user.
May be either numeric or textual.
NB : Try to distinguish static from dynamic by putting some “Static” flag.

21. Alternative information presentations
Interested in the relationship between info rather than the precise values→Graphical presentation

22. Presentation methods

23. Displaying relative values
Some presentation give the viewer some sense of the relative values
T and P have the same value but T has almost reached its max while pressure is about 25%.

24. How Colours are used in the interface?
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. But misuse of colours could lead to unattractive UI.
Common mistakes in colour use in interface design include:
The use of colour to communicate meaning; because a colour blind person may misinterpret the meaning
The over-use of colour in the display.

25. 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.

26. Error messages
System also communicate with the user through messages that give information about errors and the system state.
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.
Users start working , then make mistakes . Impossible for unexperinced/casual users to understand the system messages.
So Factors should be taken into account when designing system messages

27. Design factors in message wording

28. User error
Assume that a nurse misspells the name of a patient whose records he is trying to retrieve.

29. Good and bad message design
Bad design
Not tailored to the user skills
and experience level. No suggestion on how to solve the problem.
Better design
Positive Proposition for correcting the mistake