Continuing from the previous post on same topic, which can be found here.
Plain and simple layouts without much visual elements are the first steps taken while designing an UI. Once the KPI and type of data it represents is finalized, the visualization type can be chosen. Whenever data is represented in visual terms, special attention should be paid to “inference” by end users.
Style #2. Against Benchmark – Progress
Benchmarks come in different flavors and some popular examples are Budget, Target, Forecast, Previous Time Period and Others. The terms described above might look like synonyms at the outset, but there are minute differences on how each are inferred.
If the user has to be informed on the progress of the KPI, the following layouts can be used. The inherent messages these types of UI present to users are “percentage completed” or “percentage left to complete”. This is true even if absolute numbers are displayed explicitly in the boundary area.
One drawback of this style happens when the actual value exceeds the benchmark and there is no room in the visualization to show this scenario.
Style #3: Against Benchmark – Actual Values
This is tied to the previous item discussed, but all values here are displayed explicitly. The visualizations here do not communicate in percentage terms the variance between actual and benchmark values, instead provide a visual cue to the user. Designers have the liberty to include variance as another KPI along with this visualization if required.
The drawback of actual values crossing benchmark values as mentioned in previous style is eliminated in this case. We now have liberty to have a single KPI pitted against multiple benchmarks within the same visualization so that user’s attention can be focused in a small area for all related information.
Single value KPI’s with benchmarks and variances are the de facto standard in the landing page of any infographic or dashboard.