Details
-
Improvement
-
Resolution: Fixed
-
Neutral
-
None
-
-
Empty show more show less
-
Kromeriz 33, Kromeriz 34
-
3
Description
I've had a look at the attached screenshot showing the current status of how GA columns look in Pages and have a designed a solution for how we can improve the overall appearance and legibility of the values in these columns.
Here are my suggestions, which you'll also find visualized in the attached wireframes.
Use of icons
As for the icons, let's do this:
- We keep on using the icons you've suggested for "increased" and "decreased" (see below as to why).
- We also color both text and icon (green for increase, red for decrease).
- We do not show any icon, if a particular value does not show a clear increase or decrease. In such a case, the text also sports the regular black text color.
The icons you've chosen (the double chevrons) actually fit the context well and are not uncommon in financial applications. They have the advantage that we could eventually use a single chevron, if an increase or decrease was only slight, and a double chevron if it was significant. Actual arrows are used as well and are especially well working to indicate trends, but for now we're good. I plan on ordering arrows in a future update of the font, but that's going to take a while.
Labels and alignment
- Let's align the icons on the left, the values on the right, similar to how we show date and time in datetime columns.
- If a value gets large, hide the icon first. It's not essential.
- If it gets even larger, truncate the value on the left, but provide for a tooltip that shows the full value on mouse over (if feasible, also show the tooltip on tap/click, but that's secondary).
- If a row is selected, show all icons and labels in white.
Make sure you use the typical margins and or paddings we already use in cells.
The alignment changes provide for a calmer appearance and allow to quickly skim the column on the left for specific changes.
Column and value widths
- The default width of these columns should be rather narrow, but still accommodate typical values easily.
- Avoid that a column with default width already shows a truncated label. Provide thus for the configuration of a short and long column title label. Show the short one by default, the longer one in a tooltip.
Checklists
Attachments
Issue Links
- is related to
-
MGNLGAV-4 Add functionality to compare statistics to previous period
-
- Closed
-
-
MGNLGAV-22 Improve styling of google-analytics columns in pages app
-
- Closed
-
- mentioned in
-
Page Loading...