Introduction to Information

Systems

LECTURE 9
Usability

INSEARCH CRICOS provider code: 00859D I UTS CRICOS provider code: 00099F Insearch Limited is a controlled entity of the University of Technology Sydney (UTS), and a registered private higher education provider of pathways to UTS.
 Learning Objectives
At the end of the lecture, you should be able to:

 Explain what interface is and why it is important

 Design more effective user interfaces by

following guidelines given

 Practise usability evaluation of prototypes to

uncover significant usability problems and
suggest ways to improve

2
 Topics

 Importance of User Interface

 Usability

 Designing Forms and Reports

3
 User Interface
A method by which users interact with information
system.

(The "look and feel" of an application or system, the portion

that determines how the user interacts with the system)

The primary goal of a user interface is to help interface

designers to create applications that increase user
effectiveness and satisfaction.

4
 The Importance of User Interface
 Efficiency and Productivity

 Health and Safety

Human-Computer Interaction (HCI) is about designing

computer systems that support people so that they can
carry out their tasks productively and safely.

5
 Interaction Methods and Devices
The two basic elements of all human-computer
interfaces are:
 Interaction methods/styles
 Hardware devices

When designing user interfaces, the most fundamental

decision relates to the methods used to interact with the
system. Consideration then goes to the use of hardware
devices that support the interaction.

6
 Interaction Methods and Devices
What interaction method is this?

What hardware device is used to support this type of interaction? 7

 Interaction Methods and Devices
What interaction method is this?

What hardware device is used to support this type of interaction? 8

 Interaction Methods and Devices
What interaction method is this?

What hardware device is used to support this type of interaction? 9

 Interaction Methods and Devices

Interaction methods/style
 GUI – Graphical User Interface
 Command based
 Form interaction
 Menu interaction

Hardware devices
 Mouse
 Keyboard
 Touch screen

10
 User Interface Design Tips, Techniques,
and Principle
 A fundamental reality of application development is that
the user interface is the system to the users.
 What users want is for developers to build applications
that meet their needs and that are easy to use.
 Too many developers think that they are artistic geniuses - they do not
bother to follow user interface design standards or invest the effort to
make their applications usable, instead they mistakenly believe that the
important thing is to make the code clever or to use a really interesting
color scheme.
 Constantine points out that the reality is that a good user interface
allows people who understand the problem domain to work with the
application without having to read the manuals or receive training.

http://www.ambysoft.com/essays/userInterfaceDesign.html?
msclkid=124ad45dca9d11ec9423fd21ad252b5d 11
User interface design important for several reasons.
 First of all the more intuitive the user interface the easier it is to use,
and the easier it is to use and the less expensive to use it.
 The better the user interface the easier it is to train people to use it,
reducing your training costs.
 The better your user interface the less help people will need to use
it, reducing your support costs.
 The better your user interface the more your users will like to use it,
increasing their satisfaction with the work that you have done.

12
1. Tips and Techniques
1. Consistency, consistency, consistency. I believe the most important
thing you can possibly do is ensure your user interface works consistently. If
you can double-click on items in one list and have something happen, then
you should be able to double-click on items in any other list and have the
same sort of thing happen. Put your buttons in consistent places on all your
windows, use the same wording in labels and messages, and use a
consistent color scheme throughout. Consistency in your user interface
enables your users to build an accurate mental model of the way it works,
and accurate mental models lead to lower training and support costs.

2. Set standards and stick to them. The only way you can ensure
consistency within your application is to set user interface design standards,
and then stick to them. You should follow Agile Modeling (AM)'s
Apply Modeling Standards practice in all aspects of software development,
including user interface design.

13
1. Tips and Techniques
3. Be prepared to hold the line. When you are developing the user interface
for your system you will discover that your stakeholders often have some
unusual ideas as to how the user interface should be developed. You should
definitely listen to these ideas but you also need to make your stakeholders
aware of your corporate UI standards and the need to conform to them.
4. Explain the rules. Your users need to know how to work with the
application you built for them. When an application works consistently, it
means you only have to explain the rules once. This is a lot easier than
explaining in detail exactly how to use each feature in an application step-
by-step.
5. Navigation between major user interface items is important. If it is
difficult to get from one screen to another, then your users will quickly
become frustrated and give up. When the flow between screens matches
the flow of the work the user is trying to accomplish, then your application
will make sense to your users. Because different users work in different
ways, your system needs to be flexible enough to support their various
approaches. User interface-flow diagrams should optionally be developed to
further your understanding of the flow of your user interface.

14
1. Tips and Techniques
6. Navigation within a screen is important. In Western societies, people
read left to right and top to bottom. Because people are used to this, should
you design screens that are also organized left to right and top to bottom
when designing a user interface for people from this culture? You want to
organize navigation between widgets on your screen in a manner users will
find familiar to them.
7. Word your messages and labels effectively. The text you display on your
screens is a primary source of information for your users. If your text is
worded poorly, then your interface will be perceived poorly by your users.
Using full words and sentences, as opposed to abbreviations and codes,
makes your text easier to understand. Your messages should be worded
positively, imply that the user is in control, and provide insight into how to
use the application properly.

15
 For example, which message do you find more appealing
 "You have input the wrong information" or
 "An account number should be eight digits in length.

 " Furthermore, your messages should be worded consistently and

displayed in a consistent place on the screen.
 Although the messages "The person's first name must be input" and "An account
number should be input" are separately worded well, together they are
inconsistent.
 In light of the first message, a better wording of the second
message would be "The account number must be input" to make
the two messages consistent.

16
1. Tips and Techniques

8. Understand the UI widgets. You should use the right widget for the right
task, helping to increase the consistency in your application and probably
making it easier to build the application in the first place. The only way you
can learn how to use widgets properly is to read and understand the user-
interface standards and guidelines your organization has adopted.

9. Look at other applications with a grain of salt. Unless you know another
application has been verified to follow the user interface-standards and
guidelines of your organization, don't assume the application is doing things
right. Although looking at the work of others to get ideas is always a good
idea, until you know how to distinguish between good user interface design
and bad user interface design, you must be careful. Too many developers
make the mistake of imitating the user interface of poorly designed software.

17
1. Tips and Techniques

10. Use color appropriately. Color should be used sparingly in your

applications and, if you do use it, you must also use a secondary indicator.
The problem is that some of your users may be color blind and if you are
using color to highlight something on a screen, then you need to do
something else to make it stand out if you want these people to notice it.
You also want to use colors in your application consistently, so you have a
common look and feel throughout your application.

11. Follow the contrast rule. If you are going to use color in your application,
you need to ensure that your screens are still readable. The best way to do
this is to follow the contrast rule: Use dark text on light backgrounds and
light text on dark backgrounds. Reading blue text on a white background is
easy, but reading blue text on a red background is difficult. The problem is
not enough contrast exists between blue and red to make it easy to read,
whereas there is a lot of contrast between blue and white.
18
1. Tips and Techniques

12. Align fields effectively. When a screen has more than one editing field,
you want to organize the fields in a way that is both visually appealing and
efficient. I have always found the best way to do so is to left-justify edit
fields: in other words, make the left-hand side of each edit field line up in a
straight line, one over the other. The corresponding labels should be right-
justified and placed immediately beside the field. This is a clean and efficient
way to organize the fields on a screen.

13. Expect your users to make mistakes. How many times have you
accidentally deleted some text in one of your files or deleted the file itself?
Were you able to recover from these mistakes or were you forced to redo
hours, or even days, of work? The reality is that to err is human, so you
should design your user interface to recover from mistakes made by your
users.

19
1. Tips and Techniques

14. Justify data appropriately. For columns of data, common practice is to

right-justify integers, decimal align floating-point numbers, and to left-justify
strings.

15. Your design should be intuitable. In other words, if your users don't know
how to use your software, they should be able to determine how to use it by
making educated guesses. Even when the guesses are wrong, your system
should provide reasonable results from which your users can readily
understand and ideally learn.

16. Don't create busy user interfaces. Crowded screens are difficult to
understand and, hence, are difficult to use. Experimental results show that
the overall density of the screen should not exceed 40 percent, whereas
local density within groupings should not exceed 62 percent.

20
1. Tips and Techniques

17. Group things effectively. Items that are logically connected should be
grouped together on the screen to communicate they are connected,
whereas items that have nothing to do with each other should be separated.
You can use white space between collections of items to group them and/or
you can put boxes around them to accomplish the same thing.

18. Take an evolutionary approach. Techniques such as

user interface prototyping and Agile Model Driven Development (AMDD) are
critical to your success as a developer.

21
2. UI Design Principles
1. The structure principle. Your design should organize the user interface
purposefully, in meaningful and useful ways based on clear, consistent
models that are apparent and recognizable to users, putting related things
together and separating unrelated things, differentiating dissimilar things
and making similar things resemble one another. The structure principle is
concerned with your overall user interface architecture.

2. The simplicity principle. Your design should make simple, common tasks
simple to do, communicating clearly and simply in the user's own language,
and providing good shortcuts that are meaningfully related to longer
procedures.

3. The visibility principle. Your design should keep all needed options and
materials for a given task visible without distracting the user with extraneous
or redundant information. Good designs don't overwhelm users with too
many alternatives or confuse them with unneeded information.

22
2. UI Design Principles
4. The feedback principle. Your design should keep users informed of actions
or interpretations, changes of state or condition, and errors or exceptions
that are relevant and of interest to the user through clear, concise, and
unambiguous language familiar to users.

5. The tolerance principle. Your design should be flexible and tolerant,

reducing the cost of mistakes and misuse by allowing undoing and redoing,
while also preventing errors wherever possible by tolerating varied inputs
and sequences and by interpreting all reasonable actions reasonable.

6. The reuse principle. Your design should reuse internal and external
components and behaviors, maintaining consistency with purpose rather
than merely arbitrary consistency, thus reducing the need for users to
rethink and remember.

23
3. Concluding Remarks
 The user interface of an application will often make or break it. Although the
functionality that an application provides to users is important, the way in
which it provides that functionality is just as important. An application that is
difficult to use won't be used. Period. It won't matter how technically superior
your software is or what functionality it provides, if your users don't like it
they simply won't use it. Don't underestimate the value of user interface
design nor of usability.
 Effective developers find ways to work closely with their stakeholders. I'm a
firm believer in the AM practice Active Stakeholder Participation where your
stakeholders do much of the business-related modeling using
inclusive modeling techniques. Furthermore, they should be involved with
your user interface prototyping efforts as well.

24
 Usability
Usability is the analysis of how well a system’s
ability to support the user’s activities or tasks.

(i.e. is the program/system doing the task in the best way

possible ?)

 Usability is concerned with making systems safe, easy to

learn and easy to use.

 Usability is about creating effective user interfaces.

25
 Usability Factors
Speed of performance
How efficient is the system

Rate of errors
How many mistakes are made by users while performing tasks
Time to learn
How easy / how much work is needed to learn the system
Retention over time
How easy to remember the learnt skills
Conform to user requirements
How pleased the users are with the system

26
 Designing Forms and Reports
Systems inputs and outputs design(Forms and Reports
design) is a key ingredient for any successful system.

During the process of designing forms and reports, several

questions must be answered :
1. Who will use the form or report?

2. What is the purpose of the forms or report?

3. When is the form or report needed and used?

4. Where does the form or report need to be delivered or used?

5. How many people need to use or view the form or report?

27
 Designing Forms and Reports

Example: Questions Answers

Fundamental questions
Who will use the report? All store managers and sales
and answers to the representatives
design of the Customer
Reservation Report What is the purpose of the To provide a list of
report? customers with
reservations

Matching customer order

with inventory

When is the report needed Needed after product

and used? delivery
Where does the report need To all stores
to be delivered?
How many people need to The store manager and
view the report? several sales 28
representatives at each of
 Designing Forms and Reports
General Guidelines for Designing Forms and Reports
 Meaningful Titles
Clear and specific titles describing content
 Useful Information
Only needed information should be displayed
 Layout
Information should be balanced on the screen
 Instruction or Formatting Information
Input- Clear instructions on how the form should be filled out.
Output - Formatting enhances output or draws attention to information
 Easy Navigation
Clearly show how to move forward and backward etc.
29
 Designing Forms and Reports
Note:
All screens should include at least the followings:

 Company name and logo

 Name of the system
 Screen title
 Instructions – for input forms
 Date / page number / report title – for output

30
Usability Evaluation – sample interface

31
Usability Evaluation – sample interface

32
Usability Evaluation – sample interface

33
Usability Evaluation - Report

34
Sample interface – Main menu

35
Sample interface – Input screen

36
Sample interface – Output screen

37
 Assignment 2 -Interface Design

Design 3 screens:
1. Main menu
2. Input screen
3. Output screen

38
 Usability Videos
Graphic User Interface and Command Line Interface
https://youtu.be/qsX32Sh4DEA?t=3

What is User Interface Design and Why It Matters?

www.youtube.com/watch?v=_dxy7Uhw66U

The future of user interface

https://youtu.be/b8pTqhfbo40?t=135

39
 Exercise

Summarise your learnings from the above

usability videos.

40
 References
 Haag, S. & Cummings, M. 2013, Management Information Systems for the
Information Age, 9th ed., McGraw Hill Irwin, New York. Chapter 6.

 Kendall, K. E. & Kendall, J. E. 2014, System Analysis and Design, 9th ed.,
Person, New Jersy. Chapter 11, 12, 14.

 Stair, R. M. & Reynolds, G. W. 2016, Fundamentals of Information Systems,

8th ed., CENGAGE Learning, Boston. Chapter 8.