The Effect of Age and Information Design on the Perception of Visual Aesthetics

This paper investigates the interplay of information layout, colour temperature (or colour scheme), aesthetics-type and age in the judgment of aesthetics in mobile website design. Having this knowledge will help designers serve users better through personalization. Hence, using the tourism domain as a case study, we conducted an empirical study (n = 323) on the perception of visual aesthetics , using eight versions of a mobile website, comprising two types of layout (grid and list) and four colour schemes (blue, green, orange and red). The results of our Analysis of Variance show that there is a main effect of aesthetics-type and an interaction between layout, colour temperature and age. Users perceive the presented website designs as more classically aesthetic than expressively aesthetic , with younger people being more critical than older people. Moreover, older people tend to be indifferent about the website colour schemes, while younger people tend to prefer moderate-temperature (green and orange) to extreme-temperature (blue and red) grid-style colour schemes. We discuss the implications of our findings for both age groups. classical aesthetics, expressive aesthetics, layout, colour age.


INTRODUCTION
In human-computer interaction (HCI), visual and information designs are important to users when assessing the credibility of a website (Fogg et al. 2002;Shirk 2016). If these are not well implemented in an e-commerce website, for example, vendors may lose potential customers as a result of poor presentation and organization of information. Moreover, both types of designs are important in the mobile domain, where the screen is relatively smaller than the desktop screen, making the user experience (interacting with content) more challenging (Chen & Huang 2003;Oyibo & Vassileva 2017a). Though there are de facto information designs and various visual designs of information, there is limited research on which of them different user groups perceive best and prefer most. Having insight into user preferences and perceptions of different web designs will help designers better personalize them to different user groups. In this study, we focused on investigating how the layout of information, colour temperature, aesthetics-type and age influence the perception of visual aesthetics of mobile websites in the tourism domain. We chose this domain because research has shown that information design is instrumental to an effective search for information in travel websites (Fogg et al. 2002). Research has also shown that visual design, e.g., colour scheme (Oyibo et al. 2016), is important as well. Thus, we based our study on eight versions of a mobile website with two different layouts (grid and list) and four colour schemes (blue, green, orange and red). The results of our Analysis of Variance (ANOVA) show that: (1) overall, users perceive the presented web deigns as more classically aesthetic than expressively aesthetic; (2) users perceive the grid-style websites as more aesthetic than the list-style websites; (3) younger people are more critical of the mobile website designs than older people; (4) older people tend to care less about the colour scheme of the website, while younger people tend to prefer moderate-temperature (green and orange) gridstyle websites to extreme-temperature (blue and red) grid-style websites. We discuss the implications of our findings and make recommendations to mobile web designers in the tourism domain.

BACKGROUND AND RELATED WORK
In this section, we provide an overview of visual design and information design in HCI.

Visual Design
Visual design refers to the graphical look and feel of a website, which appeals to the emotions of users. (Cyr 2009). One affective attribute of a visual design is its aesthetic appeal. The visual appeal of HCI artefacts, including websites, and the delight of the senses of perception is regarded as visual aesthetics. Lavie & Tractinsky (2004) found that visual aesthetics is composed of two dimensions: classical aesthetics and expressive aesthetics. Classical aesthetics is associated with the traditional notion of beauty as well as usability (Oyibo & Vassileva 2017b). Thus, it is described by terms such as -well-organized,‖ -symmetrical,‖ -clear,‖ etc. On the other hand, expressive aesthetic reflects the creative power of the designer, including originality. Thus, it is described by terms such as -creative,‖ -fascinating,‖ etc. (Lavie & Tractinsky 2004). In HCI research, colour has been identified as a key visual element in web design. It can be effectively used to convey the intention and emotion of the designer to users (Guohua 2015). Essentially, colour comprises two types of temperature: cool (e.g., blue, green, etc.) and warm (e.g., orange, red, etc.). Prior research (Coursaris et al. 2008;Oyibo et al. 2016) has shown that colour temperature can impact the perceived aesthetics and credibility of travel websites. However, these studies did not examine the interplay of colour and layout and the moderating effect of age.

Information Design
Information design refers to website elements that are used by designers to clearly and accurately convey information about products and services to users (Cyr 2009). Specifically, it entails the organization and structure of information on the screen, which enables users to interact with the content of a website easily. Prior research has shown that information design can affect the success of a website. Shirk (2016) found that it can negatively impact web credibility and perceived trust. Cyr (2009) found that improper information design can cause customer dissatisfaction and make e-commerce vendors lose customers eventually. However, there are limited studies that have examined the interactive effect of layout and age on perceived aesthetics.

METHOD
In this section, we present our research objective and design, measurement instruments and participants' demographics.

Research Objective and Design
The aim of our study is to investigate the interaction effect of three web attributes (layout, colour temperature and aesthetic-type) and users' age on perceived visual aesthetics in the mobile domain. Given the paucity of research in this area, we adopted an exploratory mixed-design approach. We designed eight versions of a mobile website with two standard layouts (grid and list) and four common colour schemes-blue (coldest), green, orange and red (warmest)-as shown in the Appendix. In our online survey, each participant was presented with one version of the web design in a randomized fashion and asked to answer questions on classical and expressive aesthetics.

Measurement Instruments
We used existing validated instruments to measure the visual aesthetics constructs: classical aesthetics (3 items) and expressive aesthetics (3 items), Table 1 shows the scales and their respective items, each of which ranged from -strongly disagree (1)‖ to -strongly agree (7).‖ They were adapted from previously validated scales (Lavie & Tractinsky 2004;van Schaik & Ling 2009). The overarching question preceding all of the items in the questionnaire is: -Assume you were to use the [shown] website to search for a specific travel information (your job or task). Please rate the website based on the following criteria.‖

Participants
The study was submitted to and approved by the behavioral research ethics board of our university. We used Amazon Mechanical Turk to recruit participants in an online survey. Each participant was compensated with $0.5 in appreciation of their time. A total of 323 subjects participated in the study. Table 2 shows a summary of the demographics: 52.3% males and 47.3% females.

DATA ANALYSIS AND RESULT
Normality test showed that our data is not normal. Thus, we carried out non-parametric analysis. The reliability test for our visual design constructs was based on McDonald's omega (ω) (Dunn et al. 2014), which was above 0.7 for both constructs: classical aesthetics and expressive aesthetics. Figures 1 and 2 show the overall mean ratings of the two aesthetics-types for the subgroups. With respect to classical aesthetics, the overall average (µ) across all 8 versions of web design for younger and older people is 4.49 and 5.02, respectively. Both of these values are way above the neutral value of 3.5 (the red bar). However, with respect to expressive aesthetics, the overall average across all 8 versions of web design for younger and older people is 3.51 and 3.62, respectively, which are marginally above the neutral value of 3.5.

Age-based Layout and Colour ANOVA
Further two-way ANOVA between colour scheme and layout at both levels of age shows the following: 1. Younger: There is an interaction effect between layout and colour scheme (F 3, 390 = 5.01, p < 0.01). 1. There is a marginal significant difference between the green colour scheme and the blue colour scheme (p = 0.055).

Older
2. There is a significant difference between the orange colour scheme and the blue colour scheme (p < 0.05).
3. There is a significant difference between the green colour scheme and the red colour scheme (p < 0.001).
4. There is a significant difference between the orange colour scheme and the red colour scheme (p < 0.05).

Layout-based Age and Colour ANOVA
Further two-way ANOVA between colour scheme and age at both levels of layout shows the following: 1. List: There is a simple main effect of age (F 3, 350 = 5.17, p < 0.05).
For the grid-style colour schemes, Kruskal-Wallis one-way ANOVA at both age levels shows the following:

Colour-based Age and Layout ANOVA
Further two-way ANOVA between age and layout at all four levels of colour scheme shows the following: 1. Blue: There is neither a main effect of layout (F 1, 102 = 1.86, p = n.s) and age layout (F 3, 102 = 0.34, p = n.s) nor an interaction between both factors (F 3, 102 = 0.00, p = n.s).
For the green colour scheme, the results of Kruskal-Wallis one-way ANOVA (based on age) at both levels of layout are as follows: 1. List: There is a significant difference between the younger and older users [χ 2 (1) = 9.31, p < 0.01].
For the orange colour scheme, the results of Kruskal-Wallis one-way ANOVA (based on age) at both levels of layout are as follows: 1. List: There is a marginal significant difference between the younger and older users [χ 2 (1) = 3.62, p = 0.057].

DISCUSSION AND CONCLUSION
We have presented the results of how users perceive various designs of a mobile website and the moderating effect of age, layout, colour scheme and aesthetics-type. Our results show that, overall, (1) participants perceive the web designs as more classically aesthetic than expressively aesthetic; (2) participants prefer the grid to the list layout; (3) younger people are more critical of the designs than older people; and (4) the green and orange grid-style colour schemes are more preferable to younger people than the other grid-style colour schemes. Moreover, our results show that there is an interaction between age, layout and colour scheme in the perception of aesthetics. We discuss the main findings in the following paragraphs.
First, with respect to the grid-style designs, for older people, there is no significant difference among the aesthetics perceptions of the four designs. However, younger users perceive the orange colour scheme as more aesthetic than the blue and red colour schemes. They also perceive the green colour scheme as more aesthetic than the blue colour scheme. Hence, with the aesthetics rating of the orange colour scheme being almost significantly higher than that of the blue colour scheme (p = 0.055), these results tend to suggest that younger people prefer moderatetemperature (green and orange) grid-style websites to extreme-temperature (blue and red) grid-style websites. However, this finding needs to be further investigated in future work.
Second, with respect to the list-style designs, older people (µ = 4.18) perceive them as more aesthetic than younger people (µ = 3.73) do [p < 0.01]. This suggests that older people tend to prefer the list-style organization of information more than younger people do.
Finally, with respect to the colour scheme of web design, younger and older people tend to differ. Specifically, younger people (µ = 3.79) perceive the red colour scheme as less aesthetic than older people (µ = 4.39) do [p < 0.01]. Similarly, younger people (µ = 3.55) perceive the list-style green colour scheme as less aesthetic than older people (µ = 4.64) do [p < 0.01]. This indicates that, overall, irrespective of the colour temperature (cool or warm), younger people tend to be more critical of the perceived aesthetics of mobile websites than older people. The implication of this finding, in general, is that, in user interface design of mobile websites, in order to appeal to and/or please younger people visually, designers may have to do more creatively than they will do to appeal to and/or please older people.
In conclusion, based on our findings, we recommend the following in the context of tourism website design in the mobile domain: 1. Irrespective of the age group, the grid-style web design should be given priority in the organization of content in the mobile screen, especially when all of the content can fit into a single screen.
2. For younger people, moderate colour temperatures (green and orange) should be given priority over extreme colour temperatures (blue and red). However, for older people, any colour may work, as they care less about website colour scheme.
In future work, to enhance personalization of mobile website design to user characteristics, we look forward to analyzing the qualitative response of participants to gain deeper insight into their perceptions, judgments and preferences.