The document summarizes a study on the relationship between color and emotions in website design. The study used data from user evaluations of color schemes to build a Bayesian belief network model linking color attributes to emotional descriptors. The model found that brightness was the most important factor influencing emotions, followed by other attributes like number of colors and contrast. The researchers developed tools to apply the model and determine optimal color schemes for desired emotional impacts. However, they note that more research is needed with larger samples to generalize the findings.

1. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and
particularly the Program PYTHAGORAS II, for funding the above work.
An empirical study on the relations
between color and emotional
dimensions of a web site
Eleftherios Papachristos, Nikolaos Tselios, Nikolaos Avouris
Human-Computer Interaction Group, Electrical and Computer Eng. Dept.,
University of Patras, Greece.

2. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Presentation overview
 Color usage in web sites
 Description of the proposed
method
 Analysis of the results obtained
 Conclusions/ Future work

3. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Our research goal was…
 ..to study association of color combinations
with emotional and aesthetic values for a web
site.
 How the users are emotionally stimulated by
specific color schemes.
 The approach involves application of machine
learning techniques on data collected during
an empirical study.
 The data obtained have been used to train a
Bayesian Belief Network which associates a
chromatic model to a set of emotional
descriptors

4. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Bayesian Networks
 Computational architecture:
– Computes posterior probabilities given evidence about selected nodes
– Exploits probabilistic independence for efficient computation
– Based on Bayes theorem:
 P(A|B)=P(B|A) P(A)/P(B)

5. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Problems with color usage guidelines
 Experiential advice tends to be non-
representative, contradictory or even obsolete
(Schwier and Misanchuk 1995)
 Guidelines are often of little value to novice
designers with little experience with color theory
and art
 Many issues remain untackled by existing
guidelines, such the relationship between colors
(simultaneous contrast), the optimal number of
colors for each case etc.

6. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Color in web sites
 Color can be used for aesthetic and functional reasons.
– Shapes a user interface (Smith,1986)
– Helps information seeking and organization (Carter 1982, Marcus 1986)
 Effective web site design has to communicate well wider values such as
– sense of professionalism (Karvonen, 2001),
– trust (Nikander and Karvonen,2001) and
– Credibility (Danielson,2001)
 Strong effect on the visceral level (mostly aesthetics), positively
influences the behavioral and reflection level (Norman,2003)
 The visual aesthetics of computer interfaces are a strong determinant
of users' satisfaction and pleasure (Tractinsky et al., 2000)

7. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Methodology
 Partially inspired from a similar research by Guerin, Park, Yang
(1995).
 Identify relations between color characteristics and affective,
emotional descriptors.
 Additionally to this, the process can be applied reversely.
Color scheme descriptors Emotional descriptors Demographic descriptors

8. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Empirical study
 Forty six (46) participants completed the experiment (35 male,
11 female, aged 21-31), evaluating eight color schemes each.
 The emotional dimensions used are compatible with the thirteen
emotional dimensions that have been used by Kim et al. (2003).
 Most participants were postgraduate and undergraduate students
of the Electrical and Computer Engineering Department of
University of Patras.
 70% of the user had high internet familiarity, 26% average
familiarity, 4% low familiarity
 The amount of data collected during the study was 46
participants x12 dimensions x8 layouts=4416 evaluations, thus
552 for each test page.

9. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Emotional Dimensions
Pleasant
Formal
Fresh
Modern
Friendly
Aggressive
Professional
Attractive
Calming
Dynamic
Reliable
Sophisticated

10. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Bayesian Belief Networks
– A significant knowledge representation tool
– A significant inference representation tool under conditions of
uncertainty
 Knowledge structure:
– Variables are depicted as nodes
– Arcs represent probabilistic dependence between variables
– Conditional probabilities encode the strength of the
dependencies
 Various advantages:
 High classification accuracy
 The graph nature of the networks facilitates the knowledge
mining process
 Proliferation of available tools to manipulate obtained network

11. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Results
•Conclusions from the BBN are
structural and statistical.
•The diagrammatic nature of the
BBN
•allows recognition of the
relations between the
variables of the experiment
•allows us to gain an insight
on how a change in the values
of one node affects the
attributes of other nodes of
the network

12. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Results example
Attribute “Friendly” web page
Dominant color Green
Brightness of dominant color Bright
Saturation of dominant color neutral
Secondary color Grey green
Brightness of secondary color Bright
Saturation of secondary color not saturated
Contrast of brightness between colors high
Contrast between Hues low
Number of colors 4
Color Scheme monochromatic
Dominant color descriptor:
1:Blue, 2:Red, 3:Grey, 4:Green, 5:Purple

13. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Some more results
 Analyzing the BBN structure, lead to a categorization of
influence of color factors into 4 levels of importance.
 The most important aspect that influences the
emotional values perceived by the user seems to be :
 the brightness of the dominant color.
 the brightness level of the secondary color, the number
of colors, contrast between hues, and the type of the
secondary color (warm or cold).
 Thirdly, the dominant color, the secondary color, color
scheme, contrast levels of brightness.
 Finally, the saturation of the dominant color, and the
type of the dominant color (warm or cold).

14. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Tools developed
Experimental Tool
Final Tool

15. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Conclusions
 A novel methodology has been presented that proposes the most
appropriate web site color scheme for a desired emotional impact.
 Significant advantages compared to the most common approach,
i.e. applying guidelines for color usage
– Elicitation of optimal color schemes for each web site category (news,
e-learning, e-commerce, e-culture, e-government)
 Reported results cannot be claimed to be of general value
– neither number of subjects
– nor the number of the test web pages was sufficient to justify general
conclusions
 Many of the findings confirm earlier empirical rules on color and
current tendencies in web design

16. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Future work
 Experiment reapplication using a larger and more
symmetrical sample
 The proposed emotional descriptors can be further
evaluated in various web layouts and users and
refined accordingly
 Explore cultural deviations and their effect on
perceived aesthetics

17. We thank the European Social Fund (ESF), Operational Program for Educational and Vocational Training II (EPEAEK II), and particularly the Program PYTHAGORAS II, for
funding the above work.
Thank you!
 Visit us at hci.ee.upatras.gr