Emotional Interaction in User Experience
Emotional Interaction in User Experience
Emotional Interaction
• What makes us happy, sad, annoyed,
anxious, frustrated, motivated, delirious
and so on
- translating this into different aspects of
the user experience Expressive Interface
• Provide reassuring feedback that can be
• Why people become emotionally
both informative and fun
attached to certain products (e.g., virtual
pets) • But can also be intrusive, causing people
to get annoyed and even angry
• Can social robots help reduce loneliness
• Color, icons, sounds, graphical elements
and improve wellbeing?
and animations are used to make the
• How to change human behavior through
‘look and feel’ of an interface appealing
the use of emotive feedback
- conveys an emotional state
Emotions & the User Experience • In turn this can affect the usability of an
• HCI has traditionally been about interface
designing efficient and effective systems - people are prepared to put up with
• Now more about how to design certain aspects of an interface (e.g.,
interactive systems that make people slow download rate) if the end result is
respond in certain ways appealing and aesthetic
• - e.g. to be happy, to be trusting, to Annoying Interface
learn, to be motivated Many Causes
• Emotional interaction is concerned with - When an application doesn't work
how we feel and react when interacting properly or crashes
with technologies - When a system doesn’t do what the
user wants it to do
Emotional Model - When a user’s expectations are not met
CLAIM FROM MODEL - When a system does not provide
• Our emotional state changes how we think sufficient information to enable the
• When frightened or angry we focus narrowly user to know what to do
and body responds by tensing muscles and - When error messages pop up that are
sweating vague, obtuse or condemning
• More likely to be less tolerant - When the appearance of an interface is
garish, noisy, gimmicky or patronizing
1
ICTP 211 - REVIEWER
MIDTERMS/ BS PSYCH 2-YB-2/ Magallanes
- When a system requires users to carry Detecting emotions
out EMOTION TECHNOLOGY
- too many steps to perform a task, only - Sensing technologies used to measure
to discover a mistake was made earlier GSR, facial expressions, gestures, body
and they need to start all over again movement
GIMMICKS - Aim is to predict user’s emotions and
Amusing to the designer but not the user, e.g. aspects of their behavior
• Clicking on a link to a website only to E.g., what is someone most likely to buy
discover that it is still ‘under online when feeling sad, bored or happy
construction’ FACIAL CODING
ERROR MESSAGES - Measures a user’s emotions as they
Shneiderman’s guidelines for error messages interact with a computer or tablet.
include: - Analyses images captured by a webcam
• avoid using terms like FATAL, INVALID, BAD of their face
• Audio warnings - Uses this to gauge how engaged the
• Avoid UPPERCASE and long code numbers user is when looking at movies, online
• Messages should be precise rather than vague shopping sites and ads
• Provide context-sensitive help - 6 core expressions - sadness,
WEB ERRORS happiness, disgust, fear, surprise and
COMMON WEB ERROR MESSAGES anger
• 401 Unauthorized How to use the emotional data?
• 400 Bad Request • If user screws up their face when an ad
• 403 Forbidden pops up - feel disgust
• 404 Not Found • If start smiling - they are feeling happy
• 408 – Request Time-Out • Website can adapt its ad, movie storyline
• 500 Internal Server Error or content to match user’s emotional
• 502 Service Temporarily Overloaded state.
• 503 Service Unavailable • Eye-tracking, finger pulse, speech and
Should computers say they’re sorry? words/phrases also analyzed when
• Reeves and Naas (1996) argue that tweeting or posting to Facebook
computers should be made to apologize Persuasive Technology
• Should emulate human etiquette • Interactive computing systems
• Would users be as forgiving of deliberately designed to change people’s
computers saying sorry as people are of attitudes and behaviors (Fogg, 2003)
each other when saying sorry? • A diversity of techniques now used to
• How sincere would they think the change what they do or think
computer was being? • Pop-up ads, warning messages,
• For example, after a system crash: reminders, prompts, personalized
– “I’m really sorry I crashed. I’ll try not to do messages, recommendations, Amazon 1-
it again” click
• How else should computers • Commonly referred to as nudging
communicate with users? “We are sorry, NINTENDO’S POCKET PIKACHU
the page you requested cannot be Changing bad habits and improving well being
found.”
2
ICTP 211 - REVIEWER
MIDTERMS/ BS PSYCH 2-YB-2/ Magallanes
- Designed to motivate children to be Implications
more physically active on a regular basis Should we create products that adapt according
- owner of the digital pet that ‘lives’ in to people’s different emotional states?
the device is required to walk, run, or • When people are feeling angry should an
jump interface be more attentive and
- If owner does not exercise the virtual informative than when they are happy?
pet becomes angry and refuses to play
anymore WEEK 8: SOFTWARE PROCESS
TRACKING DEVICES -HCI IN THE SOFTWARE PROCESS-
- Mobile apps designed to help people SOFTWARE
monitor and change their behavior - Software is a collection of instructions
(e.g., fitness, sleeping, weight) and data that tell the computer how to
- Can compare with online leader boards work. This is in contrast to physical
and charts, to show how they have hardware, from which the system is
done in relation to their peers and built and actually performs the work.
friends Software Engineering
- Also, apps that encourage reflection - Software engineering provides a means
that in turn increase well-being and of understanding the structure of the
happiness design process, and that processed can
Evidence to support anthropomorphism be assessed for its effectiveness in
Reeves and Naas (1996) found that computers interactive system design. One of the
that flatter and praise users in education cornerstones of software engineering is
software programs -> positive impact on them. the software life cycle
- “Your question makes an important and Software life cycle
useful distinction. Great job!” Software Development Life Cycle (SDLC) is a
Students were more willing to continue with process used by the software industry to
exercises with this kind of feedback. design, develop and test high quality software.
Virtual characters • The SDLC aims to produce a high-quality
• Appearing on our screens in the form of: software that meets or exceeds
Sales agents, characters in videogames, customer expectations, reaches
learning companions, wizards, pets, completion within times and cost
newsreaders estimates.
• Provides a persona that is welcoming, - SDLC is the acronym of Software
has personality and makes user feel Development Life Cycle.
involved with them - It is also called as Software
Development Process.
Disadvantages: - SDLC is a framework defining tasks
Can lead people into false sense of belief, performed at each step in the software
enticing them to confide personal secrets with development process.
chatterbots Activities in the Software Life Cycle
• Annoying and frustrating The Waterfall Model was the first Process
• May not be trustworthy Model to be introduced. It is also referred to as
a linear-sequential life cycle model.
3
ICTP 211 - REVIEWER
MIDTERMS/ BS PSYCH 2-YB-2/ Magallanes
It is very simple to understand and use. In a Once the functional and non-functional testing
waterfall model, each phase must be completed is done; the product is deployed in the
before the next phase can begin and there is no customer environment or released into
overlapping in the phases. the market.
Maintenance
There are some issues which come up in the
client environment. To fix those issues, patches
are released. Also, to enhance the product
some better versions are released.
Maintenance is done to deliver these changes in
the customer environment.
Waterfall Model -Application
Every software developed is different and
requires a suitable SDLC approach to be
followed based on the internal and external
factors. Some situations where the use of
Waterfall model is most appropriate are –
Requirement Analysis • Requirements are very well documented,
All possible requirements of the system to be clear and fixed.
developed are captured in this phase and • Product definition is stable.
documented in a requirement specification • Technology is understood and is not dynamic.
document. • There are no ambiguous requirements.
System Design • Ample resources with required expertise are
The requirement specifications from first phase available to support the product.
are studied in this phase and the system design • The project is short.
is prepared. This system design helps in
specifying hardware and system requirements Advantages
and helps in defining the overall system • Simple and easy to understand and use
architecture. • Easy to manage due to the rigidity of the
Implementation model. Each phase has specific deliverables and
With inputs from the system design, the system a review process.
is first developed in small programs called units, • Phases are processed and completed one at a
which are integrated in the next phase. Each time.
unit is developed and tested for its • Works well for smaller projects where
functionality, requirements are very well understood.
which is referred to as Unit Testing. • Clearly defined stages.
Integration and Testing • Well understood milestones.
All the units developed in the implementation • Easy to arrange tasks.
phase are integrated into a system after testing • Process and results are well
of each unit. Post integration the entire system documented.
is tested for any faults and failures.
Deployment of system Disadvantages
• No working software is produced until late
during the life cycle.
4
ICTP 211 - REVIEWER
MIDTERMS/ BS PSYCH 2-YB-2/ Magallanes
• High amounts of risk and uncertainty.
• Not a good model for complex and object-
oriented projects.
• Poor model for long and ongoing projects.
• Not suitable for the projects where
requirements are at a moderate to high risk of
changing. So, risk and uncertainty is high with
this process model.
• It is difficult to measure progress within
stages.
• Cannot accommodate changing requirements.
• Adjusting scope during the life cycle can end a
project.
• Integration is done as a "big-bang. at the very
end, which doesn't allow identifying any Evolutionary Prototyping
technological Here the prototype is not discarded and serve
or business bottleneck or challenges early. as the basis for the next iteration od design. In
Software Prototyping this case, the actual system is seen as evolving
Prototype is a working model of software with from a very limited initial version to its final
some limited functionality. The prototype does release.
not always hold the exact logic used in the Evolutionary prototyping also fits in well with
actual software application and is an extra the modifications which must be made to the
effort to be considered under effort estimation. system that arise during the operation and
- Prototyping is used to allow the users maintenance activity in life cycle.
evaluate developer proposals and try
them out before implementation. It
also helps understand the requirements
which are user specific and may not
have been considered by the developer
during product design.
Throwaway/Rapid Prototyping
Throwaway prototyping is also called as rapid or
close ended prototyping. This type of
prototyping uses very little efforts with
minimum requirement analysis to build a Prototyping application
prototype. Software Prototyping is most useful in
- Once the actual requirements are development of systems having high level of
understood, the prototype is discarded user interactions such as online systems.
and the actual system is developed with Systems which need users to fill out forms or go
a much clear understanding of user through various screens before data is
requirements. processed can use prototyping very effectively
to give the exact look and feel even before the
actual software is developed.
5
ICTP 211 - REVIEWER
MIDTERMS/ BS PSYCH 2-YB-2/ Magallanes
Software that involves too much of data the `expected’ effect or behavior that the
processing and most of the functionality is designer intended the design
internal with very little user interface does not object should achieve to fulfil the required
usually benefit from prototyping. Prototype function." [Sim & Duffy, 1994]
development could be an extra overhead in • "Design rationale means statements of
such projects and may need lot of extra efforts. reasoning underlying the design process that
explain, derive, and justify design decisions"
Advantages [Fischer, et. a., 1995]
• Increased user involvement in the product • Design rationale means "information that
even before its implementation. explains why an artifact is structured the way
• Since a working model of the system is that it is and has the behavior that it has"
displayed, the users get a better understanding [Conklin, Burgess-Yakemovic, 1995].
of the system being developed. • "Design rationales include not only the
• Reduces time and cost as the defects can be reasons behind a design decision but also the
detected much earlier. justification for it, the other alternatives
• Quicker user feedback is available leading to considered, the tradeoffs evaluated, and the
better solutions. argumentation that led to the decision" [Lee,
• Missing functionality can be identified easily. 1997].
• Confusing or difficult functions can be
identified. Design rationale -Application
Design verification — The design rationale can
Disadvantages be used to verify if the design decisions and the
• Risk of insufficient requirement analysis owing product itself are the reflection of what the
to too much dependency on the prototype. designers and the users actually wanted.
• Users may get confused in the prototypes and Design Evaluation – the design rationale is used
actual systems. to evaluate the various design alternatives
• Practically, this methodology may increase the discussed during the design process.
complexity of the system as scope of the system Design maintenance – the design rationale
may expand beyond original plans. helps to determine the changes that are
• Developers may try to reuse the existing necessary to modify the design.
prototypes to build the actual system, even Design Reuse – the design rationales is used to
when it is not technically feasible. determine how the existing design could be
• The effort invested in building prototypes may reused for a new requirement with or without
be too much if it is not monitored properly. changes in it. if there’s a need to modify the
Design rationale design, the DR also suggests what needs to be
There are many definitions of Design Rationale: modifies in the design.
• "Design rationale expresses elements of the Design Teaching – the design rationale could be
reasoning which has been invested behind the used as resource to teach people who are
design of an artifact" [Shum & Hammond, unfamiliar with the design and the system.
1993]. Design Communication – the design rationale
• "Design rationale is the reasoning and facilitates better communication among people
argument that leads to the final decision of how who are involved in the design process and thus
the design intent is achieved." "Design intent is helps to come up with a better design.
6
ICTP 211 - REVIEWER
MIDTERMS/ BS PSYCH 2-YB-2/ Magallanes
Design assistance – the design rationale could Principles of Learnability
be used to verify the design decisions made Predictability - This interactive design principle
during the design process. requires a user's knowledge of interaction to be
Design Documentation – the design rationale is sufficient to determine the outcome of present
used to document the entire design process or future interaction with the system.
which involves the meeting room deliberations, • For example, closing a document should
alternatives discussed, reasons behind the always allow the user to save changes
design decisions and the product overview. not saved already.
Synthesizability - Is the ability of the user to
WEEK 9: DESIGN RULES assess the effect of past operations on the
DESIGN RULE - Design rules are the form of current state.
standards and guidelines providing direction for • For example, when the user makes a
designers in order to enhance the interactive payment, he expects to receive a receipt,
properties of the system. otherwise he will think that the
• Designing for maximum usability - the transaction failed or that he is been
goal of interaction design scammed.
• Principles of usability - general Familiarity - How prior knowledge applies to
understanding new system, or make use of the new user’s past
• Standards and guidelines - direction for experience with other applications; affordance
design • For example, A recycle bin is a familiar
• Design patterns - capture and reuse item in the real world and recycle bin
design knowledge icon immediately suggests its function.
types of design rules Generalizability - This interactive design
Principles - A fundamental truth or proposition principle provides support for users to extend
that serves as the foundation for a system of knowledge of specific interaction within, and
belief or behavior or for a chain of reasoning. across applications, to new, but similar
• Abstract design rules situations.
• Low authority • For example, cut/copy/paste/save
• High generality operations within Microsoft Office
Standards - An idea or thing used as a measure, applications use of same short-cut keys.
norm, or model in comparative evaluations. Consistency - To support generalizability,
• Specific design rules consistency is essential and is probably one of
• High authority the most widely applied design principle in user
• Limited application interface design.
Guidelines - Is a statement by which to Consistency between application is always
determine a course of action favorable, however consistency within an
• Lower authority application is essential.
• More general application • For example, a user expects a radio
Principles to Support Usability button to allow only one choice of the
[Link] - Concerned with interactive available options.
system features, which aid novice users to learn Principles to Support Usability
quickly and also allows steady progression to 2. Flexibility - The variety of ways the user and
expertise. system exchange information
Principles of Flexibility
7
ICTP 211 - REVIEWER
MIDTERMS/ BS PSYCH 2-YB-2/ Magallanes
Dialog initiative - Freedom from system- Recoverability - The extent to which the user
imposed constraints on input dialogue. can reach the intended goal after recognizing an
• For example, user should be able to error in the previous interaction.
abandon, suspend or resume. Tasks at • For example, Error recovery can be
any point. achieved in two ways, forward
Multithreading - The ability of system to (negotiation) and backward (undo).
support user interaction for more than one task Responsiveness - a measure of the rate of
at a time. communication between the user and the
• For example, a word processor allows system.
multiple documents to be open, but only • For example, when an instantaneous
one can be worked on at any instant. response cannot be given by the system,
Task migratability - The ability to pass control the system should be able to indicate to
for the execution of a given task so that it the user that the system has received
becomes either internalized by the user or the the request and in processing an
system or shared between them appropriate action (see definition of
Substitutivity - The extent to which an observability).
application allows equivalent input and output Task conformance - The extent to which the
values to be substituted for each other. system services support all the tasks the user
• For example, values in output both would wish to perform and in the way the user
digital and analog, output/input would wish to perform.
Customizability - The ability of the user or the • Task completeness covers whether a
system to modify the user interface. system can perform all tasks of interest.
Adaptivity can be automated but in order to be • Task adequacy deals with the user ability
able to provide such user-centered system to understand the tasks.
behaviors the system should be trained to THE GOLDEN RULE
distinguish an expert's behavior from a novice Schneiderman’s 8 Golden Rules of Interface
user's behavior. Design:
• The customizability principle supports a • Schneiderman's eight golden rules
user's ability to adjust systems settings provide a convenient and succinct
or features to a form that best suites the summary of the key principles of
preferred way of usage. interface design. They are intended to be
Principles to Support Usability used during design but can also be
[Link] - The level of support provided applied, like Nielsen’s heuristics, to the
the user in determining successful achievement evaluation of systems
and assessment of goal-directed behavior. 1. Strive for consistency
2. Enable frequent users to use shortcuts
Observability - The extent to which the user can 3. Offer informative feedback
evaluate the internal state of the system from 4. Design dialogs to yield closure
the representation on the user interface. 5. Offer error prevention and simple error
• For example, if the system is performing handling
a time-consuming operation, the current 6. Permit easy reversal of actions
status of the operation should be 7. Support internal locus of control
displayed - a web browser will indicate 8. Reduce short-term memory load
the on-going status of a page download.
8
ICTP 211 - REVIEWER
MIDTERMS/ BS PSYCH 2-YB-2/ Magallanes
Norman’s 7 Principles widgets) using a drag-and-drop WYSIWYG
1. Use both knowledge in the world and editor.
knowledge in the head. Windowing systems
2. Simplify the structure of tasks. • Windowing systems are a central
3. Make things visible: bridge the gulfs of environment for both the programmer and user
Execution and Evaluation. of an interactive system, allowing a single
4. Get the mappings right. workstation to support separate user-system
5. Exploit the power of constraints, both natural threads of action simultaneously.
and artificial. • A windowing system is a system for sharing a
6. Design for error. computer's graphical display presentation
7. When all else fails, standardize. resources among multiple applications at the
same time.
WEEK 10: IMPLEMENTATION SUPPORT Elements of windowing systems
IMPLEMENTATION SUPPORT - Implementation Device independence - Device independence is
Support is a planned approach to integrate new the process of making a software application
or upgraded software or systems into the able to function on a wide variety of devices
existing workflow of an organizational structure regardless of the operating system and local
to help ensure the success of a business' overall hardware on which the software is used.
system. EXAMPLES: Programming Language,
Programming tools applications, API
• For interactive systems provide a means of shared resource - In computing, a shared
effectively translating abstract designs and resource, or network share, is a computer
usability principles into an executable form. resource made available from one host to other
• These tools provide different levels of services hosts on a computer network. It is a device or
for the programmer. piece of information on a computer that can be
• Programming tools provide levels of services remotely accessed from another computer.
for programmers EXAMPLES: Printer, network, display, memory,
storage, and application
Compiler - A compiler is a special program that Example Of Windowing Systems
processes statements written in a particular Client server - A computer network in which
programming language and turns them into one centralized, powerful computer (called the
machine language or "code" that a computer's server) is a hub to which many less powerful
processor uses. personal computers or workstations (called
Debugger - A debugger is a program that allows clients) are connected. The clients run programs
you to step through another program one line and access data that are stored on the server.
at a time. This is very useful when trying to Toolkits
identify incorrect code and analyze how a • Tools (also known as toolkits) are a set of
program "flows". basic components and accessories that help
GUI designer - A graphical user interface builder software developers create programs in a more
(or GUI builder), also known as GUI designer, is efficient manner.
a software development tool that simplifies the • A program used for software development or
creation of GUIs by allowing the designer to system maintenance.
arrange graphical control elements (often called • A single utility program, a set of software
routines or a complete integrated set of
9
ICTP 211 - REVIEWER
MIDTERMS/ BS PSYCH 2-YB-2/ Magallanes
software utilities that are used to develop and
maintain applications and databases.
Toolkits examples
The AWT is part of the Java Foundation Classes
(JFC) — the standard API for providing a
graphical user interface (GUI) for a Java
program.
• AWT is also the GUI toolkit for a number
of Java ME profiles. For example,
Connected Device Configuration profiles
require Java runtimes on mobile
telephones to support the Abstract
Window Toolkit.
Google Web Toolkit or GWT Web Toolkit - is an
open-source set of tools that allows web
developers to create and maintain JavaScript
front-end applications in Java.
• GWT emphasizes reusable approaches to
common web development tasks,
namely asynchronous remote procedure
calls, history management, bookmarking,
UI abstraction, internationalization, and
cross-browser portability.
UI Management-Systems
• A program used for software development or
system maintenance.
• A single utility program, a set of software
routines or a complete integrated set of
software utilities that are used to develop and
maintain applications and databases.
AIMS TO IMPROVE:
• Portability – runs on different systems
• Reusability – components reused cutting
costs
• Multiple interfaces – accessing same
functionality
• Customizability – The user interface can be
customized by both the designer and the user
to increase its effectiveness without having to
alter the underlying application
10