At the end of the lesson, the students will be able to:

❑ Explain the main goals of human-computer interaction.

❑ Identify the different benefits of human-computer interaction.
❑ Recognize the importance of usability.
❑ Describe the usability attributes of HCI.
The Goals of HCI
Ensuring usability.
“A usable software system is one that supports the effective and efficient
completion of tasks in a given work context” (Karat and Dayton 1995).
The bottom-line benefits of more usable software system to business users
include:
▪ Increased productivity
▪ Decreased user training time and cost
▪ Decreased user errors
▪ Increased accuracy of data input and data interpretation
▪ Decreased need for ongoing technical support
The Goals of HCI
The bottom-line benefits of usability to development
organizations include:
▪ Greater profits due to more competitive products/services
▪ Decreased overall development and maintenance costs
▪ Decreased customer support costs
▪ More follow-on business due to satisfied customers
▪ Not to use the term ‘user-friendly’ which intended to mean a
system with high usability but always misinterpreted to mean
cleaning up the screen displays to make it more pleasing
The Goals of HCI
To achieve usability, the design of the user interface to any interactive product,
needs to take into account and be tailored around a number of factors, including:
▪ Cognitive, perceptual, and motor capabilities and constraints of people in
general.
▪ Special and unique characteristics of the intended user population in particular.
▪ Unique characteristics of the users’ physical and social work environment.
▪ Unique characteristics and requirements of the users’ tasks, which are being
supported by the software.
▪ Unique capabilities and constraints of the chosen software and/or hardware
and platform for the product.
The Goals of HCI
The goals of HCI are to produce usable and safe systems, as well as
functional systems. In order to fulfill that, developers must attempt to:
▪ Understand how people use technology.
▪ Building suitable systems.
▪ Achieve efficient, effective, and safe interaction.
▪ Put people first.
People needs, capabilities and preferences should come first.
People should not have to change the way that they use a system.
Instead, the system should be designed to match their
requirements.
What is Usability?
A usable system is:
• easy to use
• easy to learn
• easy to remember how to use
• effective to use
• efficient to use
• safe to use
• enjoyable to use
Usability Attributes of HCI
Effectiveness. It refers to how good a system, at doing what it
is supposed to do.
Learnability. It is about how much a system is easy to learn
for a new user, people wish to become familiar with the
system easily rather than spending more time on learning the
system.
Efficiency. It refers to the way a product supports users in
carrying out their tasks.
Usability Attributes of HCI
Safety. Protecting users from dangerous conditions and
undesirable situations. There are two types of dangerous
conditions.
External Conditions. Conditions that can cause danger to users
physically, or simply can be told as ergonomic factors.
Internal Conditions. Conditions that are triggered by unwanted
accidental actions of a user. Users always fear about making
mistakes and errors and how they will affect the System and lead
to severe consequences.
Usability Attributes of HCI
Memorability. This refers to how easy a system to be
remembered. It is important for the Interactive systems that
are used infrequently.
Utility. It refers to the right functionalities, a system providing
to the user to accomplish the intended task.
At the end of the lesson, the students will be able to:
❑ Analyze the importance of designing for optimum usability.
❑ Identify the variety of user interface design and interactive
solutions.
❑ Differentiate the various user interface design issues in HCI.
❑ Recognize the ten user interface design fundamentals.
How to Design for Optimum Usability?
“Designing an object to be simple and clear takes at least
twice as long as the usual way. It requires concentration at
the outset on how a clear and simple system would work,
followed by the steps required to make it come out that way-
steps which are often much harder and more complex than
the ordinary ones. It also requires a relentless pursuit of that
simplicity even when obstacles appear which would seem to
stand in the way of that simplicity.”
T. H. Nelson
The Home Computer Revolution, 1977
How to Design for Optimum Usability?
How to Design for Optimum Usability?
1. Work with a clear understanding of users' goals and show them
in the design.
2. Mimic the real-world regarding concepts, icons, and language.
3. Present instantly understandable, jargon-free messages and
actions users can take one chief action per screen.
4. Limit options to give a strong information scent on an
uncluttered display and show essential information for
completing tasks.
5. Keep content consistent.
How to Design for Optimum Usability?
6. Follow established norms regarding function and layout (logo
positioning, tappable buttons).
7. Use proper font size, color, contrast, whitespace, etc. to:
▪ combine aesthetic appeal with scanning readability,
▪ present a clear, logical information hierarchy,
▪ design for accessibility.
8. Use chunking and emphasize key information at the beginning and
end of interactive sequences.
9. Offer informative feedback about the system status.
10. Include helpful navigation systems and search functionality.
How to Design for Optimum Usability?
11. Allow for customizable controls, including
shortcuts.
12. Avoid disruptions (forced logins/pop-ups).
13. Make forms easy to complete.
14. Include warnings and autocorrect features to
minimize errors.
15. Make errors easy to diagnose.
How to Design for Optimum Usability?
16. Offer easy-to-understand help documentation.
17. Show clear contact options.
18. Provide a back button to undo actions.
19. Include ALT tags to show more information about
images.
20. Consider server abilities regarding page-loading
time and downtime.
How to Design for Optimum Usability?
21. Beware of in-app browsers and restrictions
(scrolling) in mobile design.
22. Make links active.
23. Describe links accurately.
24. Use user personas.
25. Do thorough usability testing.
Designing User Interfaces for Users
User interfaces are the access points where users interact with
designs. They come in three formats:
Graphical user
interfaces (GUIs).
Users interact with
visual representations
on digital control
panels. A computer’s
desktop is a GUI.
Designing User Interfaces for Users
User interfaces are the access points where users interact with
designs. They come in three formats:
Voice-controlled
interfaces (VUIs). Users
interact with these through
their voices. Most smart
assistants (e.g., Siri on
iPhone and Alexa on
Amazon devices) are
VUIs.
Designing User Interfaces for Users
User interfaces are the access points where users interact with
designs. They come in three formats:
Gesture-based interfaces.
Users engage with 3D
design spaces through
bodily motions (e.g., in
virtual reality (VR) games).
Innovative Product Designs
Innovative Product Designs
Innovative Product Designs
Innovative Product Designs
Innovative Product Designs
Issues in Design
Issues in Design
▪ User characteristics issue ▪ Language barrier issue
▪ User interface type and ▪ User experience issue
design issues ▪ Complexity in UI design
▪ Message construction issues ▪ Guideline issues
▪ Display graphics design ▪ Navigating the interface
issues ▪ Organizing the display
▪ Look and feel issues ▪ Interaction design issues
▪ Performance issue
Designer vs. Users
Making a photocopy

• Why this photocopier does not work? What do you think!

Designer vs. Users

Designer meant by ‘C’ = Clear People thought that ‘C’ = Copy

Designer vs. Users
Designer vs. Users
Designer vs. Users
Designer vs. Users
Designer vs. Users
Designer vs. Users
Designer vs. Users
Designer vs. Users
Designer vs. Users
Designer vs. Users
Designer vs. Users
Ten User Interface Design Fundamentals
1. Know your user
Your user’s goals are your goals, so learn them. Restate them,
repeat them. Then, learn about your user’s skills and
experience, and what they need. Find out what interfaces they
like and sit down and watch how they use them. Do not get
carried away trying to keep up with the competition by
mimicking trendy design styles or adding new features. By
focusing on your user first, you will be able to create an
interface that lets them achieve their goals.
Ten User Interface Design Fundamentals
2. Pay attention to patterns
Users spend the majority of their time on interfaces other than
your own (Facebook, MySpace, Blogger, Bank of America,
school/university, news websites, etc). There is no need to
reinvent the wheel. Those interfaces may solve some of the
same problems that users perceive within the one you are
creating. By using familiar UI patterns, you will help your users
feel at home.
Ten User Interface Design Fundamentals
3. Stay consistent
Your users need consistency. They need to know that once they
learn to do something, they will be able to do it again.
Language, layout, and design are just a few interface elements
that need consistency. A consistent interface enables your users
to have a better understanding of how things will work,
increasing their efficiency.
Ten User Interface Design Fundamentals
4. Use visual hierarchy
Design your interface in a way that allows the user to focus on
what is most important. The size, color, and placement of each
element work together, creating a clear path to understanding
your interface. A clear hierarchy will go great lengths in
reducing the appearance of complexity (even when the actions
themselves are complex).
Ten User Interface Design Fundamentals
5. Provide feedback
Your interface should at all times speak to your user when
his/her actions are both right and wrong or misunderstood.
Always inform your users of actions, changes in state and
errors, or exceptions that occur. Visual cues or simple
messaging can show the user whether his or her actions have
led to the expected result.
Ten User Interface Design Fundamentals
6. Be forgiving
No matter how clear your design is, people will make mistakes. Your
UI should allow for and tolerate user error. Design ways for users to
undo actions, and be forgiving with varied inputs (no one likes to
start over because he/she put in the wrong birth date format). Also, if
the user does cause an error, use your messaging as a teachable
situation by showing what action was wrong, and ensure that she/he
knows how to prevent the error from occurring again. A great
example can be seen in How to increase signups with easier
captchas.
Ten User Interface Design Fundamentals
7. Empower your user
Once a user has become experienced with your interface,
reward him/her and take off the training wheels. The
breakdown of complex tasks into simple steps will become
cumbersome and distracting. Providing more abstract ways,
like keyboard shortcuts, to accomplish tasks will allow your
design to get out of the way.
Ten User Interface Design Fundamentals
8. Speak their language
If you think every pixel, every icon, every typeface matters, and
then you also need to believe that every letter matters. All
interfaces require some level of copywriting. Keep things
conversational, not sensational. Provide clear and concise labels
for actions and keep your messaging simple. Your users will
appreciate it because they won’t hear you, they will hear
themselves and/or their peers.
Ten User Interface Design Fundamentals
9. Keep it simple
The best interface designs are invisible. They do not contain UI-
bling or unnecessary elements. Instead, the necessary elements
are concise and make sense. Whenever you are thinking about
adding a new feature or element to your interface, ask the
question, “Does the user really need this?” or “Why does the
user want this very clever animated gif?” Are you adding things
because you like or want them? Never let your UI ego steal the
appearance.
Ten User Interface Design Fundamentals
10. Keep moving forward
It is often said when developing interfaces that you need to
fail fast and iterate often. When creating a UI, you will
make mistakes. Just keep moving forward and remember to
keep your UI out of the way.