Loading Insights: How design choices shape our Sense of Time in loader animations.

A deep dive into wait indicator interfaces & intricacies of time perception.

A quantitative research project on human ergonomics by Yash Bharani, and Anisha Verma

Overview

In the digital age, every second counts, and the way users perceive waiting times on applications can significantly influence their overall experience.

How long a user feels they’ve been waiting can be very different from the actual wait time. This discrepancy can be influenced by various factors, including the type of visual feedback provided by the application.

Wait indicators, often seen as loaders or spinners, are visual or graphical elements in user interfaces. Their primary purpose is to provide feedback to users when they’re waiting for a process or operation to complete. But can the design of these indicators influence how long users feel they’ve been waiting?

This article delves deep into a research study conducted at IDC, IIT Bombay, which investigates the impact of visual feedback types on the wait indicator interface of a Desktop application.

Here we created this website that we asked the sample of users to interact with for our study.

LoaderEnigma

The Attentional-Gate Model

The attention gate model, as a theoretical framework, posits that attention can modulate the perception of time. According to this model, when a person’s attention is fully engaged, the internal clock or the perception of time may run faster, leading to a sensation that time is passing more quickly than when attention is not engaged.

In a practical sense, the attention gate model could be used to design the study’s experiments and interpret the results

Loader Selections

<iframe src=”https://ergonomics-3db94.web.app/" style=”border:0px #ffffff none;” name=”LoaderEngima” scrolling=”no” frameborder=”1" marginheight=”0px” marginwidth=”0px” height=”100%px” width=”100%px” allowfullscreen></iframe>

1. Static Text Loader

2. Circular Loader →

i) Indeterminant

ii) Determinant loader

iii) Determinant Loader with Percentage

3. Animated Loader →

i) Cat Loader (Slow)

ii) Cat Loader (Slow) with Percentages

iii) Mouse Loader (Fast)

iv) Mouse Loader (Fast) with Percentages

4. Interactive Loaders →

i) Particle Loader

ii) Particle Loader with Percentages

iii) Mandala Loader

iv) Mandala Loader with Percentages

Research

This research investigates differences in time perception, the effects of various loader types on perceived waiting times and user preferences.

The research aimed to:

1. Investigate the impact of different wait-indicating loaders on users’ perception of time.
2. Compare the effectiveness of various loader types, such as static text, circular loaders, cartoon loaders, and a novel approach — the interactable loader.

The study involved participants from IIT-Bombay, representing a diverse group in terms of age, computer literacy, and software experience. Participants were shown different loaders and asked to estimate the time for which the loaders played.

Research Objective

To investigate the impact of various wait-indicating loaders on users’ perception of time and their preferences for these loaders in a desktop application interface.

Hypotheses

• Different types of loaders (static text, circular, cartoon, interactive) affect the perceived waiting time differently.
• Interactive loaders reduce the perceived waiting time more effectively than non-interactive loaders.
• The presence of progress percentages in loaders influences the perceived waiting time and user preferences.

Variables

• Independent Variables: Type of loaders (static text, circular, cartoon, interactive), Loader playtime (6s, 10s, 14s).
• Dependent Variables: Perceived waiting time, and user preferences for different loaders.
• Control Variables: Duration of loader display, age groups, color, form, device type, and education level.
• Random Variables: Gender, order of loader selection, education branch.
• Confounding Variables: Phone use pattern, experiment environment, user engagement.

Participants

72 master’s students from IIT Bombay, representing a variety of age groups (20–35 years), computer literacy levels, and desktop software experience.

Experimental Design

• Type of Study: Within-subject design for loader types and between-subject design for loader playtime.
• Procedure:

Participants were shown 12 different loaders in a random order.

Each loader had a consistent playtime duration.

Participants were divided into three groups, each experiencing loaders for different durations (6s, 10s, or 14s).

Participants were asked to estimate the waiting time for each loader and rank them based on preference.

Participants were instructed not to count internally or use external clocks for time estimation.

Comments on the experience were also collected.

Experimental Design

Data Collection

Data included perceived waiting time estimates (in seconds) and preference rankings for each loader type (On the likert scale).

Randomization

Participants viewed loaders in a random order to prevent order effects from influencing the results.

Sample of Participants

Statistical Analysis

• Two-way ANOVA: To assess the impact of loader type and playtime duration on perceived waiting time.
• One-way ANOVA: To compare preferences across loader types.
• Paired t-tests: When comparing two variables, such as gender differences in time estimation accuracy.

Perceived Time Data

We tabulated the perceived times and then divided the offset (guessed time — actual time) with the actual time. The following chart is the mean of this value (Δ/time) across the 5 categories.

In our collected data, it was found after the two-way ANOVA method that Yes, there is a significant difference of the Δ/time across loaders (carton / circular/interactive etc.) but there is no significant difference of the Δ/time across times (6s, 10s, or 14s.)

Then we went on to investigate which loaders mean Δ/time is significantly different, and we found the following results.

1. The Static Text is significantly worse (users perceived more time) when compared to the cat cartoon loader, and all the interactive loaders.
2. Circular loaders (both progressive and random) are significantly worse than interactive loaders.
3. The Hamster cartoon loader is significantly worse than the interactive loaders

Preference Data

We looked at the preferences of the loaders across the 7 categories ie static loader, circular random loader, circular progressive loader, the cat cartoon loader, hamster cartoon, particle interactive loader, and mandala interactive loader.

1. The users rated the Static text significantly less than all the other graphical loaders.
2. The users rated the Mandala loader significantly less than the Particle loader.

Other Findings.

1. We looked at the guessing accuracy across the two genders of the participants and we found that the females were significantly more accurate in guessing the time than men.
2. We found from the student’s t test that there is no significant difference in the eait times when we introduced the loading percentages in either of the 5 types of the loaders (random circular, cat, hamster, particle and mandala.). But qualitatively the users preferred the loader with percentages more.
3. We found that there is a significant difference in wait time perceptions between the cat and the hamster cartoon loader. Suggesting the fact that in the slow animated loader, the wait time is perceived less when compared to a very fast loader. But on the other hand, users preferred the hamster loader (with faster animation speed) more.

Ethical Considerations

• Participants’ information was kept confidential.
• Informed consent was obtained.
• Participants were made aware of their rights and the aim of the study.

Key Findings

Following are the key findings in the study that can be established on the sample of participants.

1. Interactive Loaders: These loaders effectively engaged users, leading to a perception of reduced wait time.
2. Progress Perception: The addition of percentages in loaders does not significantly influence the perceived wait times.
3. Animated Cartoons: Faster animations made waiting time feel shorter, while slower ones had the opposite effect.
4. Static Loaders: These were rated less favourably than interactive and cartoon loaders. They also have the most time perception.

Discussions

Is the male and female perception of time different?

Yes, Female users were able to perceive time more accurately as compared to male users.

Do users prefer loaders with progress percentages in comparison to loaders without progress percentages?

No, There was no significant difference of the time perceived in loaders vs their respective counterparts with percentages.

Do the loader types have an effect on perceived times.?

In our study, we discovered that different loaders influenced how users perceived waiting time:

Animated Cartoon Speed: Faster animations made waiting time feel shorter, while slower ones had the opposite effect.

Interactive Loaders: Users felt engaged and perceived shorter waiting times when they could interact with loaders.

Surprising Static Loaders: Even non-interactive static loaders felt shorter because users anticipated interactions, diverting their attention from the actual wait time.

Is there any significant difference between the perceived time for the 2 interactive loaders?

No

Is there any significant difference between the perceived time for different durations of time the loader is shown?

No

Is there any significant difference between the perceived time for the Static loader

It was significantly worse than interactive loaders and the cat animation. But not significantly less than others.

Are Interactive loaders significantly better in time perceptions?

Yes, it was significantly better than static loaders, And the circular types of loaders. The Mandala loader was significantly better than the hamster-type loader as well.

Are the cartoon loaders better than the static, and circular loaders?

With some, the cat loaders were better, but we can’t claim that overall the cartoon loaders are better than the circular loaders.

But it is clearly significantly better than the static text loaders.

Is there any significant difference in user preference across loaders?

Yes, Static Text was rated significantly worse than all the other types. The particle loader was rated significantly better than the Mandala loaders.

Compared to repeating patterns, does the element of surprise in random patterns influence user choice and engagement during wait times?

Users lost interest in the pattern loader due to the pattern’s repetition over time, which reduced interaction. The random pattern, on the other hand, maintained user interest due to the element of surprise, thereby engaging users throughout the waiting period. As a result, the random pattern loader was preferred more over the pattern loader by the users.

Conclusion

• Loader design influences time perception and user preferences.
• Interactive loaders are preferred and reduce the perceived waiting time more effectively than static or non-interactive loaders.
• The study provides insights for optimizing user experiences during waiting periods in desktop applications.