Exploring the Influence of Design Elements on the Comfortability in Web Sites

Size: px

Start display at page:

Download "Exploring the Influence of Design Elements on the Comfortability in Web Sites"

Avice Warner
5 years ago
Views:

1 Exploring the Influence of Design Elements on the Comfortability in Web Sites Roberto OKADA*, Ayumi TEJIMA * Miyagi University, School of Project Design 1 Gakuen Kurokawagun Miyagi JAPAN, okir@myu.ac.jp Abstract: With the appearance of huge amount of Web sites, which provide a variety of services like electronic commerce, network game, search engines and so on, there are many researchers working on the definition of Web Usability. On the other hand, many researchers have been working on exploring the meaning and ways to realize the comfortability in physical sites (planes and spaces). We believe that it is important to extend the concept of comfortability to Web sites as well, where this new paradigm of Web Comfortability goes beyond the concept of Web Usability. We define Web Comfortability as the means to provide not only useful functions, but also the feeling of comfortability or pleasantness in the virtual space. In the same way that we visit more frequently and stay longer in physical places, where we feel comfortable, we believe that applying the same feeling in virtual web sites will be a key factor to become winner in the battle of Web sites to retain users. Kansei Engineering is a consumer-oriented technology process used to develop products, where the consumer s feelings or Kansei is used as a guideline in creating the product. We explore the meaning of Web Comfortability, based on Kansei Engineering methods. The way of interacting with Web sites is based on two senses: audio and visual. Thus, it is very important to pay attention to the visual aspect, i.e. the design. In the case of design elements like layouts and combination of colors, the user can get at first sight the feeling of pleasant or unpleasant. If he feels unpleasant, he might go immediately to other sites. In this paper, we report with focus on the influence of design aspects on the Web Comfortability. Keywords: Web Comfortability, Kansei Engineering 1. Introduction With the appearance of huge amount of Web sites, which provide a variety of services like electronic commerce, network game, search engines and so on, there are many researchers working on the definition of Web Usability. On the other hand, many researchers have been working on exploring the meaning and ways to realize the comfortability in physical sites (planes and spaces). We believe that it is important to extend the concept of comfortability to Web sites as well, where this new paradigm of Web Comfortability goes beyond the concept of Web Usability[1]. We define Web Comfortability as the means to provide not only useful functions, but also the feeling of comfortability or pleasantness in the virtual space [2]. In the same way that users visit more frequently and stay longer in physical places, where they feel comfortable, we believe that applying the same feeling in virtual web sites will be a key factor to become winner in the battle of Web sites to retain users. The way of interacting with Web sites is based on two senses: audio and visual. Thus, it is very important to pay attention to the visual aspect, i.e. the design. In the case of design elements like layouts and combination of colors, the user can get at first sight the feeling of pleasant or unpleasant. If he feels unpleasant, he might go immediately to other sites. In this paper, we report with focus on the influence of design aspects on the Web Comfortability.

2 2. Comfortability and the Kansei Engineering Approach 2.1 Comfortability and Pleasantness Our aim is to explore the Comfortability in Web sites, which we have sub-divided into Comfortability per-se and Pleasantness. Let s try to focus on the difference. If a building or room is comfortable, it makes you feel physically relaxed when you spend time in it. Something that is pleasant is enjoyable, nice, attractive. Comfortability: passive comfortabity or comfortability per-se, is an stress-less state, which can be realized by just eliminating the source of uncomfortability. This does not require much conscience from the individual, and there is not much difference among individuals or persons. It is a property that products should have, and some related adjectives are quiet, usual, stable, regular, long-termed. Some related feelings are peaceful, safe feeling and settle down. Pleasantness: pro-active comfortability, the sense of feeling good due to some psychological stimulation, related with the desire to improve in response to the proper stimulation. It requires conscience in order to realize, and it may vary even for the same individual, in accordance with the particular situation. For products, it is a property related to charm, active, not usual, particular, short-termed. Some related feelings are excited, attractive. 2.2 Kansei Engineering Kansei Engineering is a consumer-oriented technology process used to develop products, where the consumer s feelings or Kansei is used as a guideline in creating the product. In order to do Kansei Engineering, one must first determine the Kansei words suitable for the product to be designed. Designers would then create different concepts out of these words. After creating the concepts, they would then be presented to the consumers and rated with the same Kansei words gathered before to determine if the product has matched the Kansei. The rating test contains scales of 1 to 5 with antonym Kansei words on both ends. The process may continue to cycle until the people involved in the development are satisfied with the results [3]. The Kansei Engineering steps in order to explore the meaning of comfortable in Web sites are: (1) Collection and arrangement of target Web sites, (2) Collection and arrangement of Kansei words (as adjectives) which are able to express the image of target Web sites, (3) Sensitive evaluation of the target Web sites, based on Semantic Differential method with the selected adjectives, (4) Analysis, such as categorical regression analysis, correlation analysis, etc. Semantic Differential [4] -or SD for short- uses a rating scale, e.g. a 5-scale with -2,-1,0,+1 and +2. Users rate bipolar adjective pairs, e.g. good-bad, heavy-light, according to this scale. This is a technique for obtaining meaning space of man's feelings, by giving numerical values to bipolar or opposite adjectives. 3. The Investigation Process In the same way that it is important the visual aspects of color and structure in planes and spaces, the same is valid for virtual spaces. Thus, we will investigate with focus on the influence of design factors, based on Kansei Engineering approach, i.e. sensibility measurements, such as the Semantic Differential. 3.1 Selection of Kansei Words and Sites to be Analized. The first step is the selection of proper Kansei words, which were obtained from brain-storming sessions about comfortability in Web sites, with words expressing sensibility and emotions. Some of the selected antonym peers are: easy to understand-difficult to understand, familiar-unfamiliar, trustable-not trustable, like-dislike,

calm-not calm, interesting-boring, peculiar-ordinary, beautiful-ugly,

The next step is the selection of Web sites to be studied.

following initial conditions: (1) font size= medium, (2) browser tool

3 calm-not calm, interesting-boring, peculiar-ordinary, beautiful-ugly, fashionable-unfashionable. The next step is the selection of Web sites to be studied. We have carefully selected 30 sites (in japanesse), from well-known companies, listed in Appendix A. 3.2 Selection of Design Factors All the sites were tested under the following initial conditions: (1) font size= medium, (2) browser tool bar = two levels, (3) display resolution=1024x768, (4) browser covering the whole display. Fig. 1: Navigation tool types Whole screen Image-surronded In-image Top&Left Top Left Fixed Fig. 2: Navigation location types Under such conditions, the design factors studied are: - Background - Animation of characters and images - Content location: concentrated to the left, to the center, distributed - Ads: the location is classified into upper, bottom, side, distributed

4 - Links: the default color for links is blue, sites with different link color are classified in others - Scroll - Properties of fonts/letters: amount of letters, font color (main), number of font colors - Properties of images: size in pixels, percentage of the full screen covered - Navigation tool: classified into image-type, menu-type and search-box type, as shown in Fig. 1 - Navigation location: classified into whole screen, image-surrounded, in-image, top&left, top, left, fixed, as shown in Fig Analysis, Results and Discussions 26 male and female students from 18 to 24 years have participated in the experiments of evaluating the 30 selected web sites with the SD method. With such evaluations, quantitative analysis type I (a kind of Multivariate Regression Analysis,) were performed with SPSS, based on the stepwise method. The general goal of multiple regression analysis is to learn about the relationship between several independent or predictor variables and a dependent or criterion variable. Our goal is to find a regression equation where the dependent variables are Comfortability and Pleasantness, and the predictor variables are the design factors. For both resulting regression equations, the adjusted R 2 (R=coefficient of multiple determination) are and respectively Analysis of the Relation between Comfortability and Design Factors The main results for the analysis regarding Comfortability are summarized in Fig. 3, where R 2 = Fig. 3: Influence of design factors for Comfortability in web sites (R 2 = 0.958) Fig. 3 summarizes the design factor patterns which affect most the Comfortability. Some of the other combinations, which were ignored based on the criteria tolerance < 0.3, summarized in Table 1 are:

5 Table 1: Patterns ignored for the study of Comfortability, based on the criteria tolerance < 0.3 Design factor Tolerance Design factor Tolerance Amount of animations = Amount of images = Color for links = no color Location of navigation = Top & Left Amount of characters = With navigation bar = NO Amount of characters > Menu-style navigation = YES Image-based navigation = NO Menu-style navigation = NO Note from the results of Fig. 3 that: 1. Out of the 12 most influential design factor combinations, 5 of them such as Color of links, Font color, Amount of characters are related to the properties of fonts or characters. 2. From Amount of Images = 0 10, we can think that too few images might decrease the sense of Comfortability. 3. The factor Image-based navigation = YES works towards increasing the Comfortability. In summary, it is important to carefully think about the font or character-related properties and the adequate number of images in order to increase the Comfortability in web sites Analysis of the Relation between Pleasantness and Design Factors The main results for the analysis regarding Pleasantness are summarized in Fig. 4, where R 2 = Fig. 4: Influence of design factors for Pleasantness in web sites (R 2 = 0.980) Fig. 4 summarizes the design factor patterns which affect most the Pleasantness. Some of the other combinations, which were ignored based on the criteria tolerance < 0.3, summarized in Table 2 are:

6 Table 2: Patterns ignored for the study of Pleasantness, based on the criteria tolerance < 0.3 Design factor Tolerance Design factor Tolerance Amount of ads = Location of ads = distributed Amount of ads > Link color = none Location of ads = none Amount of characters = Note from the results of Figure 4 that the factor % images=30% is the most influential for the Pleasantness, followed by amount of font colors=3 and background color=deep. In summary, it is important to carefully think about the amount of images and font colors, and to provide contrast between the content and the background, in order to increase the Pleasantness in web sites. 5. Conclusions We believe that it is important to take into account the user s feeling or Kansei while developing Web sites. Thus, we have coined the concept of Web Comfortability. In this paper, we aim to study the influence of design elements on the Comfortability and Pleasantness of Web sites, based on Kansei Engineering approaches. From our studies, we can see that: (1) The number of ads and the color of links influence both the Comfortability and Pleasantness. (2) The text-related design factors influence the Comfortability. (3) The graphical and color design factors influence the Pleasantness. In this first attempt, the number of testees, studied Web sites and studied design factors were limited. Thus, in the next stage for studying the influence of design factors, we will extend to more number of design elements, web sites and testees. We are also considering to study the influence of other factors such as display speed, site structure on the Web Comfortability, as well as the impact of Web Comfortability on the marketing and promotion power. Acknowledgment This research is funded by the Grant-in-Aid for Scientific Research (Kakenhi), Grant-in-Aid for Young Scientists category A (number ), provided by the Japanese Ministry of Education, Culture, Sports, Science and Technology. References 1. Nielsen, J: Designing Web Usability The Practice of Simplicity, New Riders Publishing (2000) 2. Okada, R. and Watanabe, Y.: From Web Usability to Web Comfortability A Paradigm Shift, in Proc. 10 th International Conference on Human-Computer Interaction, Crete, Greek (2003) 3. The Quality Portal, Kansei Engineering definition in 4. Osgood, C., Suci, G. and Tannenbaum, P.: The Measurement of Meanings, Univ. Illinois Press, 1957 Appendix A For our studies, 30 web sites were carefully selected, from well-known Japanese companies, as follows:

7 Note that the study was performed on the state of these sites on December 12 th, 2001

Procedia Computer Science

Procedia Computer Science 3 (2011) 1315 1320 Procedia Computer Science 00 (2010) 000 000 Procedia Computer Science www.elsevier.com/locate/procedia www.elsevier.com/locate/procedia WCIT 2010 Factors affecting