Keywords

1 Introduction

According to China Statistical Yearbook (2016), there are about 144 million people over 65 years old in china by 2015 [1]. Smart phone as a feature of today’s society are rapidly becoming a device more and more important for the elderly to keep in touch with the information society. As for the elderly, increasing age means decreasing in memory ability and physical performances, which has required for new needs on smart phone design [2, 3]. Compared to young man, older users experience fear of consequences of using unfamiliar technology and are passive of mobile phones. They prefer products that are easy to deal with [4].

In order to improve the usability of a smart phone for the elderly, many studies have been done towards the design of phone icons which are important part of the mobile phone interface. The word “icon” originates from a Greek word “eikon”, which act as an intermediate between the user and the features of the mobile. It is considered to be images, pictures or symbols which display information for users. The icon forms affect the speed and accuracy that users perceive and interpret these information [5]. For the elderly, metaphor icons help them to recognize faster and easier compared to non-metaphor icon design, and the three elements, familiarity, labeling and resemblance that contribute to the successful recognition [3]. In terms of color, it was found that simplified graphic rendered in warm color attached with text in different colors that is not warm color tone and graphical symbols with extensive rendered with cool color tone help enhance the visibility for the elderly [6]. It was found that among the combinations of dark character/light background, blue and red character on white background is highly recommended; and while that for light character/dark background, white is found to be the best character on blue and green backgrounds [7].

With the development of science, technology and economy, flat design of icons, instead of skeuomorphism design, has already been mainstream for smart phone design [8]. It was proved that user’s visual search efficiency is relevant to the icon’s size: the search efficiency of skeuomorphism icons is higher at the size of 236px, however the search efficiency of flat icons is higher at the size of 165px and 78px [9].

In summary, there are many factors affect the icon design for smart phone, such as design style, color tone, icon size and so on. The purpose of the study was to investigate how color complexity affect the usability of flat icons of smart phone for the elderly.

2 Researcher Method

2.1 Research Purposes

Monochromatic flat icons and multi-colored flat icons were shown to different older participants for several tasks to find how color number of icons affect the usability, which may be useful for advices on icon design. Monochromatic flat icon is an icon designed with background of only one color and graphical of another color. Multi-colored flat icon is an icon designed with background of only one color and graphical of multi-colors. In this paper, graphical designed with two colors or three colors were took as multi-colored flat icons.

2.2 Participants

24 retired teachers from the university were recruited as participants in this study. They were divided into two groups. There were 7 females and 5 males aged from 60–65 at average of 62.83 in the first group. There were 6 females and 6 males aged from 66–70 at average of 67.33 in the second group. All the subjects had experience of using a smart phone for more than 1 year and still kept one smart phone. None of them had experience in similar study. Gifts as reward for all of the subjects were prepared for the experiment. The mental and physical state of all participants were suitable for the test.

2.3 Experimental Equipment

An experiment platform composed of an eye tracker, a scene camera, a mobile device bracket, an auxiliary handle was built up for collecting experiment data, and the Xiaomi MI 4 smart phone installed with the android system was used to shown the icons, as shown in Fig. 1. The eye tracker Tobii X2 was used to get the eye movement data. The resolution of Xiaomi MI 4 with a 5.0 inches screen is 1920*1080px. All tests were performed in a quiet environment without any interference.

Fig. 1.
figure 1

Experimental platform (left) and Xiaomi MI 4 (right)

2.4 Experimental Materials

The experimental materials were derived from 8 pairs of icons designed in flat style where a pair of icons was composed of a multi-colored icon and a monochromatic icon with the same function, as shown in Fig. 2. According to the former study [9, 10], the size of all the icons were set as 9.81 mm and the shape of them were drawn as square with rounded corners. 8 monochromatic flat icons were made with blue background and white Figures. 8 multi-colored flat icons were made with one color background and multi-colored figures. The figures of all 16 icons had a same height of 7.19 mm.

Fig. 2.
figure 2

Monochromatic icons (upper row) and multi-colored icon (lower row) (Color figure online)

In order to reduce the bad influence of improper selection of the icons on the experimental results, it avoided to use the icons with high complex form and low color contrast as experimental materials.

2.5 Experimental Procedures

There were two main tasks for all the participants. Firstly, in order to measure the time taken by the elderly people to recognize the icons, an icon was shown to them through Xiaomi MI 4, and the participants had to find it out from the 16 icons placed randomly as soon as quickly by touching the right icon with their fingers, as in Fig. 3. The 6 icons from the pair 3, 4 and 7 were shown randomly one by one for the test. So, there were 6 sub finding tasks for every participant. Secondly, interviews session on participant’s subjective satisfaction were made.

Fig. 3.
figure 3

16 icons placed randomly (left) and 6 icons for the test (right) (Color figure online)

The experiment was carried out one subject by one subject in the testing room to keep out interfere with each other. Before the experiment, several question about mental and physical state was given to make sure that the subject was suitable for the test, or he/she should be replaced by the next one. After age and sex of the participant were gathered and experiment preparatory work, such as eye tracking calibration, was done, the experiment was carried out as follows, as shown in Fig. 4.

Fig. 4.
figure 4

Experimental procedures

  • Step 1: The instruction of the experiment was given to the subject to ensure that the subject knew the whole procedure.

  • Step 2: The 16 icons placed in a random order were shown for 20000 ms for the participants to get a general view about them, since there were no texts under these icons to explain their means.

  • Step 3: An icon from the pairs out of pair 3, 4 and 7 was shown for 2000 ms after the prompt for pre-experiment whose length was 2000 ms.

  • Step 4: The 16 icons placed in a random order were shown. It would disappeared if the subject make a choice with touching on any icon.

  • Step 5: Another sub finding task was made with another icon from the pairs out of pair 3, 4 and 7 after 2000 ms black screen.

  • Step 6: There was a 20 s break after the step 3–5 as the pre-experiment.

  • Step 7: The prompt for formal experiment whose length was 2000 ms was shown.

  • Step 8: Sub finding tasks made with the 6 icons in a randomly order from pair 3, 4 and 7 were carried out for formal experiment in the way for pre-experiment.

  • Step 9: The prompt for the end of the test was shown to finish the experiment.

  • Step 10: After the test, interviews were carried out to get participation’s satisfactions.

In order to avoid the effect of learning experience of the experiment, it was very important that the positions of the 16 icons were randomly arranged for every sub finding task in the pre-experiment and the formal experiment for every participant. In order to improve sampling rate, subjects were asked to fix their vision on the middle area of the mobile phone screen and keep the correct sitting posture.

3 Results and Discussion

After the first round of the experiment, sampling rate of 2 subjects aged 66–70 were not reaching the standard (lower than 85%). 2 more subjects were randomly selected for the test. So, there were 144 (24*6) groups of effective data.

3.1 Behavioral Data

Tables 1 and 2 showed the behavioral data of the experiment. The reaction time, number of errors of the test were statistically analyzed through ANOVA.

Table 1. Behavior results of icon group a and icon group b
Table 2. Behavior results of age group 60–65 and age group 66–70

The reaction time for icon group a and icon group b were compared by One-Way ANOVA. Results showed that reaction time were significantly affected by the colors (F (1, 46) = 8.680; p < 0.05). The reaction time for icon group a and icon group b was also compared by Two-Way ANOVA. Results showed that reaction time was significantly affected by the colors (F (1, 44) = 9.243; p < 0.05) and was not significantly affected by the age (F (1, 44) = 1.472; p > 0.05). It was said that the reaction time of monochromatic flat icons was less than that of multi-colored flat icons and the elderly spent similar time to complete these tasks.

The number of errors for icon group a and icon group b were compared by One-Way ANOVA. Results showed that number of errors were not significantly affected by the colors (F (1, 46) = 0.392; p > 0.05). The reaction time for icon group a and icon group b were also compared by Two-Way ANOVA. Results showed that reaction time were not significantly affected by the colors (F (1, 44) = 1.543; p > 0.05) and the age (F (1, 44) = 0.385; p > 0.05). It was said that the number of errors had nothing to do with monochromatic flat icons or multi-colored flat icons, and group aged 60–65 or group aged 66–70.

3.2 Eye Movement Data

Tables 3 and 4 showed the eye movement data of the experiment. The time that a subject spent to fix their vision into target AOI and the fixation counts of the experiment were statistically analyzed through ANOVA.

Table 3. The eye movement data of icon group a and icon group b
Table 4. The eye movement data of age group 60–65 and age group 66–70

The time that a subject spent to fix their vision into target AOI for icon group a and icon group b was compared by One-Way ANOVA. Results showed that time was significantly affected by the colors (F (1, 46) = 9.156; p < 0.05). The time that a subject spent to fix their vision into target AOI for icon group a and icon group b was also compared by Two-Way ANOVA. Results showed that time was significantly affected by the colors (F (1, 44) = 10.452; p < 0.05) and were not significantly affected by the age (F (1, 44) = 1.730; p > 0.05). It said that subject spent more time on finding out the multi-colored flat icons than that of monochromatic flat icons.

The fixation counts for icon group a and icon group b were compared by One-Way ANOVA. Results showed that number of fixation were significantly affected by the colors (F (1, 46) = 12.774; p < 0.05). The fixation counts for icon group a and icon group b were compared by Two-Way ANOVA. Results showed that fixation counts were significantly affected by the colors (F (1, 44) = 13.722; p < 0.05) and also the age (F (1, 44) = 6.345; p < 0.05). It was harder for subject to differentiate multi-colored flat icons than monochromatic flat icons. The group aged 67–70 spent more energy to fix their vision on the target icons than the group aged 60–65, although similar time was taken for whole task.

3.3 Satisfaction Data

Interviews were carried out to collect the information of the participant’s perceptual evaluation of the design of the 8 multi-colored flat icons and the 8 monochromatic flat icons based on Likert scale [11]. All participants were asked to fill in the questionnaire to show how strongly they agree or disagree with that it was concise, easy to remember, easy to adapt, beautiful of these icons and how the liked them, on a 5 point Likert scale from 1 (= strongly disagree) to 5 (= strongly agree). Participant’s subjective satisfactions were analyzed, as shown in Table 5 and Fig. 5.

Table 5. Subjective satisfaction data
Fig. 5.
figure 5

The bar graph of subjective satisfaction (Color figure online)

  • Monochromatic flat icons were more concise than multi-colored flat icons. This result was also confirmed in the interview.

  • For multi-colored flat icons, a variety of colors would also increase the burden on the participant’s memory. So it was easier to remember the shape and means of monochromatic flat icons. It was the reason that less time was spent on finding out the target monochromatic flat icon.

  • Participants thought there was little difference between monochromatic flat icons and multi-colored flat icons as far as “easy to adapt” was concerned. So, they could complete the experiment successfully. And the error number had nothing to do with the kind of icon.

  • Multi-colors were more beautiful. Because the combination of different colors could bring good visual experience.

  • There were little difference as far as “like” was concerned. Although monochromatic flat icons were more concise and easy to remember, many participant thought that the beauty was an important factor for smart phone icons.

4 Conclusion

The study showed that monochromatic flat icons were more concise and easy to remember than multi-colored flat icons for the elderly. Monochromatic flat icons took less time for the elderly to find out them. Aged 60–65 or 67–70 and the kind of the icon were not the reasons that older people made an operation mistake. Some older people liked multi-colored flat icons more than monochromatic flat icons for their colorful vision experience. These results could be used for the smart phone icon design for the elderly.

However, the results indicated in this study did not represent the entire population of the elderly people. The icons designed for experiment did not take color contrast and other factor into concerned. Further work needs to be done to expand the study.