As described in January’s post, animations can fulfill essential purposes in user interface design. This article provides some insight into a study that has been conducted with the goal of exploring the effects of animations regarding user experience.
Prototype and Tasks
The object of the study was the interactive prototype of a facility management system. Its main functionality was to give an overview of a building (floors and rooms), adjust the temperature and assign the right employee to arising problems in order to solve them.
The participants first had to increase the temperature in the building. The result of this increase was an overheated server in the building. The participants then had to navigate to the source of the error and assign the IT Administrator to this problem in order for her to solve it.
Study Design
Participants in the study were divided in two groups. While one group interacted with an animated version of the prototype, most of the animations were replaced with static counterparts for the second group (“static group”). The differences between the two versions of the prototype affected, amongst other things
- help display: whereas the interaction for assigning a staff member to a problem was described with a text for the static group, the animated help version consisted of an animated arrow showing the connection between the staff repository and the room overview and thus giving a visual hint on the required drag & drop interaction
- transitions between screens: for the static group, one screen state was simply replaced with another whereas in the animated prototype, there was a continuous change from start state to end state
- alert icons: the static group was presented with static exclamation marks whereas in the animated version of the prototype the exclamation mark icons were “pulsating”
The tasks to be performed were the same for both groups.
Interaction with the prototype was observed and a questionnaire was administered after the participants had concluded their interaction with the prototype in order to gain additional insight into user experience issues.
Results
In this section, four findings of the study are described in order to shed some light on the effects of animations on user experience.
- Attention-directing function of animations: Subjects in the “static group” had more problems with assigning an employee to the problem because the help text on the screen next to the error was oftentimes not recognized – in contrast to the animated help.
- Influence of user proficiency on judgment of animation speed: The subjects who don’t work with computers on a daily basis, were much more grateful for the animations and liked the animations more than the ones who use the computer every day. This also showed in regard to animated screen transitions. While most of the regular computer users liked them, but thought they were too slow and that they would rather annoy them after some time, the more inexperienced subjects found them very helpful and had no such concerns. This shows that the speed of animations has to be chosen carefully considering user characteristics.
- Influence of user proficiency on feeling of urgency as created by animations: When asked if they were afraid of making mistakes when using the prototype the differences between advanced computer users and the occasional computer users became apparent again. While the ones that don’t work much with the computer answered that the animated alert icon (blinking exclamation mark) created a certain atmosphere of panic for them the advanced users sensed something completely different. They said that due to the heavy use of animations used in the prototype they felt more like in a computer game than in an actual application and thus had less fear of making mistakes. They didn’t sense the animated exclamation mark to be as threatening as the occasional users. That shows that the use of animation in an application should be adjusted to the target audience in order to gain the desired effects.
- Influence of animations on joy of use: What became very clear during the tests as well as in the questionnaire afterwards was that the subjects who used the animated version of the prototype had much more fun while using the application. While all of them agreed, that the user interface was very nicely designed, the animated group still had more fun using it. This result showed that animations have a huge impact on the joy of use of a modern application.
Conclusion
After analyzing the data gathered in the study, first answers regarding the question of benefits and drawbacks of animations in user interfaces emerged. On the positive side, animations made users like the application more and used in the right way they were able to help inexperienced users to work with the applications. But there were also drawbacks: experienced users felt limited in their use of the application due to the employment of animations. So it is crucial to consider user characteristics in order to decide when and how to use animations.
Of course, the study has far from answered all the questions that can reasonably be asked regarding the influence of animations on user experience. There is still a variety of interesting questions that can be asked in that area and the future will hopefully see more answers in order to employ animations in a way that enhances user experience.
This blog article is an edited version of material originally written by Anna Günther based on her bachelor thesis conducted at Centigrade.