I want to visualize a value that indicates the amount of deviation a certain resource's value is from its default value. In this specific case, a higher deviation is bad and a low one is good. So in short, I want to visualize the fact that the lower the deviation, the better. I want to visualize the actual value itself as well.

Failed solutions

A number with a value with a color scale going from green to red sounds like a solution, but I cannot tie a scale to absolute specific values. In other words, 0 (zero) might be green, but pure red is not necessarily 100. Next to that, I'd like to stay away from using colors for text that should be read easily anyway. Yellow text (somewhere between green and red in the scale) on top of a white background is terrible in regards to legibility.


How should I tackle this? Are there examples that try to do similar things?

  • What pattern are you using to display the default and changed values? Will they be in a list, a table, a detail screen, or something else? – Izquierdo Feb 21 '20 at 15:10
  • I read that this resource is always numeric. Is that correct? Is it integer, fixed-decimal, or variable-decimal? Are there any constraints on the value (or its default)? – eclarkso Feb 21 '20 at 19:24
  • @StacyH They will be in a dashboard environment. – Kriem Feb 22 '20 at 9:59
  • 1
    @eclarkso It's an absolute value (so always positive, or zero) that reflects the amount of deviation from the mean. It's a measurement. The mean is calculated. – Kriem Feb 24 '20 at 6:51
  • 1
    The major advantage of using s.d. values is that - assuming your measurements are somewhat normally distributed - you know that nearly all of them will be <3 s.d., so you have a limited input domain onto which you can map some sort of visualization/output domain. What that output domain is (colors, font size, bars, whatever) is a distinct problem. It's a bit hard to say much more without additional details on the application and/or data. – eclarkso Feb 25 '20 at 22:10