International Journal on Recent and Innovation Trends in Computing and Communication

Volume: 2 Issue: 8

ISSN: 2321-8169
2522 2525

_______________________________________________________________________________________________

Understanding the role of emotions, usability components and design

features in HCI
Deepak Aggarwal
Department of CS
Maharishi Dayanand University
Delhi, India

Somya Jain
Department of CS & IT
Jaypee Institute of Information Technology
Noida, India

[email protected]

[email protected]

Abstract This paper has discussed the observations of various emotions which are invoked in the human computer interface
and how these emotions affect the decisions of the users online. This paper has also discussed usability test methods in the human
computer interface design and its relation with the usability of the interfaces. Also some principles are put forward which should
be implemented for the development of better interfaces.
Keywords-emotions; human computer interaction; styling; usability component; design features

__________________________________________________*****_________________________________________________
I.

INTRODUCTION

Whenever we think about interaction design, we think

about our phones, laptops and different devices, but without
humans there is nothing interesting to talk about. Interaction
design implies really at what we design as man-made objects
is complete only when there are people who are using it.
Products have changed our behavior and for these things to
change our lives better or enabling us do the things we
couldn't do earlier in a way that feels natural and feels like a
conversation and what interaction design does is it makes
those experiences natural and it makes them more about the
content, or experience, or what we are trying to do and less
about using a device, or using a screen, it is understanding the
ecosystem where the human is at the center and understanding
the network of things and how they work and every time one
interacts with the design there is an emotion attached to it,
these emotions change our thinking process, they modify our
lifestyle, and affects things around us, although not apparently
this is because of the emotions we invoke when we are using
the design Usability is the science of ease of use and
learnability to the users, we are living in an era where access
to facebook.com can change the fate of the country, and
emotions for the million users cannot be ignored and this is
what makes usability, emotions and their relation so important
because it has the potential to change our lives.
II.

COMPONENTS OF USABILITY

Wherever Times is specified, Times Roman or Times New

Roman may be used. If neither is available on your word
processor, please use the font closest in appearance to Times.
Avoid using bit-mapped fonts if possible. True-Type 1 or Open
Type fonts are preferred. Please embed symbol fonts, as well,
for math, etc.
A. Satisfaction
This is the property by which the user feels pleasant by the
overall experience of the interface and the interactions. A
good design is as natural as possible and this is the underlying
principle of this component as the user who is already
interacting with the natural behavior of the products is more

likely to gain a pleasant experience while interacting with web

components or graphic interfaces. For example, flipping pages
while reading an e-book on a tablet or i-pad is a natural thing
we do while reading paper-books as Shown in Fig. 1.
B. Learnability

This is the component where the ease of access for the

users are checked when they use the website or the software
for the first time. This component is very crucial when the
software application or the website has some complex task to
perform and if the user is interacting with the interface for the
first time, it becomes very important to understand the target
users.
C. Efficiency

This property is judged for the users who were already

once visited the interface of the software or website, and also
how the users react to the system when they use it for the
second and subsequent times. This is also a very important
factor as once the users have learned the design, then how
quickly can they perform tasks, the success over this factor
will return the website their users.
D. Memorability

This Principle of memorability states that of being how

easy to recall the design for user and their aptness if not being
used for so many years. This could be directly associated with
the property of Learnability as here too the users could be
assumed of using the design for the first time.
E. Errors

Another vital aspect is the errors the users make while

using the design, this could drastically affect the usability of
the design questions like, how many errors do users make?,
how severe are these errors?, how easily can they recover from
these errors could change the design, a sheer usability research
and testing on users and observing their actions can answer
these questions.

2522
IJRITCC | August 2014, Available @ http://www.ijritcc.org

_______________________________________________________________________________________

International Journal on Recent and Innovation Trends in Computing and Communication

Volume: 2 Issue: 8

ISSN: 2321-8169
2522 2525

_______________________________________________________________________________________________
White

Used in Minimalistic designs.

Peace, Transparency,
Purpose

Figure1. Flipping pages on i-pad

III.

FACTORS AND THEIR INVOKED EMOTIONS

Before you begin to format your paper, first write and save
the content as a separate text file. Keep your text and graphic
files separate until after the text has been formatted and styled.
Do not use hard tabs, and limit use of hard returns to only one
return at the end of a paragraph. Do not add any kind of
pagination anywhere in the paper. Do not number text headsthe template will do that for you.
Finally, complete content and organizational editing before
formatting. Please take note of the following items when
proofreading spelling and grammar:
A. Color
There are a lot of factors that influence the users, a large
part of every decision is based on visual cues, and the
strongest and most persuasive is color. Color increases the
brand recognition by 80% [1]. Brand recognition links directly
to consumer confidence, also color plays a significant role for
e-commerce websites, three color palettes is universally
preferred over rainbow palette, neutral colors should be used
over bright colors as neutral colors give a more pleasant look
and better visibility also too similar colors should be avoided
and contrasting colors i.e., dark and light for text and
background or vice versa should be used, But colors can build
trust and affect decisions, below table I shows the colors, their
roles and the emotional triggers invoked.
TABLE I.

Used in market luxury products

Powerful, Sleek

Pink

Used for market products to women

and young girls

Romantic, Feminine

B. Typography
Typefaces like everything build reputation which is in direct
contrast with the company profile and the customer
confidence. It plays a major role in customer satisfaction and
invoking different emotions ranging from confusion and
frustration to trust and reliance. Similar proportions and
simpler styles used over different proportions and stylized
fonts which create satisfaction over confusion. Too decorative
type for body contents is not legible where simple and clear
type for paragraphs should be used, also too small body copy
is hard to read and strenuous on the viewers eyes, for this
clear and legible font size brings clarity to the users. The array
of different font styles can make the graphic too busy and hard
to read whereas similar style fonts with appropriate sizes can
make the graphic organized and easy to read and to follow.
C. Layout
The user Experience is not just interacting with the
interface, it is the navigation from one component to another
and to achieve a good user experience layout has to be very
well set in accordance to the users, following are the
components which are the three pillars of layout design.
Order and hierarchy: A confusing workflow of
elements is hard to comprehend; the flow of the elements has
to be decided by the priority of the work on the other hand a
logical flow is easy to follow.
Balance: If not perfectly symmetric then a good
balance should be maintained among the elements of the
interface, clump random elements to one area while isolating
others often leaves users unsatisfied and leave without
accomplishing tasks, whereas objects which are laid out
evenly makes it easy to highlight info.
White Space: "Perfection is achieved, not when there
is
nothing more to add, but when there is nothing left to take
away" Antoine De Saint-Exupery

CATEGORIZATION OF THE COLORS, THEIR ROLES

AND EMOTIONAL TRIGGERS INVOKED

Color

Role

Red

Increases the heart rate, Creates

Urgency.

Energy, Attention,
Enthusiasm, Confidence

Orange

Often used to grab attention of

window shoppers.

Optimistic, Youthful
Clarity

Yellow

Creates a call to action: Subscribe

Aggressive,
Creativity, Ambition

Buy or Sell.
Blue

Black

Creates sensation of trust and

security ,often seen with banks and
businesses

Emotional Trigger

A Good design is not the one which fills up the screen with
graphics, people are more aligned towards the designs which
are simple to use, cluttering and not letting the background to
show is not a good way to organize data but allowing the
background to show helps the eye to organize data.
IV.

DESIGNING FEATURES FOR BETTER USABILITY

OF HUMAN COMPUTER INTERACTION

A. Design to invoke emotions

Trust, Youth,
Integrity, Openness

Humans have a lot of options of using different products

2523

IJRITCC | August 2014, Available @ http://www.ijritcc.org

_______________________________________________________________________________________

International Journal on Recent and Innovation Trends in Computing and Communication

Volume: 2 Issue: 8

ISSN: 2321-8169
2522 2525

_______________________________________________________________________________________________
(web applications or soft ware's) if yours doesn't interact with
them, identify what emotions are necessary for your
business, invoke those emotions in your product, for
example: if you have an online shopping website then
emotions like attraction, control to the user, trust and clarity
are the triggered emotions. A better user experience will
definitely lead you with returning or more customers.
B. Design for skimmability
It is hard to digest for the web content writers and web
designers that the user don't invest that long time reading to
the documents and the content they have in their website [2].
Users use a faster way to extract information (which is
important to them) and that is scanning, they extract for the
triggering words, needless sentences, introductory talks and
long instructions bore people and therefore they should be
omitted. Define why people should visit your website; give the
triggering words right in front of the people [3]. Figure 2
shows comparison between two web pages where first one on
left hand side is easy to skim as it was organized and
structured where as web page on right hand side is unorganized.

Figure2. Skimmability comparison

C. Design to give control

People love to be drivers of their own car, a good design is
what which understands this and let them drive, they don't like to
be pushed to the back seat, let them have the control they
ought to get as a user at least enough so that they stop
worrying about their basic need, people hassle through the
design when they find out they don't have any control, for
example, in the elevator of Apple Store shown in Figure 3 in
Tokyo have one factor missing: control, there are no buttons to
call the elevator and neither inside of the elevator, this leaves
the users anxious, unsettled and frustrated, even forcing the
users to think -Will it stop? Why is it stopping when no-one is
getting on or off [4].
D. Design to function
Design is not just the appearance of the product, it behaves
to function. Design's first priority is to cater the function of the
user and this is the interface through which the user can
perform his tasks. The theory adopted should be -"The user
should always win", the navigation should not make the user
to go for leap of faith, the users should be able to predict the
design, because it's natural, functionality should be the core of
the behavior of the design.
E. Design for people
Products are people too. A good designer is first a good
observer of users and design products which interact with the
users and has its own emotional quotient with the human as
the centre. User experience is more understanding people than
understanding technology, a product is not an end in itself, and
it is a means towards providing a good experience to the user.
F. Design to understand study, design, build, evaluate and
reiterate
Design need not to be perfect in the first go, design is a

Figure 3. Elevator design

process, it is not just an input to the development process it is

a process in itself. It should be flexible to changes, a good
design is understandable both to users and designers, it is a
process of understanding the constraints of product and study
them, designing wireframe, building them to applications and
evaluating the final product and reiterating the process [5].
V.

CONCLUSION

In this paper, a clear picture of the relation between

invoked emotions and user experience is drawn. We have
discussed different emotions and the impact they cause on the
environment which is online and how it pays its contribution
to the ergonomics, how the decisions are changed in a changed
interface and how different factors could be used to better the
experience of the user. We've also discussed that a good
design need not to be a great design, it just have to be as
natural and as little as possible. But clearly there is a lack of
understanding to measure and quantify emotions and to
quantify the effects of incorporating better usability which are
goal-oriented and user-centered. Also the definition of user
2524

IJRITCC | August 2014, Available @ http://www.ijritcc.org

_______________________________________________________________________________________

International Journal on Recent and Innovation Trends in Computing and Communication

Volume: 2 Issue: 8

ISSN: 2321-8169
2522 2525

_______________________________________________________________________________________________
experience is different for everyone, which is both good and
bad. Future works include collaboration with different branch
of technology working in groups and discussing different
methodologies, and further understanding the literature of
User Experience [6].
REFERENCES
[1]

W. Arruda , 16 ways to use color to bolster your personal brand,

http://www.forbes.com/sites/williamarruda/2013/08/12/16-waysto-use- color-to-bolster-your-personal-brand/

S. Krug, "Don't make me think a common sense approach to

web usability", New Riders, ISBN-10: 0321344758, 2005 C.H.
Yu, and R. C. Miller, "Enhancing web page skimmability",
CHI'12, Austin, Texas, USA, May 5-10, 2012.
[3] G. Coborne, "Simple and usable web, mobile and interaction
design" , New Riders Publishing, ISBN: 0321703545,
September 16th 2010.
[4] R. Harper, T. Rodden, Y. Rogers, and A Sellen, "Being Human,
Human Computer Interaction in the year 2020", Microsoft
Research, Microsoft Research Ltd, ISBN: 978-0-9554761-1-2,
2008
[5] V. Roto, M. Obrist, and K.V.V Mattila, "User Experience
Evaluation
Methods
in
Academic
and
Industrial
contexts.http://www.cs.tut.fi/~kaisavvm/UXEM09Interact_ObristRotoVVM.pdf
[2]

2525
IJRITCC | August 2014, Available @ http://www.ijritcc.org

_______________________________________________________________________________________