Page MenuHomePhabricator

[wmf.6] Empty chart area flashes while Translation page loads
Closed, ResolvedPublic

Description

If a user does not have published translations, the chart area for stats will be displayed empty while the page is loading.

Event Timeline

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptNov 3 2017, 11:19 PM

Change 393258 had a related patch set uploaded (by Petar.petkovic; owner: Petar.petkovic):
[mediawiki/extensions/ContentTranslation@master] Add loading indicator to CX stats card

https://gerrit.wikimedia.org/r/393258

I have tried two different options for loading period on Content Translation dashboard, for the user statistics card. Here are the gifs for two proposals and current state, comparing situations when user has some translation stats to load, against the situation where user doesn't have any translations so far.
All gifs are made using simulated network speed of "slow 3G" device.

Current state

Current state is described in the description of this ticket. The statistics card is initially shown, and removed or populated, depending on user stats.

User has translation stats to be shownUser still has no translations

Invert appearance behavior of statistics card

First proposal inverts the appearance behavior of statistics card. The statistics card is initially hidden, and data is populated if there is user stats to be shown. Otherwise, the card remains hidden.

User has translation stats to be shownUser still has no translations

Add loading indicator

To better align with newly introduced loading indicators for Suggestions/In progress/Published lists on Content Translation dashboard, I have submitted a patch that adds loading indicator on user stats card. The card is always visible, and does not become hidden even if there are no user stats to show. Instead, the message is displayed, informing a user that there is no stats to be loaded.

User has translation stats to be shownUser still has no translations

The message introduced is good opportunity to convey some of the messages relevant to New editors research, like we did on "New translation" dialog, where we encourage user to translate with: "Think of any topic of your interest. You don’t need to be an expert to create a great translation."

One thing to consider: If this version stays, we may want to differentiate messages for failure to load data (due to network or other issues) from message when user still hasn't translated any page.

Note: Loading indicator patch is already submitted, while inverted appearance behavior is not.

@Pginer-WMF, which option should I choose?

@Pginer-WMF, which option should I choose?

I'd recommend the "invert appearance behavior" approach. Compared to the current situation, it is more natural for a card to appear bringing useful information rather than a card suddenly disappearing causing a glitch.

The "loading indicator" approach has the benefit of resulting in less moving pieces, but it introduces an empty card for new users that only contributes to distract form the main piece of information: the list on the left (which is also used to deliver an encouraging message when empty).
If we really want to avoid the help links to jump after the load of the statistics, we can delay the appearance of the links card to be shown after the statistics card process is complete, although we probably should consider this only if loading the stats info is often slow enough to cause potential accidental click problems.

Also, a minor detail: in your animations the very initial state shows a different grey for the whole screen than the one used as the background of the page later. Would it be possible to use the later one from the beginning?

Change 393258 abandoned by Petar.petkovic:
Add loading indicator to CX stats card

Reason:
Decided to go with a different approach.

https://gerrit.wikimedia.org/r/393258

Change 393578 had a related patch set uploaded (by Petar.petkovic; owner: Petar.petkovic):
[mediawiki/extensions/ContentTranslation@master] Prevent empty chart flashing on CX dashboard

https://gerrit.wikimedia.org/r/393578

@Pginer-WMF, which option should I choose?

Also, a minor detail: in your animations the very initial state shows a different grey for the whole screen than the one used as the background of the page later. Would it be possible to use the later one from the beginning?

I have submitted a patch addressing the change of background.
It was using skin specific background, not necessarily only the color, like it is on Vector skin. For example, monobook skin shows book image while loading, which disappears once dashboard has loaded.

Nikerabbit moved this task from In Review to QA on the Language-2017-Oct-Dec board.

Change 393578 merged by jenkins-bot:
[mediawiki/extensions/ContentTranslation@master] Prevent empty chart flashing on CX dashboard

https://gerrit.wikimedia.org/r/393578

Checked in cx-testing - "Invert appearance behavior of statistics card" works smoothly: users without translations won't see the stats area; for user with translations, the stats area loads instantaneously.

Etonkovidova closed this task as Resolved.Nov 28 2017, 10:32 PM

The stats area loads instantaneously.

That really depends on user's network speed, which can be really slow on mobile device. That's why I have used network throttling simulation to illustrate how different approaches look on slower devices.

New behavior is:

  • Do not show stats card at all; For users without translations.
  • Defer showing of stats card, until data is loaded from server; For users with translations.
Nikerabbit moved this task from QA to Done on the Language-2017-Oct-Dec board.Nov 29 2017, 9:52 AM