What is the Optimal Duration of the Animation Interface?

In 1991, for five million people, there was one website. Today the situation is different – to seven people, there is one website. 25 years of development of the Internet has given developers a lot of knowledge about how a person interacts with the interface. However, two similar interfaces, which differ only in some minor elements can cause an entirely different level of user experience.

One of the factors that influence the perception of the user interface is its interactivity. That is the way a person interacts with it. The interactive design describes what happens between two static states of the object. Unlike other fields, it is focused on the movement – the time and position of an object in space.

Visualization Danger

Man – the product of hundreds of thousands of years of evolution. Our existence is possible for the ability to Recognition of danger. Vision – an essential element in determining how safe we feel. Visual features – such as the definition of contrast, scale, movement – help us to feel the environment. Determining Timing – period in which the visual properties of the object are changed – it helps us to determine the unnatural elements in the environment. For example, when walking through the forest one notices rustling, he concentrates his attention. Evolution has meant that people learned to accept changes to objects, the timing of which does not meet expectations, as a danger.

The sense of timing in humans – is his understanding of the combination of physical laws: gravity, conservation of energy, the theory of relativity. The physical world around us – this is the first “user interface”, which gave rise to expectations of a digital interface. Therefore, when the user application seems something unnatural, it happens because the animation does not match the physical laws that used to be guided by the people.

Balance

Rapid change in the interface difficult to see and understand. Slow, on the contrary, slows down the movement of the user’s service. To help the user understand the animation, the position of objects, and it does not detain him on the way to the goal, designers need to calculate the optimal timing.

Developers of popular applications like Gmail, Airbnb, and Dropbox had to spend an enormous amount of tests to determine the optimal timing of which is clear to millions of users.

From picture to understanding

Traveling on the image to its realization – a linear path, which includes such things as attention and awareness of the person object.

Animation should possess such characteristics, to provoke a person’s attention. It is important to use these elements of visualization, as a contrast, scale, move, and repeat, to have a better chance of being seen. All of this occurs in the first 60-80 ms.

After the human brain called attention to an object, it gets to the stage of consciousness. This period in which people are aware of what is happening but do not know it. Awareness arises through the 100-150 ms. So that people realize what is happening, it is necessary to spend 150-200 ms.

The limits of human knowledge

There is a minimum amount of time required for people to process and understand what they see. The fact that developers can instantly display the new interface that does not mean that users will be able to observe and understand it. The minimum time it takes a person to perceive the animation is 150 milliseconds.

It remains to be seen how long the user can wait for the animation. Studies show that long waiting just lead to failure. When people realize that the animation takes place unnaturally long time, it spoils its appearance. It is very likely that it will stop using the service.

People change its pupil position three times per second. Humans and most animals are always evaluated surroundings. It is programmed by nature; a person can not control the speed or frequency of eye movements. The eye moves as quickly as possible, and each of its fixation takes about 350 milliseconds.

Therefore, the maximum length of the animation should not exceed 350 ms. After this time, human nature compels him to move the focus to another object.