Professional Documents
Culture Documents
ABSTRACT
Color is one of the biggest players in designing a webpage. A user’s
perception of the color(s) on the page can either make or break one’s user
experience when browsing. In this study, I aim to look at the relationship
between Millennials and color in web design using The Huffington Post, a
popular news website among the age group. This qualitative study
compares and contrasts their experiences looking at this website in two
different triadic color schemes—warm and cool tones. Its goal is to further
influence the field of UX design in informing designers of Millennial men
and women’s preferences in regards to color on various sorts of content
pages.
Abby Maxim
April 25, 2017
Research Methods
Dr. Howard
Research Proposal
Introduction:
Color. While we may or may not think about it, it is one of the biggest factors
in our experience reading digital or print media. Think of how boring seeing a black
and white advertisement would be, or only being able to see the internet in black
and white. The colors designers choose when creating material are not simply
afterthoughts; they are something each designer thinks deeply about how it may
impact the user or reader. Color can make a webpage go from unreadable to visually
interesting. It can be unique and draw an impact on a user or, for colorblind
For my research, I pose the question of: “How does color impact user
experience when viewing a website?” While we know that certain colors draw
reactions from users, such as blue’s association with professionalism or red’s ability
to jump from the page, unable to remain in the background, how would a user view
the same website in two different but sensible color schemes? (Williams) Will users
so, what are these differences and which one do users prefer? Finally, once the
answers to these questions are known, how might we best use these findings to
better user’s experiences when browsing the websites and webpages we create?
Maxim 3
In the following study, I will be looking at warm and cool tones’ influence on
user experience when viewing the news website, The Huffington Post. Users will be
asked to navigate the website, looking at the homepage, politics page, and the
lifestyle page. They will also be asked follow-up questions involving Likert scales,
their opinions on both versions of the website that they see, and which color
Background:
Operational Definitions:
When I say “color,” I mean that I will be looking at warm-toned colors, such
as various tones and shades of reds, oranges and yellows compare to cool-toned
colors, such as various tones and shades of blues, purples and greens in website
design. Both color schemes will be laid out in a way that is as easily-readable as
possible. As I will be looking at the subtleties of the way color impacts design and a
user’s perception of a webpage, each design will be fairly simple and modern. They
will only differ in their uses of color. In fact, I will do my best to make sure that the
tones and shades of each color match up as best as possible. The color schemes I will
be using will be triadic, as users find them most attractive (Brady and Phillips).
Cool tones:
website I present to him or her specifically through the use of color. Usability.gov
what they need, what they value, their abilities, and also their limitations.” The
Nielson Norman Group says this about UX: “In order to achieve high-quality user
industrial design, and interface design.” As I work to create a space in which the
specific effects of color on UX can be analyzed, I will have to keep these things in
I will be using in my study. I will be changing the colors of this website to match my
chose The Huffington Post for a few reasons. One, news websites play a large role in
informing the public and The Huffington Post is one of the most popular news
outlets seen all over the web and social media, such as Facebook. A user’s
experience when browsing a news outlet’s website can influence what they think
about the information portrayed on that website. I am also using The Huffington
Post specifically because its demographic is similar to the one I will be testing, as its
largest audience is Millennials. I want to see how warm and cool-toned color
schemes differ in user’s experiences and perceptions of these websites when users
view the same content with each. Here is the current Huffington Post homepage,
areas of concentrations when it comes to color and design on websites. First, I have
taken a look at literature on the role of color and lighting on screens. While the
study I looked at was based on color on mobile screens, the same thoughts can
easily apply to a computer screen. I also look at the different ways color can be
how color affects link colors, and how color affects balance on a webpage. My
research also included information on the impression color has on a user, and how
color can affect one’s perception of time on a webpage. Finally, I looked into how
color and design present themselves differently to men and women, something I
Literature Review:
regards to color and balance, entitled “Aesthetics and usability: A look at color and
balance.” Laurie Brady and Christine Phillips analyze and study the effects of color
and balance on webpages in this article. In order to complete this study, Brady and
Phillips used eighty college students as participants, the majority of whom were
freshmen with a median age of 20.53. Once the participants were selected, they
chose this design “based on the design principles of interest.” Much like the study I
plan to do, the websites were identical discounting the variables being tested—color
Maxim 9
and balance. The first website’s color scheme was “triadic,” or as Brady and Phillips
describe, one that “involves hues equally spaced along the color wheel.” However,
the authors changed the variable websites using a “non-standard” color scheme.
Participants each looked at one website and rated the websites on usability and
aesthetic appeal. In the end, the authors found “no statistical difference in user
satisfaction” in the differences between the websites. The authors speculate that this
means user satisfaction is based more upon the user’s ability to navigate a webpage
as opposed to aesthetic appeal. However, users were more likely to want to use the
webpages they ranked highly for aesthetic appeal. The authors found that color
played an important role in their study, as the website with the “triadic color
scheme” was more highly ranked than the webpages with non-standard color
schemes. Participants also noted that they thought these webpages would be easier
schemes when assessing participants. Warm and cool-toned schemes, while not
triadic, are still standard color schemes in design. I also plan to make both websites
generally “aesthetically appealing.” As this study says, websites are better received
if they are perceived to be pleasing on the eyes. I do not intend to make content hard
Coursaris et al. draw upon previous research in the area of color and design,
such as that by Brady and Phillips in order to complete their study in their article,
one’s perception of webpages in an empirical study. The authors found that the
and expressive (classical being design that “emphasizes orderly and clean design”
and expressive being design that “reflects a designer’s creativity and originality.”
(Coursaris 105)). The authors also found that split-complementary color schemes
were the most aesthetically pleasing to users with a fully-warm color scheme being
the least. They did not find any information indicating any sort of correlation
gender affects one’s perception of color and user experience. I want to know if
women and men view warm and cool tones differently, and which each gender may
or may not prefer. It is not the main point of my study, but I think it is valuable
research in the field of user experience that I can help to contribute as well. I also
research. I will not be asking to participants to analyze the websites’ design in terms
of “classical” and “expressive” terms, but these are things I will keep in mind as I
move forward. I recognize that warm-tones may be less visually appealing than
cool-tones overall, but in the context of a news website directed towards millennials
In a study directed by Gorn et al., titled “Waiting for the Web: How Screen
Color Affects Time Perception,” it was found that users were 40% more likely to
visit a webpage if a page were to download more quickly and only 20% of users
would be more likely to visit a webpage with “the addition of a richer media
experience” (Gorn 215). The authors believe that while a website’s loading time may
objectively influence users, there are also subjective influences at play. The authors
suggest that these factors could be the colors that appear as a webpage is loading
and that various colors can influence one’s perception of time. Cool colors tend to
calm down users and allow them to believe that time is moving slower as compared
I am interested in this study because I will be monitoring the times that it takes
users to complete tasks during my own study. Given this information, I have to wonder if
users will complete tasks faster with the warm-toned screen and slower with the cool-
toned scheme. Combined with the website’s purpose, which one is more ideal for a news
Displays Leveraging Ambient Light” by J. Yu, Y. Chen, and J. Li, the authors detail a
study they performed involving light and smart phone screens. They were
interested in finding the affects of lighting on user experience, such as how lighting
may affect how one reads in the sun or how a bright screen affects users in the dark.
Here, the authors have developed their own application, called ColorVert, to ease
lighting changes on webpages. Using around 200 volunteers, the authors found that
user experience is impacted by a few different factors: “readability, comfort level,
and similarity between the transformed color scheme and the original one.” The
authors also found that using bright colors hurts user experience in both high and
When thinking of user experience, one must consider the lighting in which users
may be using it. While it is impossible to make colors completely adaptable to every
lighting situation, extremely bright or dark colors as the main colors in a design
should likely be avoided so that users can see clearly in whatever lighting situation
how color might be used to promote structure within a design. She writes, “Color
focuses attention. Perceptually it may be more accurate to say that color grabs
attention. It demands and commands primary attention” (Keyes 646). Color utilizes
the design principles of proximity and contrast in order to group objects and
existing website and changing around the colors, I must abide by the principles of
design such as proximity in order to create a sensible design that will not confuse or
distract users.
Maxim 13
Meanings and Preferences” by Thomas J. Madden, Kelly Hewett and Martin S. Roth
analyzes the ways different cultures view colors. Madden, Hewett, Roth do their
research in regards to marketing and how knowing different cultures around the
the main ways in which companies and agencies reach consumers. Therefore, the
upmost importance to those designing them. The authors ask the question of, “To
what extent can global managers strategically use color to communicate desired
images and reinforce them to consumers?” to begin their research (Madden et al.
90). The authors present their research goal as “exploring cross-nationally the
meanings associated with color combinations, as well as with specific colors, and to
countries and having them analyze ten different colors. Every participant responded
to questions which involved rating them on a scale in order to define the meanings
he or she associated with each color. Then, participants chose colors to insert in
three different logo designs in which either the bottom color was blue, red, or green.
These colors were used because they are generally the most popular colors used in
Ward. Participants were undergraduate students from East Asia, Europe, South
6.0 on a score of 7.0. In five countries, blue was the favorite color of the participants
and in the three others, the second-favorite. Brazil listed white as their favorite and
Canada as black. Red was also generally associated with such meanings as “active,”
“hot,” or “vibrant.” Two Asian countries perceived pleasantness from red. (Madden
et al. 98)
participants of their opinions of particular color schemes, I must keep in mind the
fact that participants may be influenced by his or her culture or heritage when
looking at my webpage designs. Race may even play a role in my study, as the
authors cited a study which discovered that African Americans generally like red,
purple, and black as opposed to whites who lean towards cooler tones, such as blues
and greens. For this reason, I will be asking participants of their cultural heritage
with Color,” which is the main chapter I will be talking about in reference to
Williams’s book. While I referred to the entirety of her work in order to introduce
myself to the basic ideas of website design and design in general, the chapter on
color is the most relevant in relation to this study. One of the main points, especially
in regards to this study, is on page 107, when she points out that warm colors jump
to the foreground and that cool colors stay in the background. Williams gives
Maxim 15
readers hints of how to utilize these differences and how to balance out designs with
When working with color, many of the color theories Williams mentions in
that chapter and in her book as a whole will apply to my website and the thought
that goes into it as I design what it looks like for users. She also provides
Methodology:
Research Question/Purpose:
The purpose of this paper is to examine how color impacts a user’s experience when
browsing a webpage. Specifically, I will be looking at how warm and cool colors
affect a user’s experience. A good website design is necessary for the best user
experience possible and colors greatly affect a website’s design. I will use a
As stated above, I will be showing users two versions of the same website—
one warm-toned and one cool-toned in order to gauge their reactions towards these
different color schemes. I will be using the Huffington Post, as I feel that particular
Subject Selection:
am completing this study for my MAPC research project, the most efficient way for
hard to come by without incentive, I plan to offer a bit of extra credit in order to
gather volunteers. I will also reach out to fellow first-year students and perhaps
send along an email to others who teach first-year classes. I will not be reaching out
start of the study in order to make sure they come into the study unbiased and to
Name:
Gender:
Age:
Year: Freshman | Sophomore | Junior | Senior
How would you describe your race?
How would you describe your heritage?
In which region of the country did you grow up?
Major:
After participants have answered the pre-test questions, they will be asked to sign a
First, I will present participants with either the warm-toned website or the cool-
toned website. Half will see the warm-toned website first and the other half will see
the cool-toned website first in order to control for bias against one or the other. As
participants view the websites, they will voice each of their thoughts in a think-
aloud protocol. Participants will partake in multiple scenarios as they browse the
used for usability testing. Finally, the participants will see the two side-by-side and
be able to compare and contrast the effects each has on his or her user experience.
Each participant in my study will be treated equally. So that I can ensure this
equality, beyond the pre-test questions I will also follow a script and have guided
Thank you for taking part in this study regarding website design and
user interaction. Your answers will remain completely confidential and you
on the screens in front of you. First, you will see one website on the screen
to your left. Then, you will see a slightly modified version of the same
website on the right screen. You will start on the homepage of each website.
which you complete certain tasks. Please think aloud every thought you
have as you go through these scenarios. If you forget to think aloud, I will
say, “Please keep talking.” After you look at each website separately, I will
ask you to compare the two with pre-formed questions. Do not worry about
giving “right” or “wrong” answers. Anything you can say is helpful to the
study. I am just trying to get a feel of your user experience when using these
websites. As you do this, I will be recording you and gathering data of your
experience as a user.
These are the questions I will ask participants to begin the study:
1. You open up the Huffington Post as you browse for current events news.
current headlines,
including “Science
Friction: Thousands
In Opposition To
2. First, you decide you are interested in the “Politics” section of the
website. Scroll through and click on any article that interests you.
3. Next, you decide to view the “Lifestyle” section of The Huffington Post.
interests you.
Participants will go through these scenarios twice: once for the warm-toned
webpage and once for the cool-toned webpage. Responses will be recorded in Morae
and I will record comments and create a system of flags for each type of comment.
Maxim 23
CRTL+A
• Positive Comments
CRTL+N
• Negative Comments
CRTL+R
• Recommendations
CRTL+O
• Observations
The next questions will be based on a Likert scale. They are as follows:
Next, participants will compare the two questions using these questions:
If you were creating a website to rally local grassroots campaigns, which color
palette would you choose?
How comfortable do you feel with your choice?
1 [Not at all] 2 [Not very] 3 [Neutral] 4 [Somewhat] 5 [Very]
If you had to build a website that was marketing cosmetics to women, which
color palette would you choose?
How comfortable do you feel with your choice?
1 [Not at all] 2 [Not very] 3 [Neutral] 4 [Somewhat] 5 [Very]
Manager. Morae Manager has all the clips labeled with the comments that I
previously made. As I look through each flagged comment, I will code the comments
by subject. For example, if a participant mentions the navigation, the comment will
be coded as “navigation” and included in a video about color and navigation. If the
Maxim 25
participant notes the background color, the same thing will occur—a separate video
I will also be creating graphs that show the number of positive and negative
comments in regards to each version of the website. I plan to use a bar graph in this
case.
100%
90%
80%
70%
60%
30%
20%
10%
0%
Positive Comments Negative Comments
I will also average together the Likert scales once the study has finished. Raw
data will be provided as well as a clustered bar graph, which visualizes the
Question 3
Cool-toned
Warm-toned
Question 2
Question 1
0 1 2 3 4 5
Two questions in the post-test will also get accompanying graphs. The two I
will be looking at more closely here are: “If you were creating a website to rally local
grassroots campaigns, which color palette would you choose?” and “If you had to
build a website that was marketing cosmetics to women, which color palette would
Warm-toned
Cool-toned
Maxim 27
divide answers by the participants’ genders. While I will provide data with both
previous graphs shown, I will compare the gender’s differences in both the coded
think-aloud protocols and the Likert scales. Being able to see these data both
Threats to Validity
may threaten my research’s validity. While it is impossible to account for all these
threats, I intend to do the best that I can to get the most accurate data possible.
perceived in cultures other than my own. Of course, colors are seen differently in
different cultures and parts of the world. When designing a website, website
designers, usability testers and UX designers should keep in mind that there may be
have to be from one specific culture, country, or area of the country. That would be
inaccurate to the audience who may look at the website, in this case The Huffington
Post. However, I will be asking the question, “How would you describe your
Next, I will have to account for internal biases which my participants may or
may not have towards certain color schemes. Perhaps one person’s favorite color is
red and thus prefers the warm-toned color scheme immediately, or perhaps another
asking “What is your favorite color?” and “What is your least favorite color?” I have
to wonder whether or not the colors that men and women end up preferring will
research.
Users also may prefer the first website they are presented with over the last
in which they are presented. In order to control for this bias, I will be presenting half
of the participants with the warm-toned website first, and half of the participants
with the cool-toned website first. Combined with the other data I am collecting to
make sure the study is structurally valid, this bias should be accounted for.
Timeline:
Phase Task Completion Date
1 Present prospectus to August 28
committee members
1 Reach out to students, September 11
other possible
participants
1 Begin scheduling studies September 12
in Daniel 410
2 Conduct Studies September 12-November
1
2 Code studies November 10
Maxim 29
Conclusion:
My research aims to provide more insight into web design and user
experience, particularly in user’s reactions and feelings towards warm and cool-
toned color schemes. Going forward, this research should help web designers know
more of what Millenials opinions are in regards to websites, especially the news
websites that they frequently look at, such as The Huffington Post. This research has
men and women view websites differently. While there has been research done in
this area, hopefully the specific nature of this study will help designers know the
different attitudes each gender has towards news websites and other content, such
Thank you for taking the time to look over my research design. I look
Gorn, G., Chattopadhyay, A., Sengupta, J., & Tripathi, S. (2004). Waiting for the Web:
How Screen Color Affects Time Perception. Journal of Marketing Research,
41(2), 215-225. Retrieved from
http://www.jstor.org.libproxy.clemson.edu/stable/30162328
J. Yu, Y. Chen and J. Li, "Color Scheme Adaptation to Enhance User Experience on
Smartphone Displays Leveraging Ambient Light," in IEEE Transactions on
Mobile Computing, vol. 16, no. 3, pp. 688-701, March 1 2017.
Moore, R., Claire Allison Stammerjohan, & Coulter, R. (2005). Banner Advertiser-Web
Site Context Congruity and Color Effects on Attention and Attitudes. Journal of
Advertising, 34(2), 71-84. Retrieved from
http://www.jstor.org.libproxy.clemson.edu/stable/4189298