You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Progress indication is sometimes needed for activities that can not be improved in terms of performance.
While it is tempting to use a staple of progress indication, so called "spinner", it is unwise to do so as it has several problems:
shape without beginning and end doesn't let user estimate completion time
animation resets direction after full rotation reinforcing its "infinite" nature further frustrating the user
provides no user feedback over what to expect next leaving user in suspense
Linear versions of infinite animated elements solve some problems of circular spinners, but do not really contribute much of the value anyway.
The only message spinners convey is that you, as creator of the website is aware that your site is slow, but didn't want to do anything about it.
Solution
Deliberately design experiences that do progress indication without resorting to literal progress indicators. Do not let spinners to be used as a generic placeholder for speed design or developers will utilize it without even consulting product or design teams.
Several techniques can be used as progress indication, see "skeletal designs" and "masking slowness with animation".
Would this pattern also be part of 'optimistic actions?" As I recall this is when the system produces an immediate response from the request even when the action didn't yet occur on the backend. The site can do this since they know that 99% of the time the process will be successful. I can do more research but this is how some sites like Twitter and Facebook approach this., In that way the progress indicator is not needed since the response is immediate.
sergeychernyshev
changed the title
DRAFT New Pattern: Avoid The Spinner
DRAFT New Pattern: Don't Use Spinners
Dec 13, 2019
@vanux, it seems that optimistic actions can be a separate, but related pattern.
Can you wrote it up as a separate issue?
I know Nicole Sullivan gave a talk about them as result of her work on Pivotal Platform.
Progress indication is sometimes needed for activities that can not be improved in terms of performance.
While it is tempting to use a staple of progress indication, so called "spinner", it is unwise to do so as it has several problems:
Linear versions of infinite animated elements solve some problems of circular spinners, but do not really contribute much of the value anyway.
The only message spinners convey is that you, as creator of the website is aware that your site is slow, but didn't want to do anything about it.
Solution
Deliberately design experiences that do progress indication without resorting to literal progress indicators. Do not let spinners to be used as a generic placeholder for speed design or developers will utilize it without even consulting product or design teams.
Several techniques can be used as progress indication, see "skeletal designs" and "masking slowness with animation".
Existing blog posts, articles, videos
Links to successful implementations
The text was updated successfully, but these errors were encountered: