Creative Interpretation in Web Design Experience

: Insight into how people mentally represent, and thus, make sense of visual designs is the key to understanding how people interact with technological devices. This paper presents a study in which participants were asked to write their interpretations of two webpage design examples, based on what they thought they would say and what would remain as a thought. The data comprised 80 3E-templates (N = 40), a template allowing participants to express experiences through writing and drawing. Inductive data analysis through a phenomenological lens revealed that supposed mental and verbal representations concentrated on the following design properties: colors, themes, interface layout and quality, which are further reflected in terms of visual usability, aesthetic evaluations, emotions and physical feelings. Representations of themes functioned as the unifying components of the visual experience. Involvement through curiosity and strategic operationalisation of ambiguity are identified as direct design implications of the study.


Introduction
Experiences of the world are generated via complex, dynamic interactions and relationships. Scholarship in the fields of cognition, philosophy and neuroscience, has focused on gaining insight into the nature of experience, and how it is formulated. Schools of thought dedicated to understanding the mind address these issues, including mind-body dualism, materialism, idealism, and phenomenology (Priest, 1991;Robinson, 1994). In phenomenology, the conscious experience of an object is mentally bound, while still maintaining a direct relationship with the perceived world (Husserl, 1970). In other words, the way in which we experience phenomena is through perception, signification, retention, and protention -expectation and anticipation for what is going to happen next (Husserl, 2001). Intentionality or "aboutness" is what directs the individual to experience the same phenomena in different ways (Rollinger, 1999).
When perceiving and experiencing designs, the way we experience and how experience is constructed, depends on how we subjectively arrange available information. When experiencing a design dominated by visual properties, the way we mentally construct our impressions is not simply based on what we see, but on what we connect to the observed design. We experience phenomena through previous experiences, knowledge and associations (Mednick, 1962). This is dependent on our intentions and motivations behind encounters. According to phenomenology, we argue that experiencing is a creative process. This creative process is influenced by the above-mentioned dimensions and factors, including mental states, and mentally stored multisensory data (Brave and Nass, 2007) -residue from past encounters with material of a similar nature. This act of constructing mental representations from mental contents is referred to as apperception (Saariluoma, 2003;Silvennoinen, Rousi, Jokinen and Perälä, 2015). Apperception is the process whereby new experiences are integrated into a person's past experiences and knowledge (Runes, 1972). Apperception is an active and creative process that not only portrays an understanding of the encountered design but also defines the design itself (Saariluoma & Rousi, 2015). Through isolating factors contributing to apperception of design elements and subsequent emotional reactions, designers have greater control in styling their design towards desired experiential outcomes (Rousi, 2013).

Creativity in the User's Experience
Creativity is defined as "the capacity to create a solution that is both novel and appropriate" (Sternberg, 1999, p. 3). It comprises activities enabling the realisation and fabrication of an innovative product or outcome (Candy and Edmonds, 1999;Sternberg and Kaufman, 2010;Csikszentmihalyi, 1996). Margaret Boden (2004) describes creativity as an element of human intelligence that encompasses cognitive processes: perception, conceptual thinking, visual thinking, memory, and reflective self-criticism. Manifold cognitive processes rest at the core of life changing innovations.
Through creative work, a practitioner communicates and expresses meaning. As a result, the outcome is a creative experience for receiver and creator. This is described as persuasion (Simonton, 1995), whereby creative people, processes and products have the capacity to change people's thoughts. In the creative arts and design, people are trained in sensitivity when perceiving phenomena. Creative practitioners are encouraged to strengthen their intentionality (Husserl, 1970), store and draw upon this information during creative processes (Eisner, 2002). Creative practitioners are able to transfer diverse experiences to the receiver by using socially influential elementsmetaphors, themes, compositions, and an atmosphere of the design that fosters impact intended for communication.
This research addresses the question: What kinds of creative associations arise during visual web design experience? For this, we utilised a multi-dimensional approach that considered creativity through empirical data collection and analysis. The study differs from previous research as it explicitly accounts for the way users describe how they mentally represent their experiences. Here, qualitative data is seen as creative interpretations of empirical tasks, visual webpage designs and experiences of these designs. The key idea behind the study was to enrichen the qualitative data obtained from participants by adding an extra layer to their evaluations of webpage designs. The enrichened data enables designers to gain detailed information regarding the cognitive-emotional responses of viewers in light of specific design elements.

METHOD
Verbalising experiences is a difficult task (Prinz, 2012). The 3E (expressing emotions and experiences) -template (Tähti and Arhippainen, 2004;Tähti and Niemelä, 2006) was chosen for this study, because it allows for reflection and expression of participant thoughts and impressions both verbally and nonverbally: writing and drawing ( Figure 1). Two visual stimuli were provided through which participants communicate their experiences: thought bubbles and speech bubbles. The bubbles are interpreted in a way that the thought bubble is used to depict inner thoughts and the square-like bubble is for oral expression (Tähti and Niemelä 2006). The purpose of the model is to enable the participant to express all experiences, including negative ones, more freely than for example in interviews, to collect all dimensions and qualities of visual web experience. The empirical task itself involved critical self-reflection and metacognition in terms of what the participant thought they would say, and what they perceived would remain in thought. Participants were encouraged to sensitively perceive the visual webpage designs and analyse the dimensions through which these designs were represented. The research data comprises written and drawn reflections and interpretations on the example webpages. Eighty completed paper templates in total were collected.

Participants and Stimuli
Participants (N = 40) were 85% male and 15% female. Most were university students. Students were asked to fill in two 3E-templates based on two webpage stills ( Figure 2). They were informed that returning the templates was not mandatory. Circumstances of the data collection were similar for all respondents. Participants were introduced to the webpage designs and to the template. Participants were given the same instructions, allotted the same amount of time for viewing the designs, and answering the template. Participants viewed the webpage designs in the same auditorium from a projection screen, and were given 20 minutes in total to fill in two templates.
Careful selection took place to establish the appropriate website design examples for the study. Two designs (Figures 2) were selected as stimuli for the study, both designs were from the CSS Zen Garden webpage gallery (http://www.csszengarden.com). The webpage designs have exactly the same content, but the content is communicated via different visual designs. As seen in Figure 2, the design factors oppose each other in terms of colour, balance and layout, font style, font size, and overall use of space (e.g. user interface 1 includes diagonal lines and is unbalanced, and user interface 2 is symmetrical with horizontal and vertical lines).

Figure 2. User interface 1 and 2 used in data collection
Different designs were chosen to arouse creative associations to be apperceived according to participants' previous experiences. The two webpage designs differ from each other in regards to design features, in order to provoke participants to comparatively analyse the designs. The differing designs support the data analysis method, in that evaluations with content analysis are often comparative (Bell, 2004).

Analysis
Data collected with 3E-templates was analysed by content analysis (Bell, 2004), which was driven by the rationale of Personal Construct Theory (PCT) (Green, 2004;Kelly, 1955). PCT was chosen as the conceptual methodology as it explains the way in which people linguistically construct their world and its phenomena through categories and constructs. Ways in which we represent our experiences are reliant on productive linguistic processes (Perlovsky and Levine, 2012;Schank, 1972). According to PCT, people understand the world through organising encountered phenomena into categories. Constructs, or mental and verbal representations of phenomena, are sorted according to these categories.
Categorisations derived from authors through iteration until mutual agreement was found. The first analytical stage was the coding data into constructs -80 3E-templates containing three to seven notions in one template. Constructs were added to a table according along with participant details, and whether the construct was stated in the thought or speech bubble. The second stage saw a revisiting of the data along with pre-categorisation. The aim of the third phase was to evaluate the categories and ensure that initial categories did not include overlapping content. This was an iterative process, whereby categories were examined, re-ordered and re-classified. Re-classification involved cross-reference and mutual agreement between authors. In the fourth stage the relations between constructs were analysed to assure the categories. After categories were agreed upon, connections between categories were examined to detect interrelationships, through which the last level of categorisation was conducted. Frequencies of written attributes were calculated in the next phase to detect emphasis between attributes and whether attributes were expressed in thought or speech bubbles.

RESULTS
Results of the content analysis revealed nine content categories. These were: 1) interface quality, 2) interface layout, 3) visual usability, 4) involvement, 5) emotions, 6) theme, 7) colours, 8) aesthetic evaluation, and 9) physical feelings. More notions were expressed in the space available for speech, than for thought ( Figure 3). Overall, 240 (69%) notions were represented in relation to what participants felt they would express verbally, and 109 (31%) were represented in the area available for thought. Participants provided 349 notions in total. Variations could be seen in the semantic nature of the notions used for either speech or thought. Furthermore, clear differences in the significance of the categories, or web design dimensions, could be seen between the speech and thought representations.

Figure 3. Frequency of notions and participants in speech and thought categories
Firstly, similarities rest in the importance of visual usability and aesthetic evaluation in both the speech and thought data. However, the theme category was more dominant in the thought data than in the speech data. Secondly, colours also received substantial attention in both the speech and thought data, yet involvement appears stronger in the overall thought results, than in the speech. Thirdly, emotions -while being a smaller category -remain more represented in the speech data than in the thought data. The categories of speech and thought are described in the following sections.

Interface Quality
The first category to emerge from the data was interface quality, which was expressed in terms of clarity evaluations. Unclear impression of the user interface gained most emphasis, while there was only one positive statement of clarity regarding one of the interfaces. Contrast was stated in terms of text against background, as well as when there was a lack of contrast in general. The quality was also assessed in terms of general impressions of the quality in statements such as "Deficiencies of the appearance can be compensated if the webpage serves its purpose."

Interface Layout
The use of space was often mentioned in speech bubbles, and it referred to the use of negative space and active space. Balance was also repeatedly mentioned, referring to both balanced and imbalanced elements, as well as the overall composition. Structure was discussed in terms of organisation, confusion and comprehension. The centering of the content was referred to as a positive feature, this contrasted with what was stated regarding the alignment of the content, which was negatively expressed.
Asymmetry was mentioned once in terms of "youthful asymmetry." Regarding thought expressions, balance was the notion which was often related in the thought bubbles, and once again, this was emphasised in the notions of "imbalanced." Following this, the use of space was also referred to, in response to the excessive amount of negative space observed in the designs. Structure, clutter and alignment were all mentioned once.

Visual Usability
Visual usability was one of the two most stressed factors in the participants' evaluations. Both for speech and for thought. Font clarity attracted the most attention. It was discussed in relation to font legibility, colour contrast between font and background, text size contrast, and font style. Font clarity was expressed in statements such as: "text awfully too small in relation to the elements." Focus was mentioned frequently in terms of the elements guiding attention and gaze. Use of space was also considered as a guiding element. There was emphasis on the importance of seeking the content that is visually accentuated: "attention everywhere." Reflections were also made in terms of the directions in which the attention was guided. Moreover, participants mentioned elements that distracted attention, such as too many different shapes, the edges of the page, and pictures i.e. "the flame draws attention constantly". Titles and logos were considered important in contributing to the focal area and assumed to be easily distinguishable. Usability conventions focused on links and positions of the links, while navigation, the position of navigation elements, and conventional placement of these elements were additionally stated in comments such as: "looks weird because the navigation is on the right side."

Involvement
In the speech bubbles the notions were described through emotions, and differing states, e.g., curiosity, indicating personal relationships towards the design. Overlapping elements elicited interest towards the design. Curiosity in response to the webpages was elicited through partial covering of information and elements, and not revealing everything at once. Curiosity was mentioned, for instance in the following words: "What's lurking behind the background picture?"; "I wanna see the picture behind it"; and "what is in there?". Intensity alluded to a higher level of involvement, induced by the evaluation of the way in which the visual elements operated in relation to one another. Intensity was mentioned through the notions of "could stay on the webpage longer." Aversion was expressed through simple statements expressing induced negative involvement, and the refusal to become involved. This was demonstrated in comments such as: "webpages are pushing you away" and "totally lousy webpage, I won't even bother getting acquainted with it."

Emotions
Confusion was expressed directly either on its own, or in connection with various elements, both in relation to layout and design choices, as well as font characteristics. Anxiety was mostly referred to in terms of the negative response of disturbance, mainly regarding the overall impression of the design. One participant even stated that the design "scared the eyes." Calmness was related through both positive and negative valence. Boredom was expressed literally in terms of the designs being boring.

Theme
There were many more statements regarding theme in the thought bubbles than in the speech bubbles. In the speech notions, the music theme of heavy metal and rock was mentioned several times. These were specifically linked to the webpages of heavy metal or rock bands, or specific bands such as Sepultura. Death and the supernatural were also mentioned in terms of cemeteries and ghosts. The artistic characteristic was expressed through the notion of "could be some Avant-Garde website," additionally art and graphic qualities were also emphasised.
Technology was mentioned in reference to the designs' "blog like" qualities and "CSS garden," and, via the words "computer" and "technology." Fire was mentioned explicitly regarding the images in the design. The fire theme was present in the thought bubbles as associations such as mid-summer festivities i.e., the bonfire. The movie theme was mentioned in reference to alternate genres and elements such as: the dementors from the Harry Potter movies; "the Matrix;" "directed to people who like action movies;" as well as "I don't know what movie theme it is now, but it reminds me of Bruce Willis saves the world movies, what can you do?" Games were described in terms of the designs being suitable for the forum of a first-person shooter game as well as of a roleplaying website. Additionally, in the thought themes the category of fantasy arose referring to Sci-fi and the middle ages. The artistic theme arose once in reference to modernity.

Colours
Colours affect the sense of involvement, such as the notion of intensity. Thus, the dominant colour schemes were also mentioned frequently either positively or negatively. The colours were mostly referred to directly in terms of colour words. Evaluations of the colours were often seen in comments such as "bad colour scheme" or "colour scheme works, not a total catastrophe." The achromatic qualities of the colour schemes drew attention regarding the dominance of grey, black, white and darkness. Dominant colour scheme was mentioned in regards to the overall colour design through the selected colour combinations.

Aesthetic Evaluations
Along with visual usability, aesthetic evaluations were also the most commonly expressed notions. Melancholy was often mentioned through notions of gloomy and dreary, indicating the dark romanticist characteristic of the designs. This was followed by professionalism which referred to evaluating the competence and skills of the designers such as "Looks like it was made by an amateur" and "Skilful Photoshop user," and the level of quality and completeness in the design: "The difference between the background picture and the other picture is huge in the graphical sense" and "half done." Atmosphere and impressions were referred to in the speech bubbles mostly through the words "appearance," "atmosphere" and "impressions" and they were mainly quality words, i.e., "warmer atmosphere" and "still boring appearance." In the thought comments regarding atmosphere a slight difference was noticed in the use of words such as "weird," "strange," and "magical." Thus, the speech-related notions adhered to more general level impressions, while the thought-related notions were more detailed, descriptive adjectives. Trendiness related to youthfulness and stylishness, and the design as a differentiating factor in relation to other website designs in general.

Physical Feelings
It was mentioned twice in the speech notions that the designs' elements either glared or struck the eyes, as well as one mentioned that the designs gave them a headache. Headache was mentioned once in the thought notions in terms of the design inducing a headache. Another person strongly expressed via exclamation mark, how the design made their stomach churn. Then one notion referred to overall bodily experience, this was through the word "shudder."

DISCUSSION
In the results of this study, themes and theme attachment -attaching designs and design experiences to other known creative phenomena (i.e., heavy metal bands, stories and poetry) -creates sensemaking vehicles in apperceptive processes through which experiential representations are constructed. According to Max van Manen (1990), themes are "structures of experience." This psychological phenomenon is linked to developmental psychology, whereby children express e.g., relationships through themes in prosocial role-playing in addition to using themes to label phenomena (Friedrich & Stein, 1975;Youngblad & Dunn, 1995).
The expression of themes as a prominent mental category also reinforces theories including language games (Wittgenstein, 1953), which hinge the meaning of language on certain signification fieldsgames or communities. These structures, or theme vehicles, are more dominant in what people consider would remain unspoken, than in what they feel would be spoken. In apperceptive processes themes unify the identified design properties into an experiential whole, which can be used to inform the design process of different visual properties.
Through creative interpretation, impressions of the designs were reflected through visual properties. Colours were seen as primary visual elements in the web designs (Poulin, 2011). These influenced interpretations through all categories from visual usability to sense of involvement. Themes were more dominant in the thought expressions than speech expressions. This indicates that design themes induced reflection into deeper meanings regarding the visual aesthetics. Theme impressions hover at the intersection of visceral and reflective involvement levels (Norman, 2004). Theme impressions are understood in relation to either one of the levels, depending on the way in which the impressions are expressed. For instance, a theme can be reflected in a visceral way by stating the dominant visual features (e.g., fire), or it can be represented on a reflective level according to mental associations and previous experiences (e.g., mid-summer festivities).
Interface layout was expressed directly in terms of compositional features of the design, such as balance and alignment. These were expressed in conjunction with strong expectations of the behavioural properties of the layout elements regarding visual usability. Interface quality was mentioned in reference to clarity, which could be connected to the reflective dimension as well as ambiguity (Gaver et al., 2003). On this note, clarity was expressed according to one more categoryvisual usability (font clarity and content clarity). In the mental representations of the interface quality category, clarity was the only type of content mentioned. We observed that participants focused on clarity and understandability, especially emphasising font clarity. The notions emphasising understandability came as a surprise, due to the fact that the text functioned as an example text, which participants were aware of before answering the 3E-templates. People are constantly on a quest to derive meaning from all encountered phenomena.
Notions emphasised the importance of typography among other design factors. Colours, interface layout, interface quality, and theme were reflected in terms of visual usability, aesthetic evaluations, emotions and physical feelings. Although participants were informed that the webpages have exactly the same content attention was still paid to visual usability of typography through interpreting its content. Focus was on evaluating visual usability of typography in terms of font type, size, and contrast between font colour and the colour of the background picture.
In this study, involvement has both negative and positive connotations. Involvement accounts for overall visual experience not just quality assessment. Involvement appeared to be the product of the interaction between elements, and creative design interpretations. This category is termed involvement, although emotional engagement is a more often used concept in human-computer interaction studies (Hart et al., 2012). Curiosity towards a design can be achieved with overlapping elements. Partial obscuring of images by text boxes incited intensity regarding the desire to see more. Visual usability and aesthetic evaluations functioned as pillars for criteria against the physical design elements of colour, layout and interface quality.

CONCLUSIONS
Here, Husserl's (2001) framework of conscious experience as perception, signification, retention, was translated into an experiment where participants engage in self-reflection and meta-cognition to represent what they consider as either spoken or mentally-bound design experience. We use apperception to describe the process of mentally representing design experience (Saariluoma, 2003;Silvennoinen et al., 2015). This creative act of apperception among people encountering webpage design, involves the compilation of a variety of mentally bound information contents. These contents are arbitrary by nature and are drawn from mental resources to understand the encountered phenomenon (Saariluoma, 2003).
Through creative interpretation, reflections of design impressions ranged from notions of design properties (colours, themes, interface layout and quality) to reflections of visual usability, aesthetic evaluations, emotions and physical feelings, resulting in states of involvement. The categories represent dimensions of how web designs are experienced. The finding of the theme category was interesting because: 1) the theme serves as a sense-making vehicle when a receiver is mentally representing (apperceiving) a product; 2) discovering the dominance of themes in the thought category means that designers have more control over the aesthetic experience of their products through paying careful attention to the theme they implement and its associated values and connotations. As a design implication, deliberate operationalisation of ambivalent, incomplete or obscured elements can be used to incite curiosity, heightening sense of involvement (Gaver, Beaver, and Benford, 2003).
The study's results can be utilised as a design framework to enhance the understanding of how visual elements encourage specific experiences. Through understanding the relationship between design elements and factors contributing to the apperceptive processes, designers have more control in making design decisions towards influencing desired experiences. The 3E method employed in this paper served as an ideal platform upon which to delve into the collection of enrichened qualitative data. One of the drawbacks, however, is the contrary nature of asking participants to explicate information that would ordinarily remain tacit, as a great deal of mental content exists only in the mind and in non-linguistic content. Ideally, the 3E method should include more response time and activities inducing connections between what is verbalised and what ordinarily remains non-verbal. Future research should focus on examining brand influence in visual design experience and tolerance of unconventional design elements. Considering Gaver et al.'s (2003) argument for ambiguity in everyday designs, it would be beneficial to extend our understanding of how design elements further ambiguity. More work is needed to investigate the role of themes in sense-making processes of design experience.