You are on page 1of 58

The No-Blink Guide To

Designing Dashboards
That Yield Insights

FusionCharts
The No-Blink Guide To

Designing Dashboards
That Yield Insights

by FusionCharts

All rights reserved. No part of this publication text may be


uploaded or posted online without the prior written
permission of the publisher.

For permission requests, write to the publisher,


addressed “Book Content Permission Request” to
marketing@fusioncharts.com
Contents

Chapter One: Understand 05

Begin at the beginning: The data behind information dashboards 06

Dashboards can change how we approach data 08

How the eye reads: the basics, at a glance 11

Chapter Two: Define 14

Begin by asking the right questions 15

Building the value proposition 25

Tailoring visualization to analysis 27

Chapter Three: Ideate 30

3 views for 360° understanding 31

Which chart do you use for each element? 36

FusionCharts
Chapter Four: Create 47

Embrace curiosity 49

Play with the data 49

Add some necessary clutter 49

Clean up inessentials 49

Focus on the outcome 49

Chapter Five: Showcase 50

Here’s a dashboard that got it right 51

About FusionCharts 57

References 58

FusionCharts
CH 01

Understand

Begin at the beginning:


The data behind information dashboards

Dashboards can change how we approach


data

How the eye reads: the basics, at a glance


CH 01 / Understand 06

Begin At The Beginning:


The Data Behind Information Dashboards
INTRODUCTION

I n today’s data-driven world, no decision is a shot in the dark.

Whether you’re making recruitment plans for the next quarter or analyzing
revenues to decide if the product is viable in the long run, the right data will
increase your chances of success.

For instance, a business looking to release a new product gets inspired by a


lot of factors – what competitors are doing, resources available, innovation,
and so on. But unless there is an intelligent survey of what consumers want
and until the data represented in an accurate, useful format, the fate of the
product will hang in the balance.

On a granular level, individuals are also looking at data to inform their


decisions. Imagine a marketing consultant building his personal brand on
Twitter – a commonplace in today’s gig economy – simple elements like the
hashtag used could make a big difference.

The figures agree – global pharmaceutical company Pfizer used the power of
data to cut down decision-making time from weeks or even months to hours
at about 1/10 of the cost.
CH 01 / Understand 07

With the stakes, this high, businesses are investing heavily in ideas that take
raw data and transform them into actionable insights. Information
dashboards work by black boxing critical data, taking what’s relevant and
offering a systematic overview customized according to the user’s needs.

Deployed intelligently, information dashboards can bring this level of


simplicity, clarity, and potential gains to businesses.

Begin At The Beginning:The Data Behind Information Dashboards


CH 01 / Understand 08

Dashboards Can Change


How We Approach Data
THE NEED FOR INFORMATION DASHBOARDS

Data collected from life can be a snapshot of the


world in the same way that a picture catches
small moments in time’’

- Adele Simor
Customer Marketing & Advocacy
Manager at Geckoboard

Information dashboards have two broad benefits – first (and this is


common for any visualization) it takes reams of data and presents it in a
digestible, even attractive format.

Second, a dashboard is dynamic, allowing users to track key metrics and


sending alerts for any deviation. Like the dashboard of your car, information
dashboards help to monitor the vital signs of business, identifying patterns
and exceptions.

In case of an ‘event’ (positive or negative) the user can drill down to the
factors and circumstances around it. If positive, say a surge in sales, she can
then effectively replicate and recreate the scenario. If negative – like high
attrition in HR – she can take measures to prevent the event from recurring.
CH 01 / Understand 09

attrition in HR – she can take measures to prevent the event from recurring.

Here’s why a dashboard is ideal when drawing actionable information from


data:

A single point of access for disparate data:

Instead of opening various applications, interfaces, or online databases, the


user needs only to open the dashboard. A dashboard is internally linked to
multiple relevant data sources and continues to update of any change in real
time.

A broad overview with drill-down capabilities:

A dashboard is a dynamic collection of charts, text, and graphical elements –


and this combination is both vertical as well as horizontal. Charts are stacked
on top of another, allowing users to zero-in on a specific data point and further
inspect it for deeper insights.

Easier, faster comprehension:

An information dashboard takes the best of several worlds – numbers, charts,


text segments, colors, and images – and places them intelligently for quick
consumption and lasting impressions. Research suggests that we remember
30% of what we see, as opposed to just 10% of what we read. A dashboard
takes readable numbers and transforms them into viewable images.

Dashboards Can Change How We Approach Data


CH 01 / Understand 10

Detailed reports, effort-lite with near-zero investment:

Creating reports from a dashboard can be as simple as adding the right data
filters, drilling down to the required layer(s) and taking a static image grab or
hard-copy print of what we see. More robust tools offer separate report
generation capabilities that remove dependencies on IT teams.

Device-agnostic access and interaction:

Responsive is the new buzzword in design, and in a mobile-first world,


dashboards allow users to look at data from any device – a big leap from
processing-heavy spreadsheets and bandwidth-stretching online databases.

Done right, an information dashboard completely changes how data is used in


business ops. From zipped files, hardbound reports, and snippets in corporate
brochures, dashboards can make information part of daily conversations in
the boardroom and on the floor.

Dashboards Can Change How We Approach Data


CH 01 / Understand 11

How The Eye Reads:


The Basics, At a Glance

U nlike text, the visual language is more intrinsic, and a lot subtler – we’re
trained in using the eye to comprehend the world around us since the very
day we’re born, and these rules cut across geographies, ages, and commercial
markets.

Designers must factor in these behavioral ticks, limitations, and capabilities


when creating information dashboards.

For instance, while le!-right/top-down movement is the standard for any


graphics (posters, comics, letters, and the rest) cleverly designed elements
can circumvent this – when the visual takes center stage, data points, texts,
and other contextual cues catch the eye later.

Regular text is marked by exactly that – regularity. A book doesn’t employ


multiple fonts, colors, and text sizes on the same page, but visualizations turn
this on its head. The user will first look for patterns and exceptions, with
unique colors, steep curves, clusters, or outliers pointing the way.
CH 01 / Understand 12

Spotting exceptions and patterns in data

Rationality defines the human mind; as a result, the user will try and assign
meaning to every element they see. In case the difference in color is simply
ornamental rather than indicative, she could end up building a false narrative
around the same.

There’s also inescapable constraints, concerning cognitive capabilities and


cultural conventions. Instead of trying to subvert them, intelligent designers
harness them to their advantage.

The more data you show, the more probable it is that the user will blend it all
into one large aggregate – diluting focus and impact.

How the Eye Reads: The Basics, At a Glance


CH 01 / Understand 13

Dashboards - the bad (le!) and the good (right)

Simply put, we can only see a few things at once, and data should be selective
and segmented to boost understanding.

And underneath all this, lies a bedrock of visual conventions and metaphors,
like red suggests warning signs, or that time moves from le! to the right.

The next chapter delves deeper into this aspect of visualization, and the
psychological principles driving our perception of surroundings.

How the Eye Reads: The Basics, At a Glance


CH 02

Define

Begin by asking the right questions

Building the value proposition

Tailoring visualization to
analytics
CH 02 / Define 15

Begin By Asking The Right Questions

F irst, let’s get a popular myth out of the way. Many believe that creating a
dashboard is a complicated, confusing process, but it needn’t be. Even the
most complex information dashboards are inspired by a single idea, a simple
point of origin – what is the user trying to achieve?

Is the user trying to just monitor Key Performance Indicators (KPIs) across
the organization over an indefinite period?

Or is the user looking at highlights and standout events from a specific


period, trying to identify the cause of an already clear observation?

Or maybe, the user is looking for trends to enable strategic decision-making?

Based on answers to above questions, you define your dashboard and plan
the design. Great design is essential for successful dashboard projects
because unless the interface is smart, intuitive, and user- friendly, the data
becomes incomprehensible and the insights - lost.
CH 02 / Define 16

The common approach is actually nothing more


than blindly throwing technology at the problem,
sometimes without spending enough time framing
the question that triggered the exploration in the
first place.’’
- Giorgia Lupi
Co-author of Dear Data

Data is the new oil of the 21st century, and like oil, it’s next to useless unless
filtered, refined, and packaged perfectly. The following 3 parameter helps
you take business data, and translate them into a consumable ‘information
gallery’.

1. Who is the user and what kind of dashboard does the


user expect/need?

Based on the user persona and her functional role, dashboards can be broadly
classified into three types:

Operational Dashboards

Used primarily by department heads, functional leaders, and the like, these
interfaces are marked by their hyper real-time changeability. Basically, they tell
the user what’s happening right now and allow managers to maintain

Begin By Asking The Right Questions


CH 02 / Define 17

performance levels above a certain preset benchmark.

These are viewed multiple times a day, o!en mapping progress towards a
target, and must be data heavy while showing all changes.

Analytical dashboards

These are used mainly by data scientists and BI professionals, users with high
levels of technical proficiency who also demand deep drill-down capabilities.
Unlike the other two types, insights are o!en embedded beneath several
visualization stacks.

Large volumes of data are scanned to investigate trends and predict outcomes –
that’s why the data needs to be accurate and up to date, though not at the same
Begin
frequency as operational dashboards. In fact, given By Askingupdates
the volume, The Right Questions
must be
planned and periodic.
CH 02 / Define 18

Large volumes of data are scanned to investigate trends and predict outcomes
– that’s why the data needs to be accurate and up to date, though not at the
same frequency as operational dashboards. In fact, given the volume, updates
must be planned and periodic.

Begin By Asking The Right Questions


CH 02 / Define 19

Strategic dashboards

These depend the most on visuals and offer a top-down view of important KPIs.
Strategic dashboards are typically geared for upper management and C-level
executives. They could even be built on department-specific operational
dashboards, drawing relevant data to create a performance snapshot.

Strategic dashboards can be a powerful reporting tool, keeping managers on top


of daily (or monthly, or annual) performance using simple, impactful data
visualizations.

Begin By Asking The Right Questions


CH 02 / Define 20

Strategic dashboards can be a powerful reporting tool, keeping managers on


top of daily (or monthly, or annual) performance using simple, impactful data
visualizations.

2. What metrics will you add to the dashboard and when?

Once the user persona is identified, the metrics required also start becoming
clear.

Any business will generate huge amounts of data in several fields and
verticals – for HR; this could mean employee satisfaction scores, number of
new hires in a month, and so on. For admin, on the other hand, it’d include
parameters like third-party provider details and pantry expenses.

When you phrase the question as ‘X will use the dashboard for Y,’ it becomes
simpler to zero-in on the metrics required.

Let’s carry on with the HR example – if the HR Lead is using the dashboard to
reduce attrition, then your dashboard should include historical attrition data,
employee satisfaction scores, top complaints in the workplace, leadership
details, and information in this area. New hires, in that case, would not be
relevant.

Begin By Asking The Right Questions


CH 02 / Define 21

If every metric you add is going to cost you a


hundred bucks, which ones would you put up?’’

- Alejandro Perez
CEO , Komet Sales

These metrics must also be actionable. Should you highlight the top
numbers? Should the values be converted to percentage? Should you show
absolute values, or should you show the difference from the mean, or from
zero?

A smart information dashboard is one that’s designed a"er these questions


are answered, a"er taking the user’s unique scenario into account.

Another nuance that’s unique to information dashboards vs. regular


visualizations is that you can hardwire notification systems directly into the
interface. A medical information dashboard will alert users before vitals fall to
critical levels, just as the literal dashboard of a car warns you before the tank
is empty.

At these levels, the metrics become more actionable than ever before.

It’s essential to spot these data events and build your dashboard around it.
Having a two-way dialogue with users on which numbers would make their
decisions easier and then mapping secondary causes is a good start. And
once numbers begin to hit exceptional highs, terrible lows, or the targeted
‘sweet spot,’ alerts (notifications, or even visual cues) must let the user know.

Begin By Asking The Right Questions


CH 02 / Define 22

3. How do you show the metrics – and text, and pictures,


and everything else?

You have identified the user and selected the data to be portrayed – now
comes the all-important question of how the data will be arranged. This
depends in part on your personal design aesthetic, brand design guidelines if
applicable, and the data itself.

All dashboards tell a story and the top le! corner of the layout is the starting
line. This can be used to show the most impressive number, the primary factor
influencing the insight, or even a piece of text that ties all the metrics together.
The eye moves in le!-right/top-bottom directions – a truly glanceable
dashboard will factor this in while arranging the panels.

The Motley Fool’s Chief Product Officer, Max Keeler’s advice


on keeping it simple: “Don’t necessarily start with the most
important thing, don’t try to find the perfect metric. Think
about what gives you an emotional reaction, and it starts to
get fun that way. Once it’s fun, it just starts rolling.’’

With the arrangement in place, a basic understanding of how visual


perception works can take the dashboard to the next level. Called Gestalt
Principles, these rules underscore human cognition of visual data:

Begin By Asking The Right Questions


CH 02 / Define 23

Similarity

Elements that look nearly the same (let’s say,


four pie charts of the same size, using the same
two colors) are seen as one unit. If the next pie
chart uses a different color combination, the
user will automatically hunt for a reason.

Continuation

Cues like lines, connectors, or color gradients


can compel the eye to go from one element
straight to another.

Closure

Elements partially enclosed are understood to


be completely separate – dashboards should use
borders and margins wisely, without impeding
flow or the possibility to notice trends.

Proximity

Elements clustered together are assumed


related; conversely, adding more negative space
between two elements suggest a difference.

Begin By Asking The Right Questions


CH 02 / Define 24

Figure & ground

Less relevant to dashboard creators than the other


four, this rule says the eye will look for a clear object-
background relationship. Google’s material design,
for instance, uses the figure & ground principle to
ensure their interfaces are clean, crisp, and easy on
cognitive load.

An information dashboard that’s attractive has good design-focused now


must perform in practice, for which it needs analytical features. This may be
limited to drill-down capabilities and tooltips to add context, or it can extend
to interactivity, filters and manipulation, and export support.

Begin By Asking The Right Questions


CH 02 / Define 25

Building The Value Proposition

C reating information dashboards takes time, effort, and – depending on


the use case – significant investments. And like with most projects,
businesses are continually looking to maximize the power of tech and
generate ROI.

Don’t expect people to start using a dashboard just


because you made it all pretty and put it up on the wall’’

- Adele Simor
Customer Marketing & Advocacy Manager
Geckoboard

Like all technologies, information dashboards have a dual value proposition


– it eliminates, and creates.

Should it first eliminate reporting efforts, manual dependencies, or KPI


monitoring anxiety?

Should it first create validation for existing practices, opportunities for


improvement, or a signaling system for things going awry?
CH 02 / Define 26

A!er defining the dashboard requirements, and planning the project, all
stakeholders must be clear on its real value proposition. A dashboard for
monitoring employee productivity at a manufacturing unit, for example, isn’t
tailored for revenue analysis and has a very different value proposition.

Here are a few high-level objectives dashboards can help meet –


focusing on any 3 will keep the project on track, and effective:

Inform the general workforce about key business differentiators

Set goals for a specific individual or team

Act as an interface used across the company for interacting with data

Monitor operations and ensure smooth business-as-usual for executives

Trigger alerts in case of anomalies and disruptions

Aid CxOs in locating areas that need attention

Put yourself in the end user’s shoes so you can build it for them.
I’m totally open to evolving the dashboards so they show more
of what people want to see’’

- Alexandra Mangold
Senior Director of Business Operations & Analytics
at Drone-as-a-Service company, Measure

Building The Value Proposition


CH 02 / Define 27

Tailoring Visualization To Analysis

D oes your dashboard focus more on visualization, than on the data?

This age-old question plagues developers across generations – unlike


pureplay designers, they can’t forego any information in a bid to make the
interface more attractive. And unlike data scientists, sacrificing aesthetics at
the altar of accuracy isn’t an option either.

The data vs. visuals war is subjective; however, a good dashboard must
always encourage and facilitate easy analysis.

Here are the 4 broad steps that comprise the data to insight flowchart:
CH 02 / Define 28

The user defines the


problem.

The user creates a set of loosely


defined questions around the
problem, and locates the relevant
data.

The computer remodels the data


in line with the question asked,
and maps it as a visualization

The user observes the data


and reframes her question
accordingly.

The Path From Data To Insights

Tailoring Visualization to Analysis


CH 02 / Define 29

Note that the user is responsible for most of these moves, with the
technology working only as an enabler. As a result, dashboards need to be
equipped with a complete set of manipulation tools to support visualizations,
and graphical elements must hinge on the data it represents. This could
involve some difficult questions:

Does the user have to know coding to get the most out of your dashboard?

Are you using graphs and diagrams, when a simple table would suffice?

Can the user trust what she sees to be a faithful and accurate depiction of reality?

Are the results of data manipulation intelligible, or does it need technical


knowledge to find patterns?

Each answer will add a little more work to your dashboard project, and take
the final result a little closer to perfection.

Designing dashboards require a unique mix of design sense, UX skills, and


data understanding. Invariably, it is an iterative process where each step
requires testing and carefully thought a"er refinement.

Tailoring Visualization to Analysis


CH 03

Ideate

3 views for 360° understanding

Which chart do you choose for each


element?
CH 03 / Ideate 31

3 views for 360° understanding

F rom the layman's vantage point, the dashboard is not a collection of huge
data streams – at first glance, it’s not even a dynamic display of constantly
changing metrics.

As users spend more time using the dashboard, their perspective evolves.

Dashboard users go through 3 stages of discovery – its first perceived as a static


snapshot, then it emerges as a robust information pool, and finally, it’s
harnessed as a tool for deep analysis. Accordingly, dashboards should be
designed for three views, each giving a complete picture while also adding to
the layer just above it.
CH 03 / Ideate 32

Summary View

This is a must for any dashboard – mainly for casual


monitoring or as part of strategic presentations, these
are heavy on images and UI elements.

Multi-dimensional view

This allows users to explore data from several


dimensions, with high interactivity, data indicators,
and mid-level BI features – depending on the
dashboard type, operational, analytical, or strategic,
this layer may or may not be included.

Detail Reporting View

This lets the user go through the data with a fine-tooth


comb, using BI tools to scan information that’s linked
to dynamic sources or data warehouses – the main
purpose, here, is to log reports or query results.

3 views for 360° understanding


CH 03 / Ideate 33

Summarized view

You could also call this a visual summary – entirely focused on performance
metrics, it has all the bells and whistles needed to keep the user’s eye on the
ball.

Some scorecards show critical numbers, gauges to monitor change in real


time, and event-based alerts and notifications. When the numbers witness
anomalies or deviate from the acceptable range, the user is informed of the
exception. This can be via on-screen pop-ups, emails, or other channels.

We started introducing the dashboards into weekly team and


individual meetings. Teams and individuals began to
understand that these are your daily activity goals and how
what you do individually connects to the greater whole.’’

- Summarized views made all the difference for Mangold

This is the face of your dashboard that experiences heavy usage and frequent
interactions – it’s important to keep the UX smooth and glitch-free.

3 views for 360° understanding


CH 03 / Ideate 34

Multi-dimensional view:

Revealing all the data behind the output, this layer has filters, navigation
features, drill-down capabilities, and more.

Dimensional parameters – geography, or time – and hierarchies like country,


state, and city, lets users ‘slice and dice’ the data, allowing them to view trends
and spot exceptions from their chosen perspectives. It means, unlike
summaries, there’s no ‘normal’ built into the system – allowing the user
greater flexibility and larger strategic space.

‘What-if’ analyses, remapping as a different visualization, and complex


calculations are among the possibilities here. However, it’s assumed that the
user has greater technical proficiency, a deeper understanding of the data at
hand, and also, more time than when accessing summaries.

Detailed view:

Less a dashboard and more a reporting platform, this lets users directly
connect with the data source. Information appears in the form of intricate
tables and records – covering numbers-heavy aspects, like transactions,
invoices, attendance, and the like.

The USP of this layer is that it’s o"en the only way to locate the cause of a
problem, so minute that regular visualizations struggle to flag it.

3 views for 360° understanding


CH 03 / Ideate 35

The user can then print or save the final report or query outcome, usually
displayed in a new window for clarity.

“Performance dashboards, with their layers of information, meet the long-


standing mantra of casual users: give me all the data I want, but only what I
really need, and only when I really need it,” says Wayne Eckerson, author, and
BI aficionado.

Keep these three layers – and the three approaches that go with it – in mind,
when conceptualizing your dashboard. The end product will be one that not
only meets staple requirements but goes one step further to really wow the
user.

3 views for 360° understanding


CH 03 / Ideate 36

Which Chart Do You Use For Each Element?

T he first and generally the most befuddling question for implementation.


You have your datasets laid out, you have a wireframe in place that perfectly
maps user eye movements to information priorities, and you’ve even zeroed
in on the thematic direction for your project.

Now is that time when you assign each element a visual identity, and there
are several ways to go about it. Here are a few best practices to help you get
started:

Showing comparisons

Charts used for comparative analyses – year on year growth or department-


wise performance, for instance – have to highlight similarities and
differences. Some chart types, like pies and scatter charts, confuse the eye
with too much data, too little space, and limited time to take it all in.

Columns and bars might be old-school, but are generally recommended for
comparative dashboards, especially when plotting one measure. For
multiple measures, like plotting department-wise revenues on a year-on-
year basis, consider line charts.
CH 03 / Ideate 37

VARIABLE WIDTH
TWO VARIABLES PER ITEM

CHART
EMBEDED CHART
TABLE WITH
AMONG ITEMS MANY CATEGORIES

HORIZONTAL
BAR CHART
ONE VARIABLE
PER ITEM

FEW
CATEGORIES

BAR VERTICAL
CHART
COMPARISONS

AREA CHART
CIRCULAR
CYCLICAL
DATA

MANY
PERIODS
LINE CHART

NON CYCLICAL
DATA

OVER TIME
VERTICAL BAR

SINGLE
CHART

OR FEW
CATEGORIES
FEW PERIODS
LINE CHART

MANY
CATEGORIES

Which Chart Do You Use For Each Element?


CH 03 / Ideate 38

Line charts are simple and easy on the eye – using just one shape and relying
only on color variations minimizes the cognitive overload and makes it easier
to spot upticks/downswings.

And with enough space, you could even add gridlines to the mix.

Showing compositions

Pie charts are the go-to option for all things composition – but it isn’t always
the best choice. If the whole comprises over five elements, or if the
composition numbers are on the lines of 37%, 32%, and 31%, the real data
could get lost in translation.

The difference in values is imperceptible (Pie Chart)

Which Chart Do You Use For Each Element?


CH 03 / Ideate 39

Here, you could use a stacked bar chart instead. Even with five different
components, this makes excellent use of space and helps the user spot vital
elements of the whole.

Visualizing Part to a Whole Data using Stacked Bar Chart

Another interesting, but less used option is the waterfall chart – this smartly
shows how an increase or decrease in value, contributed to the total amount.

Change in Initial Value by a series of Intermediate Values, leading to a Final Value (Waterfall Chart without data values)

Which Chart Do You Use For Each Element?


CH 03 / Ideate 40

Here, a pain point is that the human eye automatically assumes that the top
limit shows the final value. The downward or ‘waterfall’-like movement of the
columns might not immediately register. That's why showing data values in a
waterfall chart is a must-have.

Change in Initial Value by a series of Intermediate Values, leading to a Final Value (Waterfall Chart with data values)

There are no foolproof guidelines guaranteed to make dashboards shine –


when depicting how different parts make a whole, focus on what’s essential
and consider texts to fill in the gap.

Which Chart Do You Use For Each Element?


CH 03 / Ideate 41

Pie Chart
Simple share
of total

Waterfall Chart
Accumulaton
Static
or substraction
of total

Subcomponents
Bar Chart with
Stacked 100%
Components of
components

Tree Map
Accumulation
to total &
COMPOSITIONS absolute diff.
matters

Stacked 100%
Bar Chart
Only relative
differences
matter

Bar Chart
Stacked
Relative &
absolute
differences
Changing over matter
time
Stacked area
100% Chart

Only relative
differences
matter
Many
Stacked area

periods
Relative &
Chart

absolute
differences
matter

Which Chart Do You Use for Each Element?


CH 03 / Ideate 42

Showing distributions

Graphics that show how an element is distributed – think Netflix viewers,


plotted across age demographics – have to compress large data sets into
digestible chunks. It’s ideal to keep it as simple as possible: Netflix viewers
distributed across age groups is ideal for a scatter chart.

You could also show Netflix viewers segmented by gender and distributed by
age group – a slightly more complex, but still a possible ask or distribution of
IMDB ratings plotted against the number of ratings for TV show or movies.

Visualizing distribution of numerous data points using Scatter Plot

Due to the large dataset, a user might struggle to comprehend trends or


uncover insights. So, a filter that lets users compare the selected TV shows
against each other while the rest are hidden is a smart approach.

Which Chart Do You Use For Each Element?


CH 03 / Ideate 43

Two

Bar Histogram
Variables

Line Histogram
DISTRIBUTIONS

Few Data
points

Single
Variable

Scatter plot
Many Data
points

Molding your visualization to the scenario at hand is essential.

Just like this workaround, visualization is an exciting, dynamic process – begin


at best practices, and end in purposeful innovation.

Which Chart Do You Use For Each Element?


CH 03 / Ideate 44

Showing relationships

With relationship-centric charts, we are in somewhat of a grey area – a!er all,


all charts try to trace associations and it could be argued that composition,
distribution, and comparison are all relationships of some kind.

What these charts do, then, is that they combine many relationships to provide
an overarching data. So expectedly, a blend of multiple chart types is o!en
deployed – take a cartogram, for example. It superimposes bubble charts on
traditional maps, to create a visualization that shows geographic distribution
as well as volume compositions.

On the other hand, scatter charts could also help highlight the absence of any
relationship at all.

Just like this workaround, visualization is an exciting, dynamic process – begin


at best practices, and end in purposeful innovation.

What’s needed is to take a broad, unbiased approach, and try and test until you
arrive at a visualization that adds clarity to the data that’s already there.

Chart selection has got the industry polarized – on one hand, are theorists, BI
experts, and domain veterans who believe a one-size-fits-all approach spells

Which Chart Do You Use For Each Element?


CH 03 / Ideate 45

Two
variables

Scatter Plot
RELATIONSHIPS

Scatter Plot
Bubble Size
Three or
more variables

disaster for information dashboards. On the other hand, those new to the
visualization game o!en have little to go on, in a terrain that’s rapidly evolving.

Using these suggestions as the baseline, complementing them with research,


and in the end, doing what makes sense for the data, is a good balance.

Which Chart Do You Use For Each Element?


CH 03 / Ideate 46

I sit down with people so they can let me know what metrics
they want on their dashboard and how they want it presented.
This allows the new users to focus on getting the data they want
onto their very first dashboard without having to worry about
the practicalities.’

- Perez
Komet Sales CEO

Which Chart Do You Use For Each Element?


CH 04

Create

Embrace curiosity

Play with the data

Add some necessary clutter

Clean up inessentials

Focus on the outcome


CH 04 / Create 48

5 Stepping Stones To a Great


Information Dashboard

I nspired by theory and compelled by the need to become data-driven,


companies are increasingly investing in information solutions – a move that
can lead to up to 50% more revenues, according to the Dell Global
Technology Index. The onus, therefore, is on BI teams and developers to
build tools that perform.

The dashboard creation process spans 5 stages and once development


commences, it’s essential to know where exactly you stand.
CH 04 / Create 49

1 Embrace Curosity: Identifying the need to become data-driven is step #1, and this is
not a simple assumption. In this phase, all gaps in existing data
need to be located, relevant sources are determined, and you
bring it all together into an initial data dump'. The guiding
principle, In this case, is curiosity - you are exploring available
resources for more.

2 Play with Data: The first - and mostly rough - dra! has been created. This
dashboard will see several iterations but offers an excellent
platform for dry runs, beta users, and anyone who might assist in
ironing out the chinks. The precise tools required for optimum
performance hasn't yet been identified, and the stage involved
more play than work.

Add some Now the dashboard (v2) is shared with a larger audience, which
3
necessary Clutter: might include colleagues and select members of the
organization. Their inputs are incorporated into the dashboard,
ensuring the tool fulfills end-user expectations. It is at this stage
that the most important metrics begin to emerge, beyond on-
paper discussions.

4 Clean up essentials: A highly collaborative stage, conversations with peers, users, and
stakeholders can help trim down the elements that's been
assembled till this point. The product - version #4 - should be
simple, problem-specific, objective, and ripe for insight
generation.

5 Focus on the outcome: Add the final set of features and plug-ins that helps maxmize the
data in place. With real business goals in place and accurate
demarcation of user groups, this stage helps narrow down
applications, and ensures your information dashboard isn't
generic. The output - information dashboard v5 - is user-driven
and geared for real-world decision making.

5 Stepping Stones To a Great Information Dashboard


CH 05

Showcase

Here’s a dashboard that got it right


CH 05 / Showcase 51

Here’s a Dashboard That Got It Right

A truly effective dashboard will not try to tick all the boxes but will know
exactly which boxes to tick.

FusionCharts offers a set of dashboards that look dissimilar – even wildly


different – from each other. Some are a complex mix of vectors, icons,
numbers, and texts, focusing on the visuals rather than the parent data.
Other lay it out simply and smartly, using a minimalist element like tables
and limited color palettes, to make a point.

No matter which route you take, what’s important is that visualization is


aligned to the user’s needs.

Take, for instance, the FusionCharts dashboard [snapshot on next page],


plotting health expenditure data as collected by the World Health
Organization, from 1995 to 2012. With a clean, easy to use interface, the
visuals focus on the basics. Instead of trying to pile all the data into one
snapshot, it segments information by a host of parameters.

Dashboards such as this can process surprising data volumes – here, 17


years’ worth data from all major countries is smartly packed into a single-
screen view.
CH 05 / Showcase 52

Here are 3 best practices the application follows:

Highlights at a glance

The first things that catches the user’s eye are the 5 metrics on top – the top 5
spenders in the most recent year.

This can offer some interesting insights, like the US, arguably the most
developed nation in the world, sits side by side with Monaco and Norway –
smaller and economically less robust regions.

Also, 4 among the top 5 spenders are from Europe.

Here’s a Dashboard That Got It Right


CH 05 / Showcase 53

An overarching element like this can quickly give the user a broad picture of
what the data means. Now, for instance, the user could deep-dive into African
and Asian countries in a bid to uncover spend patterns there. Or the user might
attempt to discover trace how Europe’s focus on healthcare spend has
evolved.

On the visual side of things, the dashboard keeps it pretty simple – no colors
have been used, and the numbers are highlighted instead of the country
names, clearly directing the eye.

Note the use of closure – each amount is followed by a separating line that
helps establish difference.

Clearly defined filters

The dashboard comes with four simple parameters on the le": one measure*
(the first question which determines which values to depict), two dimensions*
(region and time), and one hierarchy (country).

The fact that numbers need not be country-specific, is also mentioned.

The user knows exactly what to do to view the dataset she requires. Want to
know where US citizens’ personal health care spend stands, as compared to
the US governments?

*Dimensions are attributes of data and Measures are quantitative values

Here’s a Dashboard That Got It Right


CH 05 / Showcase 54

Metrics pertaining to US Government spend

Metrics pertaining to US citizen spend

Having the right filters makes such analyses easy, even for lay users.

Here’s a Dashboard That Got It Right


CH 05 / Showcase 55

Tooltips and Gridlines to minimize errors

2500

2000
29th Jan
value: 1836

1500

1000

500

9Jan 12Jan 15Jan 18Jan 21Jan 24Jan 27Jan 30Jan 2Feb 5Feb 8Feb 11Feb 14Feb

For dashboards condensing reams of data into digestible chunks, it’s crucial
that markers and separators are not lost. This means, aggregated insights
over 2 or 3 years shouldn’t meld into a single time unit – without each year
shown individually, you run the risk of users overlooking the distinction.

On the other hand, if you were to have a ticker for each year, the Y axis would
be severely cluttered.

Tooltips appear when the user hovers on a point on the line chart indicated
by circles, and shows the region name, country, and the values according to
the first parameter on the chart.

Gridlines are even more crucial for line charts, as there are no horizontal
markers across the image (for bars and columns, the rectangular shape itself

Here’s a Dashboard That Got It Right


CH 05 / Showcase 56

markers across the image (for bars and columns, the rectangular shape itself
suffices). The chances that the eye can retain the exact location of 7%, 14% or
21% as it travels from le" to right, are very slim.

You could even add vertical gridlines, but again, this could add to the noise.
The tooltips plus gridlines combination is an intelligent answer.

Here’s a Dashboard That Got It Right


CH 05 / Showcase 55

About FusionCharts

FusionCharts is a JavaScript charting library for your web and enterprise


applications, used by over 27,000 companies and 750,000+ developers
worldwide. It includes over 90 charts & 1000+ maps that transform all your
data into interactive and meaningful dashboards.

Learn more about how you can add delight to your products at
www.fusioncharts.com
58

References

https://www.slideshare.net/geckoboard/why-dashboards-fail

http://graphicdesign.spokanefalls.edu/tutorials/process/gestaltprinciples/gestaltprinc.htm

https://files.eric.ed.gov/fulltext/EJ1079541.pdf

https://www.fusioncharts.com/dashboards/twitter/

https://blogs.cisco.com/datacenter/data-driven-decision-making-at-pfizer-a-case-study-in-data-

virtualization

Performance Dashboards: Measuring, Monitoring, and Managing Your Business By Wayne W. Eckerson

http://www.liesdamnedlies.com/2006/09/are_dashboards_.html

https://www.fusioncharts.com/blog/10-dashboard-design-mistakes/

https://www.isixsigma.com/methodology/metrics/build-a-visual-dashboard-in-10-steps/

https://medium.com/@_dmusic/value-from-dashboards-the-real-story-921b772a8d1e

https://www.fusioncharts.com/charting-best-practices/conceptualizing-business-dashboard/

http://www.liesdamnedlies.com/2006/09/are_dashboards_.html

https://www.fusioncharts.com/blog/10-dashboard-design-mistakes/

https://www.isixsigma.com/methodology/metrics/build-a-visual-dashboard-in-10-steps/

https://medium.com/@_dmusic/value-from-dashboards-the-real-story-921b772a8d1e

https://www.fusioncharts.com/charting-best-practices/conceptualizing-business-dashboard/

http://www.aptude.com/blog/entry/defining-personas-for-business-intelligence-dashboards

https://www.kaushik.net/avinash/digital-dashboards-strategic-tactical-best-practices-tips-examples/

https://www.nextadvisor.com/blog/2017/09/22/we-signed-up-for-equifaxs-trustedid-premier-and-

heres-what-happened/

Good Charts: The HBR Guide to Making Smarter, More Persuasive Data Visualizations - by Scott Berinato

http://www.perceptualedge.com/blog/wp-content/uploads/2015/07/Abelas-Chart-Selection-

Diagram.jpg

You might also like