Hue Combinations for Web Design: Guidelines for Combining Color Hues Onscreen for Swedish and Thai User s

Transcription

1 Hue Combinations for Web Design: Guidelines for Combining Color Hues Onscreen for Swedish and Thai User s Vidal Ruse 1, Montathar Faraon 2 1 Xene Inc., Linköping Sweden 2 Kristianstad University Kristianstad, Sweden vidal@vidaldigital.com ABSTRACT: Users can assess the visual appeal of a web page within 50 milliseconds and color is the first thing noticed onscreen. That directly influences user perception of the website and choosing appealing color combinations may therefore be crucial for successful web design. The aim of this article was to identify, formulate, and evaluate design guidelines to support designers in the process of combining color hues for websites in the context of the Swedish and Thai cultures. A quantitative methodology was used to evaluate the proposed design guidelines. The results showed that culture play a role when evaluating color hue combinations. More specifically, Thai participants rated Thai designs significantly higher than Swedish participants, but the reverse was not true for Swedish designs. Thai designs were as well rated higher than Swedish designs by all participants. The results may have implications for practitioners working in the area of web design and to the broader debate whether color is culturally relative. Keywords: Hue Combinations, Color Onscreen, Thai Design, Swedish Design, Web Design, Culturally Appropriate Color Use Received: 15 April 2018, Revised 21 May 2018, Accepted 28 May 2018 DOI: /ijwa/2018/10/3/ DLINE. All Rights Reserved 1. Introduction Web designers use information technology in order to design and implement digital artifacts such as websites. Knowledge about color plays an important role when designing websites. The majority of websites have color, which affects users perception of these digital artifacts [1]. Color is the first thing noticed onscreen, in an app or on a website, even before the users see what language is being used, or start reading the content [2]. Research conducted in three studies identified that users can assess the visual appeal of a web page in 50 milliseconds [3]. The initial impression that users get, within a short moment of viewing the website, later influences their opinion about both how usable or trustworthy the site is [4]. It is paramount for a web designer to design a website that is attractive to the target audience 100 International Journal of Web Applications Volume 10 Number 3 September 2018

2 because the visual appeal of the website strongly influences users early decisions whether or not to reject the website and to leave [5]. Color plays an important role in this appeal. It has been noted that color is one of the first impressions users receive about a website, and argues that people subconsciously make a judgement about an environment or an artifact in the first 90 seconds and about 62-90% of this assessment is based on color [6]. Other researchers identified that colorfulness and visual complexity explain 48% of the variance in users first impressions [4, p. 2057]. Colorfulness, in the context of this article, is referred to as the sum of the average saturation value and its standard deviation [4, p. 2051]. Color itself is characterized by hue, chroma and lightness. Hue can be described as an attribute of a visual perception according to which an area appears to be similar to one or to proportions of two, of the perceived colours, red, yellow, green, and blue [7, p. 440]. Chroma is the colourfulness of an area judged in proportion to the brightness of a similarly illuminated area that appears to be white or highly transmitting [7, p. 433], and is sometimes used interchangeably with saturation, which may be defined as colourfulness of an area judged in proportion to its brightness [7, p. 448]. The third characteristic, lightness is considered as the brightness of an area [7, p. 442]. Contemporary research has established guidelines for combining colors concerning user preference for two characteristics of color, that is, chroma and lightness [8,9,10]. Classic color harmonies such as analogous, complementary, triadic [11, p. 21] that designers use in order to combine colors are proven to be invalid by recent color research [8,9,10]. Alternative color harmony models has been proposed by Ou [8] and Szabo [9]. Color harmony may be defined as color usage that pleases people [12], or when two or more colors seen in neighbouring areas produce a pleasing effect, they are said to produce a color harmony [13]. However, both Ou and Szabo s color harmony models failed to predict the results in research concerning the color harmony of juice packaging [14]. There are few research studies concerning which color combinations users prefer based on hue difference, which can broadly be described as the difference between two hue angles [7, p. 59]. Several researchers suggested that the preference for hue combinations might be individual and rotationally-invariant about the color wheel [15], which means independent on a certain distance between the hues on the color wheel. The color combinations that include blue have higher preference, which can indicate that the preference for hue combinations might be based on single hue preference, since blue is the most preferred single color [10, p. 204][16, p. 325]. In contrast, it have been reported that cultural factors play a role in color preferences between English and Chinese participants [17,18]. For example, those associated with the Chinese culture reported a higher preference for the reddish hues than those associated with the English culture. The authors argued that this difference may be due to the color red being a symbol for good luck in the Chinese culture. By examining preferences for color combinations, which may be based on an individual s cultural background, it could be possible to identify hue combination preference patterns that could lead to the formulation of guidelines on how to combine hues for a target audience in different cultural contexts. Based on this reasoning, the aim of this article is to identify, formulate, and evaluate guidelines that may support designers when combining color hues for websites in different cultural contexts, specifically the Swedish and Thai cultures. Correspondingly, the research process of this article is guided by the following question: How can design guidelines be formulated to support designers in the process of combining color hues for websites in the context of the Swedish and Thai cultures? The research question will be addressed by using a quantitative methodology approach. The article will proceed as follows. Section 2 conducts a theoretical review of classic color harmonies, cultural differences in color perception and preference, and culturally appropriate color use in web design. Section 3 describes the research methodology with a focus on the quantitative approach. Section 4 identifies, describes, and evaluates design guidelines for combining color hues for websites aimed at target audiences in Sweden and Thailand. Section 5 concludes the article by discussing the potential implications of the proposed guidelines and providing suggestions for future work. 2. Literature Review 2.1. Colors Classic color harmonies support the notion that the preference and harmony of color combinations are rotationally-variant along the color wheel, i.e., the angle and distance between two hues on the color wheel determine if they would be perceived as harmonious and attractive. An example of classic color harmonies is the complementary color scheme that is constructed using hues opposite on the color wheel and is thought to be harmonious [11, p. 21]. International Journal of Web Applications Volume 10 Number 3 September

3 Contemporary research proves that classic color harmonies are invalid with regards to creating harmonious color combinations. A study where color wheels and complex images were studied showed negative harmony response for complementary hue combinations in color wheels and neutral in complex images [19, p. 366]. These results contradict the supposition that complementary combinations would be creating positive harmony responses, which is inconsistent with the assumption about complementary hue combinations being harmonious. In an another study two-color combinations proved harmonious if they were monochrome, that is, shared the same hue [9, p. 48]. The findings of this study revealed that non-monochrome two-color combinations did not prove to be harmonious, which suggest that the assumption that complementary or triadic hue combinations would be harmonious may not be completely accurate [9, pp ]. In addition, it was identified that users prefer neighboring hues [9, pp ] while in an other study it was found that users prefer color combinations of colors that are most similar in hue [20, p. 567]. Furthermore, both Ou and Szabo s color harmony models failed to predict the results in the study of color harmony of juice packaging, even if the principles of equal-hue and equal-chroma were confirmed, i.e., two colors that have similar hue or chroma appear harmonious [14]. Concerning combining hues, the above suggests that the only valid principle confirmed in research is the principle of equal-hue, as indicated by different research studies [20, p. 567][9, pp ][14]. Further, color preference has been studied in the context of color themes and usercreated color combinations online [15]. The findings reveal that contrary to belief, preferences are not rotationally-invariant about the color wheel: green s complement is purple, yet these plots suggest users prefer to pair green with blue or yellow instead. On the other hand, orange often pairs with cyan, its complement on the hue wheel [15, p. 11]. This points to a possibility that the preference for hue combinations may be individual and rotationally-invariant about the color wheel. Individuals perceive the meaning of colors in various ways in different cultures. The following section will examine and describe cultural differences in color perception and preference Cultural Differences in Color Perception and Preference A growing body of research confirms existing cultural differences in color perception and preference. One study examined cross-cultural color preference and demonstrated distinct cultural differences in color preference among observers of different cultural backgrounds. The researcher has identified, for instance, a distinct Japanese preference for white color: the observers of cultural backgrounds not influenced by Japanese culture did not show high preference for white [21]. The results also showed that the only color that all cultural groups usually prefer highly is vivid blue, which indicates that color preference is strongly influenced by cultural variables. The global preference for blue, or the Blue-Seven Phenomenon, has been scientifically proven and thoroughly studied [21][22, p. 76][10, p. 204]. In addition, blue has been identified as the most preferred hue since 1934 [10, p. 204]. Other researchers have identified that blue is the hue that most likely creates harmony in color combinations [8, p. 201]. This could suggest that individuals might prefer color combinations including blue because blue is their preferred individual color, and because a certain correlation exists between harmony and preference [23, p. 37]. In the same line of thought, research has showed that harmony and preference are closely related, but have also differences: preferred color combinations have bigger difference in brightness while harmonious color combinations tend to be more similar in hue [20]. However, one study demonstrated that the responses for color harmony and color preference are highly correlated and can be predicted from each other [23, p. 37]. Therefore, it is possible to suggest that while color harmony and color preference should not be used interchangeably, they have much in common. Related research has studied the cultural influence of using individual colors in different contexts. For instance, one study examined the color perception of colored Thai desserts [24]. Two groups were formed and consisted of Austrian and Thai participants. The results revealed that Austrian participants preferred yellow desserts while Thai participants preferred green, which suggests a cultural difference. Other research studied the combination of hues in a cultural context [25]. Participants from eight countries were asked to match colors for a logo and the findings showed both cultural similarities and differences in combining colors. More specifically, participants from different countries displayed different tendencies when matching colors for a logotype [25]. Moreover, one study [26] extended the work of [18] by examining a Saudi Arabian Arab sample and comparing it with an English sample. The results revealed differences in hue preference for the Arabic and English samples where the former had a preference for the reddish hues while the latter for the blue-green region. Similarly, a cross-cultural investigation of color preferences was completed between British adults and Himba adults, who belong to a nonindustrialized 102 International Journal of Web Applications Volume 10 Number 3 September 2018

4 culture in rural Namibia [27]. For the Himba, the results showed that red hues and saturated colors were preferred. The British indicated a preference for green and blue hues. Because colors are perceived differently by different cultures, this may also be valid for other areas such as web design. The following section will examine culturally appropriate color use in the context of web design. 2.3 Culturally Appropriate Color use in Web Design One research study used large data sets of country-specific websites in order to identify culturally appropriate color usage in web design for fifteen countries [28]. The findings showed a color palette that was used in web design in all of the countries studied, as well as country-specific color palettes. The international color palette, i.e., the colors preferentially used in all the countries studied, consisted of white, black, different shades of grey, different shades of blue and a light yellow color [28, p. 932]. The researchers recommended web designers to use their identified international color palette when designing for an international target audience, rendering the design appropriate for cultural multitude. When localization would be necessary, such as designing for a countryspecific target audience, they recommended web designers to add country-specific colors. Nonetheless, they did not research color combinations and no guidelines for culturally appropriate color combinations were proposed. Furthermore, another study collected 2.4 million ratings of the visual appeal of websites from nearly 40 thousand participants to research colorfulness, visual complexity, and visual appeal of websites [29]. The aim of the research was to contribute with scientifically-based guidelines for web designers on how to design more appealing websites for their target audiences. They identified that colorfulness had a large main effect on appeal, and that a preference for different levels of colorfulness is highly influenced by a person s country. For example, Macedonians found highly colorful websites more appealing than any other nationality in the researched dataset. The researchers also discovered that Northern Europeans preferred lower colorfulness than Asians, such as Chinese, Singaporeans and Malaysians. Other research, which is related to culturally appropriate color use in web design, is that of the historical Yugoslav web domain [30]. Analyzing the visual data of the Yugoslav web domain, a study identified that color plays a non-arbitrary role as a characterizing element of a national Web domain. In particular, the combination of color and other structural elements of the domain (distribution of sub-domains and hyperlink topology) reveals patterns that distinguish between websites and yields a dynamic view of the changes in the visual appeal of the national domain over time [30]. Color use in a national web domain and color use that is culturally based have some differences mostly because a nation such as Yugoslav nation included many different cultural backgrounds. Yet, there are definite similarities and research has showed that color was a characterizing element of a national web domain [30]. This could indicate that color could play a role in culturally appropriate color use in web design as well. In summary, and in the context of web design, the mentioned theoretical underpinnings provide a rationale to identify potential guidelines for combining color hues in web design that considers the cultural background of Swedish and Thai participants. The next section will provide a description of the quantitative approach employed to address the research question of this article. 3. Methodological Approach The research question of this article necessitated a quantitative methodology approach to reveal patterns of culturally preferred color hues that may be translated to design guidelines. The obtained data forms a base to support the identification and formulation of the proposed guidelines in this article, which are described in section 4.2. Following this, the proposed guidelines were evaluated using an online survey that included both Swedish and Thai participants. 3.1 Participants To reach potential participants, an open call to the online survey including a link and an invitation to share in social media was released. A total of 57 participants completed an online survey to evaluate the proposed guidelines. Prior to conducting the survey, they were informed that participation was voluntary and anonymous. One participant was excluded due to invariable responses (e.g., either maximum or minimum scores). Additional six participants were excluded for indicating that they belonged to another culture than the Swedish or Thai ones. The resulting sample consisted of 50 participants divided into 20 males, 27 females, and 3 as other, with an age range from 22 International Journal of Web Applications Volume 10 Number 3 September

5 to 67 years (M age = 35:7; SD age = 8:6). Of these, 26 participants identified themselves as belonging to the Swedish culture and 24 to the Thai culture. Swedish participants consisted of 9 males, 14 females, and 3 as other with an age range from 25 to 67 years (M age = 37:1; SD age = 10:2). Thai participants consisted of 11 males and 13 females with an age range from 22 to 43 years (M age = 34:3; SD age = 6:4) Materials Data sets of Websites Two data sets were collected; one for Sweden and the other for Thailand, see Appendix A at the following link: fam/color/appendix-a.html. Each dataset consisted of 250 country specific websites. The selection criteria for these websites to be included into the sample frame was that the website had to be country specific, i.e., targeted for the respective country s users. With regards to cultural preferences, color hue combinations on websites are chosen by designers, not the users themselves. Yet, the body of designers as an information resource can reveal a certain knowing-in-action [31, p. 50], a cultural tacit knowledge. The data sets provided us with a possibility to reveal potential patterns of culturally preferred color hue combinations. In order to evaluate the proposed guidelines, a set of design concepts of websites were created using different color hue combinations based on the proposed guidelines described in section 4.2. These combinations were derived from an analysis of the mentioned data sets, see Appendix B at the following link: Based on these combinations, sixteen design concepts of websites were created and evaluated using an online survey, which will be described in the next section Online Survey An online survey was conducted with the purpose of evaluating the user preference for combinations created using the proposed guidelines for their respective cultural background: Thai or Swedish. The combinations were presented in the form of design concepts of websites. The online survey including the design concepts of websites is presented in Appendix C, which is available at the following link: The online survey consisted of 19 questions divided into two sections. The first section collected demographic information about participants such as age, gender (Male, Female, Other, or Prefer not to say), and cultural background (Thai, Sweden, or Other). The second section consisted of 16 questions where each question consisted of a design concept of a website together with a text message I like this color combination. Participants rated each design concept on a Likert-scale ranging from 1 (strongly disagree) to 5 (strongly agree). The design concept items showed satisfactory internal reliability (Cronbach s Alpha =.78). The 16 design concepts consisted of three groups. The first group consisted of five Thai designs: three polychromatic and two monochromatic. The second group consisted of five Swedish designs: three polychromatic and two monochromatic. The colors in the monochromatic design concepts, defined as using a single hue (Olgunturk & Demirkan, 2011), had a saturation difference of 70 steps according to the HSB scale. The accompanying neutral color, grey, black or white, was chosen depending on which neutral color was more popular for the relevant cultural background in the collected data from Thai and Swedish websites. While developing designs, it was taken into consideration that the data sets indicated that Thai websites use much higher visual contrast, i.e., visually perceived sense of contrast, than Swedish websites. The colors of Thai websites are often highly saturated and bright, dark colors are contrasted with saturated, bright colors, while Swedish websites have much lower visual contrast, colors have lower saturation, dark colors can be paired with very light colors of low saturation. Correspondingly, the last group consisted of six non-monochromatic designs that were developed using the same hue combinations as for the polychromatic culturally specific designs, but with a visual contrast that would be culturally opposite. Three designs in this group were low visual contrast (LVC) (hues of saturation 85 & 35 on HSB scale) and three were high visual contrast (HVC) (hues of high saturation 95 & 75 on HSB scale). This was achieved by varying saturation. All of the design concepts had a brightness difference of either 60 or 25 steps according to HSB scale. The third color, a tint, was used in order to give the website mockups more realistic look and more acceptable readability. The tint was constant in all nonmonochromatic design concepts with a saturation of 10 and a brightness of 95 according to HSB scale. 3.3 Procedure The sampling strategy chosen to research the color combinations on the collected Swedish and Thai websites was based on a number of inclusion and exclusion criteria. With regards to the inclusion criteria, the website had to be clearly designed for 104 International Journal of Web Applications Volume 10 Number 3 September 2018

6 respectively Thai or Swedish users. One indicator for this was a country-specific domain name extension, such as.se (Sweden) or.co.th (Thai), but it could not be the only indicator as the website could still be targeted specifically for foreigners (e.g., Bangkok Post s Post- Publishing.co.th). In addition, Swedish and Thai languages were used as indicators. For exclusion criteria, clearly international websites, such as Toyota.co.th, were not included in the study because their international graphic corporate identity could easily override country-specific design decisions. Websites that only used grayscale, due to the passing of the King of Thailand, were not included either. To describe colors, the current study adopted HEX triplets, i.e., hexadecimal numbers used in markup languages such as HTML and CSS to represent colors when coding websites. HSB color space was used in order to identify hue, chroma and brightness. Both HEX triplets and HSB are converted within Adobe Photoshop software and that eliminates the need for excessive external conversion that would reduce precision. A method was employed that captured a snapshot image of a website, i.e., the main page of a website that presents the design concept of the website and facilitates navigation to all other pages. The dominant color combination in each image was analyzed manually, leading to the extraction of two dominant colors from each website. The criteria for the extraction of colors are as follows: The colors had to rank high among all the other colors on the page in visual hierarchy (for instance, covering a large area, coloring a visually dominant element on the page, perceptually standing out), The colors had to have been actively chosen by a designer or be an element of the website design, such as the color of a background, a table, a font, as opposed to colors of content or photos used on the page which might have been uploaded without designer s intention or knowledge, The color combination had to have a hue, since the research question is about combining hues. When the dominant color combination includes one neutral color such as black or white which has no hue, and one color which has a hue, the color combination can be seen as consisting of a single hue (monochrome). When any of the colors have extreme HSB values (such as saturation with value of 1, which leads to no perceptual hue), they are perceived as grey, black or white (i.e., desaturated) and were categorized as such. In order to analyze the extracted dominant color combinations, the HSB color wheel was used [32]. Twelve main hues of the color wheel (yellow, yellow green, green, blue green, blue, blue violet, violet, red violet, red, red orange, orange and yellow orange) were categorized based on their HSB hue values. A color combination was evaluated as having high hue contrast if both hues were across each other on the color wheel. In the context of this study, hue contrast refers to the perceptually different hue values [33], not considering lightness or saturation, but only hue value. A color combination was evaluated as having low hue contrast when hues were either adjacent or having maximum one another hue in between them on the color wheel. Based on the collected quantitative data concerning dominant color combinations in Swedish and Thai web design, two guidelines were formulated. Based on the guidelines, sixteen design concepts of websites were created and evaluated using an online survey that included both Swedish and Thai participants. In the following, the results from the data sets and the online survey will be described. 4. Results and Analysis 4.1 Data Sets of Thai and Swedish Websites The analysis of all the dominant color hue combinations extracted from the collected Thai and Swedish websites is included in Appendix B, which is available at the following link: Several cultural differences were identified when analyzing the data sets of dominant color hue combinations in Thai and Swedish websites. The dominant color hue combinations in both Thai and Swedish websites were different, as presented in Table 1. Several culture-specific color hue combinations emerged. In Thai websites, a combination of violet and yellow orange was one of the most used (11 websites) while in Swedish websites it was completely absent. The other two culture-specific combinations for Thai websites were orange and blue (8 Thai websites, 1 Swedish website) and orange and yellow green (6 Thai websites, 1 Swedish website). In Swedish websites two culturespecific combinations were identified: yellow green and blue was dominant in 9 Swedish websites and 1 Thai, green and blue in 5 Swedish and 1 Thai website. Two additional culture-specific combinations International Journal of Web Applications Volume 10 Number 3 September

7 Dominant color hue combinations Thai Swedish Color hue combination Number of websites Color hue combination Number of websites red - blue 12 yellow orange - blue 11 yellow orange - violet 11 yellow green - blue 9 yellow orange - blue 10 red - blue 8 orange - blue 8 yellow orange - red 8 yellow orange - red 7 orange - yellow green 6 Table 1. Dominant color combinations in the collected Thai and Swedish websites were identified: red and green and yellow and red orange, but the difference of use in Thai and Swedish website was smaller, 4 Swedish websites and 1 Thai website for respective combination. Additionally, when analyzing hue contrast in the dominant combinations, another pattern emerged. The use of medium and low hue contrast combinations in both Swedish and Thai websites was approximately the same, but Thai websites used twice as much high hue contrast combinations (81 Thai w ebsites versus 41 Swedish websites). Swedish websites used much more monochromatic color combinations with only one dominant hue than Thai websites (157 Swedish websites versus 95 Thai websites). This indicates there is a preference for monochromatic combinations in Swedish web design and a preference for high hue contrast combinations in Thai web design. Further, there were differences even in monochromatic combinations (i.e., with black, white, grey or the same hue) where the more significant are presented in Table 2. Dominant hue in the monochromatic Number of Thai websites Number of Swedish websites combination green 5 10 red red violet 20 6 violet 5 0 blue green blue 0 9 Table 2. Significant differences between Thai and Swedish websites in monochromatic color combinations Based on these results, two design guidelines were proposed and will be described further in the next section. 4.2 Design Guidelines for Color Hue Combinations for Thai and Swedish Websites A frequently used method for reporting results in design studies is by means of design guidelines [34,35,36]. Within the area of technology-enhanced learning (TEL), the following definition of design guidelines has been proposed [37, p. 9]: 106 International Journal of Web Applications Volume 10 Number 3 September 2018

8 If you want to design intervention X [for the purpose/function Y in context Z], then you are best advised to give that intervention the characteristics A, B, and C [substantive emphasis], and to do that via procedures K, L, and M [proce dural emphasis], because of arguments P, Q, and R. Although this definition has been often used in educational design research [38,39,40], it is for several reasons of relevance for color research. First, the definition provides a context in which a guideline should be used. Second, it adds an aspect that involves what to do and how to do it. Finally, it contributes with arguments to why it should be done. For these reasons, the mentioned definition of design guidelines will be used for the proposed guidelines in this study. It is necessary to understand that the guidelines are not intended as recipes for success but to help others select and apply the most appropriate substantive and procedural knowledge for specific design and development tasks in their own settings [39, p. 119]. In the previous definition, the term of intervention refers to products, programs, materials, procedures, scenarios, processes [39, p. 5]. In the proposed guidelines, the term will be rephrased as Thai websites or Swedish websites. The guidelines are motivated by the collected data sets of Thai and Swedish websites. Content marked with italics is what changes between respective guideline Design Guideline 1: Color Hue Combinations for Thai Websites If you want to design a website for a Thai audience, then you are best advised to give this website one of the following hue combinations [(a) red and blue (b) yellow orange and violet (c) yellow orange and blue (d) orange and blue (e) yellow orange and red (f) orange and yellow green because this may support web designers in choosing culturally appropriate color combinations for a target audience. In addition, monochromatic combinations (with black, white, grey, or same hue) are preferred as well as high hue contrast combinations (consisting of hues across the color wheel from each other, with at least 3 other hues in between them on a 12-hue color wheel). In monochromatic combinations the preferred hues are red, red violet and blue. Even violet can be used in monochromatic combinations, which would not be recommended for Swedish web design. Additionally, high visual contrast and saturated, bright colors are recommended. Medium or heavy use of low saturated colors is not recommended. If using dark colors, it is advisable to contrast them with saturated, bright colors Design Guideline 1: Color hue combinations for Swedish websites If you want to design a website for a Swedish audience, then you are best advised to give this websites one of the following hue combinations [(a) yellow orange and blue (b) yellow green and blue (c) red and blue (d) yellow orange and red because this may support web designers in choosing culturally appropriate color combinations for the target audience. In addition, hue combinations such as green and blue can also be used. Monochromatic combinations (with black, white, grey, or same hue) are highly preferred. In monochromatic combinations the preferred hues are blue and red. Even green blue can be used in monochromatic combinations. Additionally, very high visual contrast such as visual contrast created by combining bright colors of high saturation is rarely recommended. Usage of low saturated or darker colors is fully acceptable. A dark color can be paired with a very light color of low saturation. 4.3 Evaluation of Design Guidelines In order to evaluate the proposed guidelines for color hue combinations for Thai and Swedish web design, an online survey was conducted. The online survey included sixteen design concepts of websites using color combinations presented in Table 3. All participants rated each design concept on a Likert-scale ranging from 1 (strongly disagree) to 5 (strongly agree). A mixed-model ANOVA with preference for color combinations as within-subject variable and culture as between-subject variable revealed a significant interaction effect, F (1, 48) = 13.67, p =.001, η 2 =.222. The effect size of p η2 =.222 indicates that 22% of the p variability can be attributed to the factor interface, which is considered a small effect size [41]. A two-tailed independent sample t- test was used as post hoc analysis to identify the source of the interaction. Thai participants rated Thai designs (M = 3.45, SD =.99) significantly higher than Swedish participants (M = 2.70, SD =.70), t (48) = -3.12, p =.003. While Swedish participants rated Swedish designs (M = 2.67, SD =.49) higher than Thai participants (M = 2.37, SD =.73), the results indicated only a tendency to significance, t (48) = 1.70, p =.097. International Journal of Web Applications Volume 10 Number 3 September

9 Sample id Type 1st color 2nd color 3rd color 1 Thai polychromatic, HVC Polychromatic, LVC Thai polychromatic, HVC Polychromatic, LVC Polychromatic, HVC Swedish polychromatic, LVC Polychromatic, HVC Swedish polychromatic, LVC Thai polychromatic, HVC Polychromatic, LVC Polychromatic, HVC Swedish polychromatic, LVC Thai monochromatic Thai monochromatic Swedish monochromatic Swedish monochromatic Table 3. The hue, saturation, and brightness (HSB) values of the colors utilized in creating the design concepts of websites for the online survey. High visual contrast (HVC) and low visual contrast (LVC) were varied The results from the ANOVA also showed a significant main effect of preference for color combinations, F(1, 48) = 14.90, p <.001, η 2 =.237, where participants in general rated Thai designs (M = 3.06, SD =.92) higher than Swedish designs (M = 2.53, SD =.63). p Further analysis showed a significant main effect of preference for monochromatic designs, F(1, 48) = 5.99, p =.018, η 2 =.111. By p and large, participants rated monochromatic Thai designs higher (M = 3.25, SD = 1.12) than monochromatic Swedish designs (M = 2.80, SD =.85). No other main or interaction effects were found. 5. Discussion The aim of this article was to to identify, formulate, and evaluate guidelines that may support designers when combining color hues for websites in different cultural contexts, specifically the Swedish and Thai cultures. The research question guiding the process was: How can design guidelines be formulated to support designers in the process of combining color hues for websites in the context of the Swedish and Thai cultures? A quantitative methodology approach was used to address this research question. Based on an analysis of five hundred Thai and Swedish websites, two design guidelines were proposed. The design guidelines were evaluated using a set of sixteen design concepts of websites in an online survey that included both Swedish and Thai participants. The results showed that culture play a role when evaluating color hue combinations. More specifically, Thai participants rated Thai designs significantly higher than Swedish participants, but the reverse was not true for Swedish designs. Thai designs were as well rated higher than Swedish designs by all participants. A possible explanation to the overall low preference for Swedish designs may be an indication that the currently practised color combining in Swedish web design is not optimal for the target audience since the designs for the survey were created based on the color combinations extracted from Swedish websites. The 108 International Journal of Web Applications Volume 10 Number 3 September 2018

10 While not directly comparable, similar research involving large data sets has been conducted and collected ratings of colorfulness and visual appeal of 450 websites [4]. The data was used to develop quantitative models to predict the initial appeal of a website. The guidelines for color combinations for Thai and Swedish web design have similarities with Reinecke s et al models of appeal in that they are also based on demographic variables, i.e., the cultural background of participants. These similarities may further confirm the validity of the chosen approach. Other researchers studied large data sets of country-specific websites in order to identify culturally appropriate individual color usage in web design for fifteen countries [28], but neither Sweden nor Thailand were included. The findings showed a color palette that was used in web design in all of the studied countries (white, black, grey, different shades of blue, light yellow), as well as country-specific color palettes. Findings of this article also show frequent use of black, white, grey and different shades of blue, being in agreement with previous results [28], who stated that these colors can be seen as the international color palette. Existing research [28,30] further confirm the country-specific color use and preference in the context of web design. Distinct cultural differences in color preference have also been suggested [21]. Previous studies proved cultural preferences for individual colors, but not for color combinations. This article contribute to this research area by affirming that cultural preference for hue combinations exist in the context of web design. In conclusion, studies of color preference may need to move away from identifying or merely summarizing color preferences and begin to consider how results may be translated or extrapolated to areas with practical implications, for example web design. Identifying and evaluating design guidelines could be a potential path to begin building a repertoire of hue combinations that may aid designers and other stakeholders in the process of developing websites for different target audiences or cultural contexts. Future directions could aim to replicate and extend the current research to other cultures, which may have implications for practitioners working in the area of web design and to the broader debate whether color is culturally relative. References [1] Bergström, B. (2009). Effektiv visuell kommunikation: om nyheter, reklam och profilering i vår visuella kultur (7 ed.). Stockholm: Carlsson. [2] Bortoli, M. D., Maroto, J. (2001). Colours across cultures: Translating colours in interactive marketing communications. Paper presented at the European Languages and the Implementation of Communication and Information Technologies (Elicit) Conference, University of Paisley. [3] Lindgaard, G., Fernandes, G., Dudek, C., Brown, J. (2006). Attention web designers: You have 50 milliseconds to make a good first impression! Behaviour & Information technology, 25 (2), [4] Reinecke, K., Yeh, T., Miratrix, L., Mardiko, R., Zhao, Y., Liu, J., Gajos, K. Z. (2013). Predicting users first impressions of website aesthetics with a quantification of perceived visual complexity and colorfulness. Paper presented at the SIGCHI Conference on Human Factors in Computing Systems, Paris, France. [5] Sillence, E., Briggs, P., Fishwick, L., Harris, P. (2004). Trust and mistrust of online health sites. Paper presented at the SIGCHI Conference on Human Factors in Computing Systems, Vienna, Austria. [6] Kaminski, J. (2016). Set the site mood with color. Retrieved from com/color.html [7] Hunt, R., Pointer, M. (2011).Wiley-IS&T Series in imaging science and technology: Measuring colour, 4, Somerset, NJ: John Wiley & Sons. [8] Ou, L.-C., & Luo, R. M. (2006). A colour harmony model for two-colour combinations. Color Research & Application, 31 (3), [9] Szabó, F., Bodrogi, P., & Schanda, J. (2010). Experimental modeling of colour harmony. Color Research & Application, 35 (1), [10] Camgöz, N., Yener, C., Güvenç, D. (2002). Effects of hue, saturation, and brightness on preference. Color Research & International Journal of Web Applications Volume 10 Number 3 September

11 Application, 27(3), [11] Stone, T. L. (2006). Color design workbook: A real-world guide to using color in graphic design. Gloucester, MA: Rockport Publishers. [12] Granville, W. C. (1987). Color harmony: What is it? Color Research & Application, 12(4), [13] Judd, D. B., Wyszecki, G. (1975). Color in business, science, and industry. New York: John Wiley & Sons. [14] Wei, S.-T., Ou, L.-C., Luo, R. M., Hutchings, J. (2015). Psychophysical models of consumer expectations and colour harmony in the context of juice packaging. Color Research & Application, 40 (2), [15] O Donovan, P., Agarwala, A., Hertzmann, A. (2011). Color compatibility from large datasets. ACM Transactions on Graphics, 30 (4), [16] Blanchard, E., Kabene, S. M. (2010). Handbook of research on culturally-aware information technology: Perspectives and models (1). Hershey, PA: Information Science Reference. [17] Ling, Y., Hurlbert, A., Robinson, L. (2006). Sex differences in colour preference. In N. J. Pitchford & C. P. Biggam (Eds.), Progress in Colour Studies 2: Cognition. Amsterdam: John Benjamins. [18] Hurlbert, A., Ling, Y. (2007). Biological components of sex differences in color preference. Current Biology, 17(16), R623-R625. [19] Ou, L.-C., Chong, P., Luo, R. M., Minchew, C. (2011). Additivity of colour harmony. Color Research & Application, 36 (5), [20] Schloss, K. B., Palmer, S. E. (2011). Aesthetic response to color combinations: preference, harmony, and similarity. Attention, Perception, & Psychophysics, 73 (2), [21] Saito, M. (2015). Comparative (cross-cultural) color preference and its structure. Encyclopedia of color science and technology. New York, NY: Springer Science Business. [22] Suk, H.-J., Irtel, H. (2010). Emotional response to color across media. Color Research & Application, 35 (1), [23] Ou, L., Ronnier Luo, M., Sun, P., Hu, N., Chen, H., Guan, S., Woodcock, A., Caivano, J. L., Huertas, R., Treméau, A., Billger, M., Izadan, H., Richter, K. (2012). A cross-cultural comparison of colour emotion for two-colour combinations. Color Research & Application, 37 (1), [24] Jantathai, S., Sungsri-in, M., Mukprasirt, A., Dürrschmid, K. (2014). Sensory expectations and perceptions of Austrian and Thai consumers: A case study with six colored Thai desserts. Food Research International, 64(October 2014), [25] Madden, T. J., Hewett, K., Roth, M. S. (2000). Managing images in different cultures: A cross-national study of color meanings and preferences. Journal of International Marketing, 8(4), [26] Al-Rasheed, A. S. (2015). An experimental study of gender and cultural differences in hue preference. Frontiers in Psychology, 6 (30), 1-5. [27] Taylor, C., Clifford, A., Franklin, A. (2012). Color preferences are not universal. Journal of Experimental Psychology: General, 142 (4), [28] Kondratova, I., Goldfarb, I. (2006, 29 Oct - 3 Nov). Cultural interface design: Global colors study. Paper presented at the conference on the move to meaningful Internet systems, Montpellier, France. [29] Reinecke, K., Gajos, K. Z. (2014). Quantifying visual preferences around the world. Paper presented at the SIGCHI Conference on Human Factors in Computing Systems, Toronto, Ontario, Canada. [30] Ben-David, A., Amram, A., Bekkerman, R. (2016). The colors of the national Web: visual data analysis of the historical Yugoslav Web domain. International Journal on Digital Libraries, 12(2016), [31] Schön, D. A. (2003). The reflective practitioner: How professionals think in action. Aldershot: Ashgate. [32] Sowards, E. (2011). HSL color wheel. Retrieved from erinsowards.com/articles/2011/01/colors.php [33] Itten, J. (1973). The art of color: The subjective experience and objective rationale of color. New York, NY: Van Nostrand Reinhold. 110 International Journal of Web Applications Volume 10 Number 3 September 2018

12 [34] Dix, A. (2010). Human-computer interaction: A stable discipline, a nascent science, and the growth of the long tail. Interacting with Computers, 22 (1), [35] Dourish, P. (2004). What we talk about when we talk about context. Personal Ubiquitous Computing, 8 (1), [36] Faraon, M. (2018). Co-creating democracy: Conceptualizing co-creative media to facilitate democratic engagement in society. (Doctoral Thesis), Stockholm University, Stockholm. [37] van den Akker, J. (1999). Principles and methods of development research. In J. van den Akker, N. Nieveen, R. M. Branch, K. L. Gustafson, & T. Plomp (Eds.), Design methodology and developmental research in education and training (1-14). The Netherlands: Kluwer. [38] Eliasson, J. (2013). Tools for designing mobile interaction with the physical environment in outdoor activities. (Doctoral Thesis), Stockholm University, Stockholm. [39] McKenney, S., Nieveen, N., & van den Akker, J. (2006). Design research from a curriculum perspective. In J. v. d. Akker, K. Gravemeijer, S. McKenney, & N. Nieveen (Eds.), Educational design research (67-90). London: Routledge. [40] Nouri, J. (2014). Orchestrating scaffolded outdoor mobile learning activities. (Doctoral Thesis), Stockholm University, Stockholm. [41] Cohen, J. (1988). Statistical power analysis for the behavioral sciences (2 nd ed.). Hillsdale, NJ: Erlbaum. International Journal of Web Applications Volume 10 Number 3 September