Exploring the Attractive Factors of App Icons

Abstract

More than 1 billion mobile apps (smartphone applications) have been released worldwide. Competition among developers of apps that are available in app stores has intensified because of increasing demand. App icons with an appealing design can instantly increase attention. Miryoku Engineering methods were used and combined with the Kansei interface model to examine the relationship between attractive icons and users. The evaluation grid method (EGM) is a qualitative method that was used to evaluate the icons, and Quantification Theory Type I is a quantitative method that was used to analyze the influence of design elements in icons. Eight attractive factors of app icons were determined using EGM, and six specific factors were identified using questionnaires. The quantitative results indicated that user cognition and emotion were influenced by the various design elements. The impact on the attractive factors of a single design element differed among users with diverse backgrounds. App icons were assessed on the basis of aesthetics to identify attractive factors and thereby assist designers in understanding and implementing design elements and improving the overall visual appeal of their apps. The result of this investigation is crucial to the presentation of app icons in online app stores.

1. Introduction

A ccording to a survey conducted by Gartner , global mobile app (smartphone application) downloads surpassed 45.6 billion in 2012. The global mobile app market is expected to grow to US$52 billion by 2016. As smartphones and other mobile devices (such as wearable devices) become widely used, the number of apps is increasing. However, despite the rapid increase in app demand, even if search engines are used, selecting an appropriate app from the app store is extremely difficult for users [1,2]. The first impression and most crucial information obtained when selecting apps in app stores is the app score. Eye-catching app icons can increase click-through rates [2]. Similar to placing products on racks to present them to customers, attractive app icons provide users with favorable first impressions [2,3].

The icon design should not only be meaningful but also visually appealing to attract users [4,5]. However, the majority of previous studies on icons have investigated icons for computer programs [4,6-8]. Few studies have addressed smartphone icons [9]. However, smartphones have become prevalent and increased the use of apps. The visual design of app icons is as critical as product packaging; however, icons are difficult and time consuming to design [4,10]. In [11], the authors indicated that people’s feelings and impressions toward a product are crucial determinants of whether purchases are made. This is because attractive products trigger positive emotions in people [12-14]. Attractive factors of products can be extracted using perceptual research methods. These factors can be used as design references during the development phase [11,14]. The demand for apps among users is continually growing, but few studies have addressed the relationship between icon design features and users [5]. In this study, we conducted two experiments to assess the aesthetics of app icons, examine the specific attractive factors in relation to users with diverse backgrounds, and clarify users’ aesthetic needs and emotional responses to icons. Qualitative and quantitative methods were applied to evaluate the overall relationship between users and icons. The evaluation grid method (EGM) was adopted for qualitative analysis. Quantification Theory Type I (QT-I) was used to identify potential relationships between icons and users. According to the specific attractive factors, designers can identify the design elements (characteristics) of app icons in the design phase and thus improve the positive emotions experienced by users.

The main contributions of this paper can be summarized as: 1) We investigated users’ perceived aesthetics of app icons. 2) This study determined the attractive factors for the visual aesthetics of app icons, and 3) the findings showed that users with diverse backgrounds exhibited distinct emotions to the app icons.

 

2. Related Work

2.1 Icon

The basic characteristics of icons include easy recognition and the conveyance of information [6,15,16]. An icon is a type of pictographic symbol, and it conveys semantic meaning, particularly in human–computer interaction (HCI) interfaces [4]. Therefore, icons play an indispensable role and are used widely in the human–computer field [6,10,17]. Modern user interfaces (UIs) contain numerous icons. They are components with which all users of digital products interact [18]. Originally, the purpose of icons was functionality and identifiability; nowadays, their structures include art and design elements. The aesthetics of icons have gradually received increased attention [4,10,19-21]. The visual design of icons has been examined extensively in HCI studies, including the identifiability of icons to children and elderly people [7,22], the recognition and classification of icons [23], the identification of medical icons [24], and the arrangement of icons in interfaces [4,25,26]. These studies have all emphasized the importance of visual design in icons. In [5], the authors also asserted the importance of icon characteristics and aesthetic appeal. Icon characteristics can be divided into familiarity, concreteness, and complexity. However, few studies have addressed design elements and user emotions to app icons. Because of the development of diverse app icon designs, designers must focus on understanding and implementing design elements.

2.2 Apps Icon and Icon Design

In recent years, the increase of smartphones and app stores has emphasized the importance and necessity of icons as representatives of apps [2]. App icons with an attractive design can increase the possibility of the app being noticed, and provide users with motivation to browse more details of the app when searching for apps [2]. In [27], the author indicated that designers who develop an effective app icon design adhere to two critical factors, namely beauty and instant recognizability. This indicates that producing inner feelings and a sense of anticipation in users is the trend in app icon design. Therefore, designers can reference icon design elements and users’ inner feelings in the design phase. From this perspective, the development of HCI in recent years has shifted from usability to user experience [28]. This indicates that user needs for interface design should not be satisfied solely on a basic functional level, but that HCI must also consider users’ inner feelings. An attractive interface can trigger positive psychological emotions in people [29]. An effectively designed icon can also provide a positive user experience [15]. Scholars have stated that designers hope to use aesthetically pleasing elements to improve the positive emotions of users [28,30]. Regarding the enhancement of positive emotions in specific users, the users of diverse backgrounds react distinctly to icons [9]. The aesthetics of app icons and the correlation between aesthetics and user emotions warrant further investigation.

2.3 Kansei Words

Kansei is a Japanese word, and it refers to the psychological feelings and images consumers associate with new products [31,32]. It can also be considered as the perceptual reactions generated in people after their senses receive an external stimulus [11,33]. In English, Kansei involves sensitivity, sense, sensibility, feeling, aesthetics, emotion, affection, and intuition. Kansei phrases (Kansei words) are often used to describe the design image of objects in an adjective form, and the phrases can be converted to semantic words [34]. In [31], the author indicated that Kansei words can be used to further express consumers’ feelings. In the graphics field, some scholars have analyzed the image and enhanced the understanding of the image through mathematical analysis such as machine learning [35-38]. Other similar methods were also applied to capture and evaluate in representing the photo aesthetics [39-41]. Combined with engineering treatment and statistical analysis, Kansei words represent and are used to assess abstract internal needs, which can serve as crucial indicators for designers during the design phase. Kansei is an attitude based on users’ internal needs and feelings, and it is an abstract concept that originates in users’ minds. The abstract psychological feelings of users are often the most difficult to control and convert in design. However, these are also among the most crucial elements in the design field. Tractinsky and Norman have proposed “what is beautiful is usable” and emotional design as new directions in design [42,43]. Designers and scholars of human factors engineering have begun to observe the emotional experiences that aesthetics provide to people by using Kansei words. Therefore, in the field of HCI, designers have become aware of the importance of beauty in interface design [42,44-46].

2.4 Kansei Interface

Lindgaard and Dudek indicated that aesthetically pleasing websites provide higher user satisfaction [45]. Moshagen and Thielsch argued that several theorists have considered “beauty” as a property of an object [46]. Anything that results in pleasurable experiences for perceivers is regarded as beautiful. Tractinsky investigated the relationship between the perceived usability and perceived aesthetics of system interfaces according to users [42]. The results of Tractinsky’s study indicated that increased perceived aesthetics can increase perceived usability. In [44], the authors indicated that the impressions of aesthetics are rapid, lasting, and consequential. The first impression that people have toward an object is visual. Interface assessments of music players have indicated that aesthetics can provide pleasure, which is a type of positive value. Aesthetics can produce other effects such as broadening users’ minds and enhancing their creativity. Providing products with emotional value and attractiveness has long been a critical topic. Schütte proposed two methods for overcoming this challenge: (a) improve the understanding of the affective impact of product characteristics on users, and (b) identify and improve the methods of capturing sentimental value and integrating sentimental value as a property in a product [11]. The Kansei interface (KI) is a design reference framework for interface designers to increase positive emotional value. An attractive KI should satisfy three conditions: (a) enhance position emotions, (b) increase motivation to interact with the product, and (c) achieve a balance between usability and beauty [47,48]. In [48], the authors indicated that the KI conceptual model emphasizes a variety of relationships between digital interfaces and user emotions. Interface design elements should induce positive emotions in users and increase their motivation to interact with the product. In this study, the KI conceptual model was used as a foundation to investigate the embedded value of the visual design of app icons.

 

3. Methods

3.1 Materials

App icons with high-quality resolution were collected for the aesthetic assessment of app icons. These app icons also support the majority of smartphone systems on the market, including iOS and Android. The selected app icons represented the majority of app function types, excluding games, music, and books (individual preferences may affect the validity of the aesthetic assessment). Four experts (three app interface designers and one app programmer) selected an average of 168 app icons (obtained from app icons published between March 2013 and April 2013) with diverse styles on the basis of icon colors and style modelling. These app icons were used for the aesthetic assessment of icons.

3.2 Assessing the Attractive Factors of the App Icons

To understand the positive emotional relationships between users and app icons, focus was placed on users’ Kansei attitudes. Miryoku Engineering is a theoretical method for preference-based design and is used to develop attractive products or systems [49,50]. Attractiveness is manifested in the feelings that the design attributes of attractive products produce in customers. Furthermore, people prefer attractive products. Miryoku Engineering can be used to investigate the relationship between attractiveness and preference [51]. User descriptions of feelings induced by products are often overly extensive. The EGM is a research method developed for understanding the true feelings of participants [52]. The qualitative EGM of Miryoku Engineering can structure the abstract feelings of interviewees as concrete feelings [51]. The results are expressed using the hierarchical diagram of the appeal factors for evaluation [51-53]. The content results (appeal and attractive factors) are categorized as upper level, middle level, and lower level by using the visualized hierarchy structure method [54]. The upper level comprises abstract phrases that represent users’ emotional attitudes. The middle level comprises evaluation elements. This generally refers to users’ primary reasons for preferring a product, which are also called original evaluation items (OEIs); these are interviewees’ initial reasons for preferences expressed during interviews [55]. The lower level refers to the design elements of products [50,51,56]. To focus on the positive emotions of users, the three basic conditions of the KI conceptual model were used for guidance during the interview process: (a) icons that can induce and enhance positive emotions were selected, (b) the selected icons promoted a degree of visual or tactile motivation, and (c) the selected icons achieved a balance between identifiability and beauty. The detailed EGM process is described as follows (Fig. 1):

Fig. 1.Process of EGM

Fig. 2.The EGM hierarchical diagram of app icons preference. (The right-hand side indicate means the number of times that the same opinion appeared.)

In this study, the structure comprised the abstract upper level (users’ positive attitudes), the direct positive reactions of the middle level (primary reasons for preference), and the specific lower level (concrete design attributes of icons). Moreover, this structure was applied to the subsequent quantitative analysis phase.

3.3 Evaluating Relationship between Users’ Kansei and Characteristics of Icons

Quantitative methods were used to understand the relationships between users’ inner feelings and icon design. To collect substantial data on users’ perceptions of icons, questionnaires were used. The EGM hierarchical diagram was converted into attractive factors. QT-I was applied to statistically analyze the items on a questionnaire by using a 5-point scale. At this step, the lower-level (design-element) icons were converted into user needs for the assessment questionnaire. QT-I is a type of multiple linear regression that uses 0 and 1 in binary form to express dummy variables. In [57], the authors indicated that QT-I is an effective tool for determining the design rules of the correlations between users’ Kansei and product specifications. QT-I has been used for qualitative and quantitative investigations, such as the analysis of the relationships between “people’s Kansei of qualitative properties” and “design elements of quantitative properties” [58]. In this study, QT-I was used to analyse the results and determine the weighted relationships among the upper level (participants’ feelings), middle level (icon appeal factors), and lower level (icon design elements). This facilitated the understanding of the attractive values of icon characteristics.

The results of the EGM hierarchical diagram of app icon preferences indicated that four sets of upper level words (cute, vigorous, intuitive, and fun) were used as factors of internal feelings that received relatively favorable evaluations from the experts. To focus on attitude, the four sets of Kansei words (emotional words) were used to create the questionnaires to estimate which concrete appeal factors influenced the four emotional reactions of the users toward the icons’ visual designs and the extent of these influences. The questionnaire design included the following steps: (a) Middle level words obtained from the EGM hierarchical diagram—OEIs— were used to influence upper level word items on the Kansei words scale (5-point scale). For example, the evaluation structure diagram indicates that six middle level words were connected to the upper level word “cute”: artifact imitation, cartoon elements, 3D effect, color, dynamic elements, and novelty. The questionnaires asked the users the extent to which the six middle level words influenced their feelings regarding whether an app icon was cute. This was assessed using a 5-point scale. (b) The lower level words from the EGM hierarchical diagram were used as factors for assessing the design elements. The users were asked to assess the primary factors of the lower level words (miniaturization of real objects, decorative texture, metallic luster, rounded edges, and handwriting style) that influenced the middle level words of artifact imitation that caused the users to regard the app icons as cute.

 

4. Results and Analysis

4.1 Results of EGM

The middle level words (OEIs) in the EGM hierarchical diagram represent the users’ primary reasons for preferring certain types of app icons. These are considered as the eight most crucial attractive factors, and comprise artifact imitation, cartoon elements, a 3D effect, color, a bright logo, dynamic elements, appropriate function, and novelty (Table 1). Fig. 2 shows the corresponding upper- and lower-level words for these eight factors. Several of the upper- and lower-level words exhibited repeated links with the OEIs. This indicates that the experts identified relevance and association between the upper- and lower-level words and the factors. The numbers next to the upper- and lower-level words and the OEIs in the table represent the number of times the interviewees mentioned these words and factors during the interviews (a person may have mentioned a word more than twice because the samples corresponded with multiple terms). This represents the strength of the experts’ impressions of each variable. The users indicated that these words produced the deepest impression on their icon preferences. The four sets of upper level words were used to measure the users’ main analysis factors: cute, vigorous, intuitive, and fun. These four sets of factors are consistent with the positive emotional connections emphasized in the KI model. These four sets of factors and “upper level words—preference factors” and “lower level words—concrete icon design elements” were addressed in the assessment phase.

Table 1.Eight primary attractive factors and reasons for icon preference

The numbers written after the design elements (lower level) in Fig. 2 represent the number of times that the interviewees mentioned the design elements. Miniaturization of real objects and saturated color were mentioned more than ten times, indicating that the interviewees considered these two elements as the most appealing characteristics (design elements) in app design. Gradient colors, miniaturization of real objects, shadow effects, and anthropomorphism were mentioned at least five times. These elements are worthy of consideration by designers. However, the correlations between these design elements and user emotions must be understood to investigate the correlations between design construction and people’s internal feelings further. Therefore, QT-I was used to analyze the associations among the upper, middle, and lower levels of the attractive factors.

4.2 Results of QT-I

Multiple linear regression was used to determine the degree to which each of the app icon design elements influenced users’ feelings. A total of 120 questionnaires were distributed, with 91 valid questionnaires recovered (38 of the participants had a design background and 53 did not; 42 were iOS users and 49 were Android users; 38 were men and 53 were women). Questionnaires completed by users with experience in using apps were considered valid. The ages of the participants were between 18 and 50 years. They all had at least 3 months of experience in using smartphones and had downloaded more than 10 apps. This indicated that the participants had all observed how app icons are displayed in online stores. App downloading experience is crucial to the evaluation of app icon aesthetics.

QT-I was performed on the four primary sets of upper level attractive factors (cute, vigorous, intuitive, and fun) on the basis of the participants’ design background, smartphone system, gender, and age. Table 2 shows the multiple correlation coefficient (MCC) results from conducting linear regression. The MCC values, which are equivalent to R-values, explain the correlation between an appeal factor and the varied backgrounds of the participants. In Kansei Engineering, an MCC2 greater than 0.5 is generally considered acceptable [59]. Regarding preference factors for the icons, Table 2 shows five sets of values that represent high correlation coefficients (R2> 0.5) in relation to four types of participant background. These five sets of values were investigated in this study. These were the feelings of participants with a design background toward the “vigorous” factor (R2 = 0.5), the feelings of participants who used iOS toward the “cute” factor (R2 = 0.56), the feelings of female users toward the “vigorous” factor (R2 = 0.51), the feelings of users older than 31 years toward the “vigorous” factor (R2 = 0.64), and the feelings of users older than 31 years toward the “fun” factor (R2 = 0.52). To provide an understanding of the influences on the high acceptance of these four examples, Tables 3 to 7 detail the five sets of QT-I statistics.

Table 2.Note: R2 are in parentheses.*R2 >=0.5

Tables 3 shows that the users with a design background believed the icons induced “vigorous” feelings. The table also shows the influence data for the items (OEIs) and the categories (design elements). The items that influenced the “vigorous” factor were 3D effect, color, dynamic elements, and novelty. However, the most influential of these was dynamic elements (partial correlation coefficient [PCC]> 0.5). Regarding the other results, only the items that produced a relatively high impact (PCC> 0.5) were addressed in this study (Tables 4 to 7). The categories represent the design elements of the icons, which originated in the lower level items from the EGM hierarchical diagram. The category scores (CSs) respond to the positive or negative influence of the design elements on the OEIs. The PCCs in the table can be used as a third method of expressing the degree of correlation between standards and predictions [57]. The OEI dynamic elements in Tables 3 had the highest PCC (PCC = 0.57). This indicates that the OEI dynamic elements were highly correlated with users’ “vigorous” feelings toward an icon compared with other appeal factors. Other design elements worthy of observation include the ability to flip or tear paper pages (CS = -0.32) and deformable objects (CS = -0.37) in dynamic elements. This is because negative CS values are associated with reduced “vigorous” feelings that an icon induces in people. By comparison, the design element of liquid flowing (CS = 0.29) enhanced people’s “vigorous” feelings. In other words, if designers wish to enhance “vigorous” feelings on the basis of the manner in which users with a design background perceive the beauty of their icons, they can reinforce the dynamic elements factor from the eight OEIs. Furthermore, liquid flowing design elements can be added in graphic construction. However, the design element of flip or tear paper pages and deformable objects should be avoided.

Table 3.Note: MCC = 0.75; MCC2= 0.56; a Category scores. b Partial correlation coefficients.

Table 4 shows the impressions of cuteness perceived by participants who used iOS cell phones. The primary factors with a PCC > 0.5 that influenced users’ perception of cuteness were artifact imitation, cartoon elements, color, and dynamic elements. Artifact imitation had the highest PCC (PCC = 0.69). Within this factor, the design element of metallic luster produced the highest positive influence (CS = 0.59), and handwriting style produced the highest negative influence (CS = -2.70). Other OEIs that had considerable influences on users’ perception of cuteness were color, cartoon elements, and dynamic elements, all of which had PCCs greater than 0.5. Among these, color was a secondary factor influencing the perception of cuteness regarding icons. The gradient color design element exerted the primary positive impact.

Table 4.Note: MCC = 0.75; MCC2= 0.56; PCC < 0.5 does not list. a Category scores. b Partial correlation coefficients.

Table 5 shows that the primary OEIs mainly influencing the “vigorous” feelings of female users toward icons were dynamic elements and novelty. The design elements of the dynamic elements OEI with positive influences were liquid flowing and gradient patterns. The design elements with negative influences were flip or tear paper pages and deformable objects. The design elements of the novelty OEI with positive influences were rounded edges, gradient colors, and flip or tear paper pages. The design elements with negative influences were rainbow colors, frame design, and handwriting style.

Table 5.Note: MCC = 0.8; MCC2= 0.64; PCC < 0.5 does not list. a Category scores. b Partial correlation coefficients.

Table 6 shows that the primary OEIs mainly influencing the “vigorous” feelings of users older than 31 years toward icons were 3D effect, dynamic elements, and novelty. The design element of the 3D effect OEI that exerted a strong positive influence was shadow effects (CS = 0.60). The design elements of the dynamic elements OEI that exerted positive influences were liquid flowing (CS = 0.65) and deformable objects (CS = 0.26). These results differed from those of the female users. The results for gradient patterns (CS = -0.13) were the opposite of the results for the female users. This design element and the ability to flip and tear paper pages (CS = -0.27) produced negative influences. The design element of the novelty OEI that exerted the clearest positive influence was gradient colors (CS = 0.52), followed by rainbow colors (CS = 0.08) and handwriting style (CS = 0.11). The design element that produced the clearest negative influence was frame design (CS = -1.17), followed by rounded edges (CS = -0.21) and the ability to flip and tear paper pages (CS = -0.14).

Table 6.Note: MCC = 0.72; MCC2= 0.52; PCC < 0.5 does not list. a Category scores. b Partial correlation coefficients.

Table 7 shows that the primary OEIs influencing the “fun” feelings of users older than 31 years toward the icons were dynamic elements and novelty. The design element of the dynamic elements OEI that exerted a strong positive influence was the ability to flip and tear paper pages (CS = 0.34). The element that produced the strongest negative influence was liquid flowing (CS = -0.52). These results were the opposite of the “vigorous” reactions from the female users toward the icons. Both sets of results involve dynamic elements, but the design elements resulted in distinct emotions in various users. The design element that produced the greatest positive influence on the novelty item was rainbow colors (CS = 0.86). The design element that exerted a negative influence was handwriting style (CS = -0.21). These results indicate that designers should strengthen the design element of rainbow colors and avoid handwriting style in the development of the novelty factor to persuade users older than 31 years to consider their app icons as “fun.”

Table 7.Note: MCC = 0.71; MCC2= 0.51; PCC < 0.5 does not list. a Category scores. b Partial correlation coefficients.

The QT-I results indicate that the 91 participants’ “vigorous” feelings and perception of “cuteness” toward icons were more consistent than their “intuitive” and “fun” feelings were. The “vigorous” attitudes of users with a design background, female users, and users older than 31 years were related. Users of iOS expressed that they identified considerably with icons that they considered cute. By contrast, the feelings of Android users toward icon design lacked a direct correlation. This indicates that the Android users were less able to identify with the app icon samples. Additionally, the QT-I tables show that the dynamic elements OEI had a high degree of influence on the feelings of users with diverse backgrounds (Table 8). Table 8 shows that the design elements positively influenced vigorous–design and vigorous–female similarly. Design elements also positively influenced cute–iOS and fun–31+ similarly. These traits resulted in “vigorous” feelings. The design elements of “liquid flowing” and “gradient patterns” exerted a similar influence on users with a design background and female users.

Table 8.Design elements of dynamic elements OEI “+” positive / “-” negative impact on users of diverse backgrounds

 

5. Discussion

In this study, we assessed the aesthetic characteristics of app icons currently on the market. We also investigated the relationships between the abstract feelings of users and the design elements of icons. Compared with previous studies, this study provided a higher number of design details and analyses. We used the EGM to derive six specific attractive factors for assessing app icon aesthetics with diverse user backgrounds: artifact imitation, cartoon elements, 3D effect, color, dynamic elements, and novelty. Therefore, designers must focus on these attractive factors. In [60], the authors indicated that user preferences for products vary on the basis of their background and gender. This study also showed that diverse user backgrounds resulted in distinct preferences for icons. Following QT-I, however, we observed that the dynamic elements factor exerted a degree of influence on users of diverse backgrounds. We determined that the cognition of the participants toward the four Kansei words related to the icons (cute, vigorous, intuitive, and fun) differed on the basis of their backgrounds. The design conditions influencing this cognition also varied. Furthermore, designers should understand that the “vigorous” feelings of users with a design background and female users are influenced by similar design elements. Although iOS users and users older than 31 years were similarly influenced by the same design elements, their experiences of the icons were clearly different.

 

6. Conclusions

In the intensely competitive app market, the benefits of using an attractive app icon emphasize the value of icon design [2]. In this study, the aesthetics of attractive app icons were analysed. Quantitative and qualitative analyses were performed to determine the relationships between eight attractive factors and concrete design elements. Designers can use these findings to understand the degree to which each design element and property influences positive emotions, and thereby comprehend and implement the design elements. Moreover, the relationships between app icons and users were investigated. Users with diverse backgrounds exhibited distinct emotional responses toward the icons. The impact on the attractive factors of a single design element differed among users with diverse backgrounds. Designers must consider this finding during the app icon design phase. In response to different users, however, the presentation of icons in the app market could change. For example, icons may present different images according to the user's profile.

Digital interfaces differ from typical product designs and lack concrete physical models. Therefore, the relationships between interfaces and users are relatively abstract. Multiple conditions were used to express the connections between forms of varying impact and users, which can be considered as diversified, invisible links. Designers can use the clues presented in this paper to understand design elements and determine the affective factors most appropriate for their user base. However, specific app functional types and design styles were not investigated in this study. Subsequent studies can investigate a wider variety of cognitions regarding users’ app icon preferences, and thereby determine the most appropriate designs for different purposes.