![[personal profile]](https://www.dreamwidth.org/img/silk/identity/user.png){kind=small}
Most spinners are wrong
A spinner is a debugging tool.
A spinner moves to inform the user that a long-running process is continuing in the background. The process updates the appearance of the spinner as it sends or receives data, as it does something, to inform the user that the process is actively working and is not being blocked and has not gone into an infinite loop. The speed of the spinner hints at to the rate of processing or data flow, whichever is being measured.
The spinner's movement is analogous to the sounds made by a modem when connecting to a computer system through a telephone network. If everything works correctly, there is no need for a modem to have a speaker to repeat signals for the user to hear. The speaker makes it possible for the user to detect that something is wrong when the sounds are not normal. Similarly, a spinner informs the user that something has gone wrong when it stops moving.
You're doing it wrong.
The modern use of spinners is as a distraction to keep the user's attention occupied for a few moments while the process does its work. "Go watch a cartoon, Mommy's too busy to deal with you." This works if the process runs correctly and completes within a few seconds, but it fails to accurately communicate the state of the program. In the worst cases, a user interface will display a spinner when the process has failed and exited or has not successfully launched in the first place. If your software does this, consider it a bug.
Instead of reporting anything useful about the background process, animated GIF spinners report the state of the browser's main timing loop and its image rendering library. Question: "Is the network connection working?" Answer: "The client's UI can display images." It's a nonsequitor.
Spinners might not be right for the web.
Web programming is like war: you spend most of your time waiting, and then there's a small amount of action. Spinners don't map onto this model well. The action is too short to get any useful information from a spinner. A traditional spinner would be seen to be stopped for a few seconds and then finish and exit in the blink of an eye. The extra effort to implement a traditional spinner would be wasted and you may as well just show an animated GIF.
With faster computers and greater bandwidth, the time spent processing and transferring data is no longer as significant as the delays in waiting for change of state. An process spends its time resolving the domain, waiting for a connection, and waiting for a response. If an interface element is to provide useful information to the user, it should change with these changes of state. For example: an animation could be told to advance to the next frame, a message can be posted on the display, a light could change colour, or a transparent coloured overlay can be thrown onto an existing animation.
no subject