Page MenuHomePhabricator

Improve UX for VE/Wikitext comparison dashboard {lion}
Closed, ResolvedPublic


Suggestions from an email Pau sent to Dan:

  • Check that using dashed style lines in time series works well. Right now, the fake data has VE and Wikitext plots overlap. Using the same color works well although it will be better to check it when the data is not the same.
  • Accommodate some extra space (top or side) for time series legend to reduce the chance hovering legend overlaps what user is trying to see. Right now in the time series, the legend is shown on hover. This has the advantage that the graph can take all the available space and the legend is only shown when the user is interested in the graph. However, the fact that the legend is shown at the right side where the latest data normally appears makes it hard to check which is the current value of a line that overlaps with the legend.
  • When only one of the funnel analysis graphs is shown, it seems that it only has half of the space assigned which results in the graph getting cropped if the current viewport is not big enough. Ideally, when there is one graph (either VE or wikitext), (this is possible but involves some work to get the funnel graphs to resize dynamically and the semantic grid to play nice with that new capability. Some naive attempts made it worse so I'm just going to leave it as is for now).

Some small styling considerations:

  • Consider removing the margins of "body" and "comparisons.ui.attached.segment". Otherwise the content looks like cards in a grey box inside another white box. If the mentioned margins are removed we can convey a simpler model: a toolbar vs grey body with content cards.
  • For each card, the heading can remain white to make it feel more part of the same card as the graph.
  • Set the font-family to be sans-serif.

Event Timeline

kevinator raised the priority of this task from to Normal.
kevinator updated the task description. (Show Details)
kevinator moved this task to Next Up on the Analytics-Kanban board.
kevinator added a subscriber: kevinator.
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptMar 30 2015, 4:14 PM
kevinator set Security to None.

Change 198169 had a related patch set uploaded (by Milimetric):
Implement A/B comparison

Milimetric updated the task description. (Show Details)Apr 7 2015, 11:02 PM
Milimetric updated the task description. (Show Details)Apr 7 2015, 11:27 PM
Milimetric closed this task as Resolved.Apr 8 2015, 5:02 PM
Milimetric moved this task from Next Up to Tasked_Hidden on the Analytics-Kanban board.
Milimetric moved this task from Tasked_Hidden to In Progress on the Analytics-Kanban board.
Milimetric moved this task from In Progress to Ready to Deploy on the Analytics-Kanban board.

Change 198169 merged by Mforns:
Implement A/B comparison