Keywords

1 Introduction

Progress bars provide feedback for people when they are waiting for websites to load and profiles to download. With such information, users are aware of system operations in the background and are able to estimate the remaining time [1]. However, even with the progress information, users’ interest begins to decline when the loading time of a web page exceeds two seconds [2]. If the time continues to increase and exceeds ten seconds, more than half of the users give up browsing the website [3,4,5]. Shortening the loading time is one of the solutions to avoid user churn. However, it is difficult to speed up the objective loading time, due to limitations such as bandwidth, lack of storage memory, or oversized resources. An alternative could be compressing users’ subjective time perception; in other words, making users’ perceived waiting time shorter than the real waiting time.

Several characteristics of progress bars have been found to have influence on users’ time perception. Backward-moving, decelerating ribbed progress bars yielded shorter time perception than the real duration [6, 7]. Additionally, users’ time perception may also be affected by the shape [8] and size [9] of progress bars, irregular and multiple clues outside progress bars [10], and the meaning of attached characters [11].

Although time perception can be reduced by changing progress bar features, users often still give up when the waiting time is extremely long. In this case, improving users’ tolerance for waiting (TW) should also be considered in the design of progress bars [12]. To improve TW, designers should consider the importance of the emotional experience or preference of the progress bar design. A lot of progress bars use decorations (e.g., company logos, cartoon animations) to improve users’ emotional experience. Currently, most decorations are simple, repetitive, monotonous, and predictable graphical elements, which cannot shorten users’ time perception effectively [8]. Compared to predictable decorations, our first hypothesis was that unpredictable and meaningful decorations (e.g., animations with story lines) could not only reduce users’ time perception, but also improve their TW.

Unpredictable graphics may lose their power when the duration exceeds a threshold. In order to improve user experience under such situations, we proposed the concept of interactive progress bars, which will allow users to play games during waiting time. Our second hypothesis was that interactive progress bars could not only significantly reduce time perception but also increase TW – even when the waiting time is much longer.

Two experiments were conducted to test the hypotheses: experiment one simulated the situation of loading literatures in the database, which is a situation with a shorter waiting duration; experiment two simulated a software installation, which is a situation with a longer duration. We aimed to explore the influence of predictability and interactivity of progress bar decorations on time perception, tolerance for waiting, and user preference, which, in turn, provides inspiration for the progress bar design.

2 Experiment One: Unpredictable Progress Bar Decorations

2.1 Methods

Participation.

23 undergraduate students (15 female) at the Zhejiang University who reported normal or corrected-to-normal vision were recruited to participate with an average age of 20.3 years old.

Apparatus and Equipment.

A Lenovo laptop equipped with the Google Chrome browser was used to display the experimental program, which was written via HTML 5 and JavaScript standard programing. 12 graphics – half of them are unpredictable with different frames – were selected from our pilot study. 19 volunteers separate from the study participants rated the predictability of 26 dynamic graphics on a scale of 1–7, where 1 represents “completely unpredictable” and 7 represents “completely predictable”. Figure 1 shows an example of these two types of graphics. The stimuli were displayed in an 800 px (width) × 230 px (height) area at the center of the screen, with a 200 px × 200 px area of graphics and the rest of area as loading bar with a constant loading speed.

Fig. 1.
figure 1

An example of unpredictable graphics (top) and predictable graphics (bottom).

Full size image

Study Design.

A 3 (loading time: 5 s, 10 s, 15 s) × 2 (predictability of progress bar decorations: predictable, unpredictable) within-subjects mixed design was used. The loading time and decorations with different predictability were randomly presented. Each graphic selected appeared once in three loading time conditions, resulting in 36 randomly presented trials. The experiment took approximately 30 min.

The dependent variables were time perception and TW. Participants’ time perception was measured through the duplication method [10] and the rating scale [8]. Participants’ preference of various decorations was measured through a 7-point Likert scale [8].

Procedure.

First, the participants were told that they found a paper related to their research on Google Scholar. They clicked the link to open, but the loading time was longer than usual due to a network issue. There was a progress bar indicating the progress. After the article was displayed, participants completed the three following evaluations: (1) duplication of the waiting time by pressing the SPACE key to start and releasing to stop when they felt the pressing time was the same as the loading time; (2) rating their waiting time from 1-extremely short to 7-extremely long; and (3) rating the preference toward the presented progress bar from 1-extremely dislike to 7-extremely like. Then, the next trial followed.

After completing all 36 trials, participants had a five-minute break. Then the progress bar with each graphic was randomly presented. The self-terminating adjustment method was used: participants were told to close the page by clicking the close icon in the upper right corner to terminate the waiting period once they could not wait any longer. The maximum waiting time was two minutes. This duration was measured as TW.

2.2 Results

Time Perception.

Table 1 summarized participants’ time perception under different conditions. A two-way repeated analysis of variance (ANOVA) on duplicated time revealed a significant difference between loading time lengths, F(2, 44) = 164.26, p < .001, \( \eta_{p}^{2} \) = .88, which verifies the effectiveness of experimental manipulations. The main effect of predictability also reached significance, F(1, 22) = 6.81, p < .05, \( \eta_{p}^{2} \) = .24, suggesting that participants perceived less waiting time for progress bars with unpredictable decorations than with predictable ones. This supported our first hypothesis.

Table 1. Descriptive statistics of time perception [M (SE)] under different conditions
Full size table

The ANOVA on the subjective rating score revealed a significant main effect of loading time, F(2, 44) = 382.78, p < .001, \( \eta_{p}^{2} \) = .95. The main effect of predictability did not reach significance, F(1, 22) = 3.72, p = .14.

Tolerance for Waiting (TW) and Preference.

As revealed by a paired sample t test, the participants had significantly higher TW for progress bars with unpredictable graphics than with predictable ones. A paired samples t test showed that there were no significant preference differences between the two types of progress bars, t(22) = 1.17, p = .25.

3 Experiment Two: Interactive Progress Bar Decorations

3.1 Methods

Participation.

19 participants (9 females) different from experiment one at the Zhejiang University participated in the experiment two with an average age of 21.1 years old. All participants had normal or corrected-to-normal vision.

Apparatus and Equipment.

The same PC and web browser were used to display experiment program. Three games – Super Mario, Gluttonous Snake, and Anipop – were chosen because of their popularity. The stimuli were displayed in an 800 px (width) × 530 px (height) area at the center of the screen, with an 800 px × 500 px area of game and the rest of the area for the loading bar with a constant loading speed.

Study Design.

A3 (loading time: 15 s, 30 s, 45 s) × 3 (interactivity of games above progress bars: blank control group, non-interactive game video, interactive game) within-subjects mixed design was used. The loading time and the levels of interactivity were randomly presented. Each game was used once for each of the 9 conditions, resulting in 27 trials. This experiment took approximately 50 min.

The dependent variables were time perception, TW and user preference. The measurements remained the same as in experiment one.

Procedure.

First, the participants were given the context of software installation with a longer waiting time than usual. There was a progress bar indicating the progress. The remaining process remained the same as in experiment one.

3.2 Results

Time Perception.

Table 2 summarized participants’ time perception toward progress bars with different loading time and levels of interactivity.

Table 2. Descriptive statistics for time perception [M (SE)] under different conditions
Full size table

The ANOVA on duplicated time revealed a significant main effect of loading time, F(2, 36) = 83.88, p < .001, \( \eta_{p}^{2} \) = .82, which verifies the experimental manipulations. The main effect of interactivity was significant, F(2, 36) = 30.172, p < .001, \( \eta_{p}^{2} \) = .63. Bonferroni Post hoc contrast revealed that the participants perceived a significantly shorter time when playing games, compared with the other two conditions. The interaction between loading time and interactivity also reached significance, F(4, 72) = 3.80, p < .05, \( \eta_{p}^{2} \) = .17. Simple effect analysis with Bonferroni showed that when the loading time was 15 s, the differences of duplicated time among the three conditions reached significant (p < .001); when the loading time was 30 s or 45 s, the difference of duplicated time between non-interactive game video and blank was not significant (30 s: p = .28; 45 ms: p = .29).

The ANOVA on the subjective rating score revealed a significant main effect of loading time, F(2, 36) = 191.45, p < .001, \( \eta_{p}^{2} \) = .91. The main effect of interactivity also reached significance, F(2, 36) = 69.71, p <.001, \( \eta_{p}^{2} \) = .80. Bonferroni Post hoc contrasts revealed that participants perceived the longest time in blank control condition, followed by the game-video condition and game condition. The interaction effect was significant: F(4, 72) = 6.32, p < .001, \( \eta_{p}^{2} \) = .26. A simple effect analysis showed that when the loading time was 15 s, the difference of the perceived time between blank and non-interactive game video was marginally significant (p = .052); when the loading time was 30 s or 45 s, the differences of the perceived time among the three conditions were significant (p < .001).

Tolerance for Waiting (TW) and Preference.

The ANOVA on the TW indicated a significant main effect of interactivity: F(2, 36) = 21.21, p < .001, \( \eta_{p}^{2} \) = .54. Participants had the highest TW when playing games, followed by game-video viewing condition and the blank control condition. The differences among the three conditions reached significance (p < .05).

The ANOVA on participants’ preference indicated that participants had significantly different preference towards various types of progress bars, F(2, 36) = 49.53, p < .001, \( \eta_{p}^{2} \) = .73. The progress bars with interactive games were preferred the most, followed by those with game videos. The differences of preference under three conditions reached significance (p < .05), suggesting that progress bars with higher involvement were preferred by most participants.

4 Discussion

The current study compared the time perception and tolerance for waiting for different types of progress bars. It was found that the unpredictable progress bars yielded a shorter perceived time and a higher tolerance for waiting, compared to the predictable ones. Compared to the non-interactive progress bars, the interactive progress bars led to a shorter the perceived time, a higher tolerance for waiting, and more user preference.

The attentional-gate model [13] which combines pacemaker and attentional components, provided an explanation for such an effect. In this model, to estimate duration, people may be required to divide their attention between nontemporal and temporal information processing. The more attention resources are allocated to process time information, the more pulses generated by the pacemaker are allowed by the attentional gate to pass through, resulting in more pulses are accumulated and counted by the cognitive timer [14,15,16]. In addition, more attentional resources can be allocated to time information when processing simple stimuli rather than complex stimuli [13]. In this case, users processed predictable decorations as simple stimuli and therefore allocated more attentional resources to temporal information provided by the loading bar, which resulted in a longer perceived time than processing unpredictable decorations. Similarly, more attention was allocated to interactive games as complex stimuli, resulting in less attentional resources allocated to temporal information, and, in turn, users perceived a shorter time. In addition, gamified progress bars increased user involvement [17], which allowed users to immerse themselves in the game and allocate less attention to temporal information, thereby increase their tolerance for waiting.

The results also indicated that when the loading time was less than 30 s, time perception among three types of progress bars was significantly different. When it exceeded 30 s, there was no significant difference between the control group and the game-video group; but the perceived time of gamified bars was still significantly shorter than the other two. This supported our second hypothesis that gamified progress bars can effectively shorten users’ time perception within the context of an extremely long duration.

These findings will provide designers with much guidance. When the loading time is about 15 s, decorations with story lines can be placed above progress bars. Gamified progress bars could be used when the loading time is longer than 30 s or is uncertain.

The findings from our research should be generalized carefully considering the following limitations. First, as interactive progress bars with games are rare, we set a control group in experiment two. Experiment one did not have a control group as mostly existing progress bars were decorated with various graphics. A control group could be added in the future to systemically examine whether the absence of decorations would influence time perception. Second, users may develop strategies to silently count time using the duplication method, resulting in an improper time perception. Some researchers used a second task (e.g. odd/even number decision-making) to suppress strategy development [10, 11]. However, the introduction of a second task would increase the mental load of time information, which, in turn, affects time perception [18,19,20]. Instead, we reminded the participants to duplicate the time only based on their perception.

5 Conclusion

Our findings indicate that progress bars with storytelling animations and interactive games can reduce users’ time perception of the waiting period and increase their tolerance for waiting. Making progress bars tell a story and gamifying them can be used in various real-life scenarios to fulfill different needs and improve the user experience.