Speed-Patterns / speed-patterns

A collection of design patterns for fast web sites
https://www.speedpatterns.com/
33 stars 2 forks source link

DRAFT New Pattern: Don't Use Spinners #6

Open sergeychernyshev opened 6 years ago

sergeychernyshev commented 6 years ago

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

*

vanux commented 6 years ago

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 commented 4 years ago

@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.