Page MenuHomePhabricator

spinner.gif progress indicator looks kinda weird
Closed, ResolvedPublic

Description

In 2007 we introduced spinner.gif as an animated progress indicator, currently used in some of the AJAX data fetching for uploading, CodeReview, and probably a few others.

The icon itself is a little funky looking IMO; per log it was originally intended to visually reflect the MediaWiki flower logo (ie, with little yellow petals) but this doesn't really come through. More importantly, it's not visually clear on some backgrounds and it doesn't fit with our visual style as we're modernizing it with the Vector skin etc.

I'd recommend something with more of a modern look, perhaps like this Tango-themed throbber:

http://commons.wikimedia.org/wiki/File:Loader3.gif

or this Ubuntu-style one:

http://commons.wikimedia.org/wiki/File:Linux_Ubuntu_Loader.gif

Assigning initially to Parul as part of our visual refresh, but anybody feel free to pile on some notes. :) [If there's not a clear winner let's slap up a page on usability.wikimedia.org w/ some ideas.]


Version: unspecified
Severity: enhancement
URL: http://www.mediawiki.org/skins-1.5/common/images/spinner.gif

Details

Reference
bz20356

Event Timeline

bzimport raised the priority of this task from to Medium.Nov 21 2014, 10:57 PM
bzimport set Reference to bz20356.

herd wrote:

I made the current sucky non-photographic version, as when using it on en.wp with injectSpinner() the original had horrible artifacts on non-white backgrounds (having been merged to white when resized).

Btw, here is a demo of all the throbbers on commons that I could find (and some I made):
http://www.mediawiki.org/wiki/User:Splarka/Throbber

You'll notice both of the ones mentioned look odd on a black background, for example.

We currently use a spinner very much like Firefox's (maybe even the exact same one, Trevor knows) for loading toolbar sections: http://en.wikipedia.org/w/extensions/UsabilityInitiative/images/wikiEditor/toolbar/loading.gif

herd wrote:

(In reply to comment #2)

We currently use a spinner very much like Firefox's (maybe even the exact same
one, Trevor knows) for loading toolbar sections:
http://svn.wikimedia.org/viewvc/mediawiki/trunk/extensions/UsabilityInitiative/images/wikiEditor/toolbar/loading.gif?revision=54130

Non-transparent background. Looks odd on non-white backgrounds ^_^.

The old spinner.gif was replaced with a more modern one in r56057.