dashboard design / ixda
TRANSCRIPT
AINO TUOMINENSPEAKER
Business Analytics Consultant @Solitatwitter: @ainotuominen
M.Sc. in Engineering, B.A. in Arts
Working in consulting / analytics and
planning since 2006
Bachelor thesis about dashboards design
process 2014
“The purpose of visualization is insight, not pictures.”Ben Schneiderman, Human-computer interaction lab, U.
of Maryland
CONTENTS
How to Create a Good Dashboard
Data Sources and Tools
What is a Dashboard1
3
2
A DASHBOARDWhat is it, anyway?
Purpose:
to visually display the most essential
and actionable (real time)
information needed to achieve
objectives, on single view so that
the information can be monitored at a
glance.
”The goal is to turn data into information, and information into insight.Carly Fiorina, Former CEO of HP
THE USERPeople Before Features
• Who is your user?
• Why those personas need a dashboard?
• What brings value to the user?
• Where will they access the dashboard?
• When do you need the dashboard?
• How does the dashboard support your
organizational objectives?
YOU MUST HAVE AN INTIMATE
KNOWLEDGE OF YOUR USER TO
DESIGN FOR THEM.
STORY PRESENTATION
Flow of the story from left to right and from up down
(normally). Use visual aids to support the flow.
Flow
1
Present the relationship of the data in a clear way
Relationship
2
Group data meaningfully.
Grouping
3
DATA GRAPHS..
• Use graphs to:• Discern relationships between data series
• Identify patterns, trends and exceptions
• Present large data-amounts
• Choose graph type based on data
• Remove any component that is not
contributing to the message.KEEP IT SIMPLE!
ANSCOMBE’S QUARTET
• All the summary statistics you’d think to compute are close to identical.
• Plot these four data sets on x/y coordinate plane to be able to see the differences.
WHY GRAPHS?Graphs are good to identify patterns, trends and exceptions
http
s://
ww
w.la
bnol
.org
/sof
twar
e/fin
d-ri
ght-
char
t-ty
pe-f
or-y
our-
data
/652
3/
Des
igne
d by
Andr
ew A
bela
On-
line
tool
: htt
p://
labs
.juic
eana
lytic
s.co
m/c
hart
choo
ser/
inde
x.ht
ml
”Overview first, zoom and filter, then details-on-demand.
The visual information-seeking mantra, Ben Schneiderman
DESIGN PROCESS
Presentation Methods
2
What presentation methods are
available in the selected technology
platform?
User / Information Content
1
What information is the user
looking for? What needs does he
have? What data is available?
?Data Scoping Tools
3
What tools are available that the
user can use to restrict the data on
screen
How to Use Color
6
How to use color to highlight the
most relevant information. Use
color for alerts and to guide to
action.
Visual Style
7
What choices should be made for
the visual style? Remember to
consider the brand guidelines. Also,
the visual style should not confuse
or introduce meaningless variety.
aBcdEf
123456
Layout
4
What kind of layout supports the
story in a meaningful order? How to
bring out the most important key
metrics? It’s also good to apply the
golden ratio.
Drill Through
5
How can the user find more context
information for the data by drilling
through?
DESIGN PROCESS
” If the insight aren’t actionable your target audience won’t adopt the dashboard a decision-support instrument.
Lilian Pierson, the author of Data Science for Dummies
FUNCTIONALITYMake a choice what functionality supports your use case
Comparison Alerts Export / Print
Responsiveness Mouse Over Drill Down Filters
Use colors to highlight what is important or to
group what belongs together. Avoid
unnecessary confusing use of different colors.
Careful with colors
Gauges are not very effective. They have no
value to compare with. There are better and
more effective visualizations available than
gauges that also take up less space.
No more gauges
Increase the ratio between data to ink.
Highlight what’s important, leave out all
effects that are just decorative.
Less is more!1
3
2
8 TIPSfor Better Dashboards
Production
Orders
Orders 1,2 k€
1,2 k€
Orders
If you want to compare two series, like targets and
actuals, you can also show and highlight the difference.
Highlight negative values to bring out the anomaly.
Show the difference
The pie chart is very popular but it’s not very effective.
It’s difficult to compare the pie sizes.
No more pies
With a bar chart, always allow the vertical axis to start
at zero (0) to prevent graphs from being wrongly
interpreted.
Start at zero4
6
5
8 TIPSfor Better Dashboards
A horizontal bar is often the best choice
when long labels are used or when you
want to show the hierarchy.
Different angle
Use a neutral dashboard and use highlights to
immediately show what is really important.
Highlight important7
8
8 TIPSfor Better Dashboards
INEFFECTIVE1
The presentation does
not create insight, or the
data does not promote
action.
MEANINGLESS2
The presentation
introduces
meaningless variety
or data.
CONFUSING3
Confusing the user
with poor
presentation.
3 COMMON PITFALLS
Dashboard Design Mistakes
Too many colorspoor readability3D effects
Small fontConfusing color
Lack of graphsSmall fontToo much colorLack of space
1
KEY DATA IN CONTEXT
2
DENSE INFORMATION,
NOT CLUTTERED
3
HIGHLIGHT EXCEPTIONS
4
ZERO LEARNING
CURVE
5
ACCESS TO SUPPORTING
DETAILS
A GOOD DASHBOARDA Good Dashboards is Graphic Oriented and a Single Page
AGILE DESIGN PROCESSApply agile design• Iterate through client testing to improve
usability and relevance
• Observation in real situations with real users is better than just asking questions
• Collect user statistics if possible
• Test, test, test, … All the time if possible
PLATFORMS• In a typical project the data source is
given and often the tools can be from the same vendor.
• You should first evaluate the platform. Understand the basic structure and responsive nature of the platform.
GARTNER
PLATFORMS
Freeboard
Mozaïk
Dashbuilder
Grafana
Stashbord
Pentaho
Birt
Etc, etc…
IBM Cognos Analytics
Tableau
Birst
Microsoft Power BI
Qlik Sense
SAP BusinessObjects Design Studio and Lumira
Google Analytics Solutions
IBM Watson Analytics
Geckoboard
DashThis
HappyMetrix
DataPine
Dash
Kipfolio
TOOLS..
• The concept and a prototype can be created with i.e. Adobe Illustrator + Invision / Adobe XD
• There are Open Source tools for data visualizations like Java script libraries.
• Many companies offer free trial periods, like Power BI, SAP Lumira, Tableau.
..
• Preferably real time data (but sometimes near real time is good enough)
• Data from your: • Cloud application?• Computer or a file sharing
service?• Database?
DATA SOURCES