These are the slides from Andy Kirk's webinar 'Data Visualisation - A Game of Decisions'. In the webinar Andy argues that the essence of effective data visualisation design is good decision-making. It is about knowing your options and understanding how to make your choices. By deconstructing the decisions demonstrated through case study examples, Andy illustrates the many little elements that make up the design anatomy of any data visualisation work. The aim of this session is to try demystify the challenges of developing capabilities in this area. Watch the webinar: https://www.youtube.com/watch?v=GVkXbQOzKNs&feature=youtu.be

1. DATA VISUALISATION
A GAME OF DECISIONS
Andy Kirk
andy@visualisingdata.com
www.visualisingdata.com
@visualisingdata

2. 2
The visual representation and presentation
of data to facilitate understanding
What is data visualisation?

3. 3
Why facilitate and not deliver?
Perceiving Interpreting Comprehending
What does it mean?
Is it good or bad?
Meaningful or insignificant?
Unusual or expected?
What does it show?
What’s plotted?
How do things compare?
What relationships exist?
What does it mean to me?
What are the main messages?
What have I learnt?
Any actions to take?
CREATOR CONSUMER

4. 4
The importance of critical thinking to improve visual sophistication

5. 5
The importance of critical thinking to improve visual sophistication

6. 6
The importance of critical thinking to improve visual sophistication

7. 7
To make the best decisions you need to be familiar with all your
options and aware of the things that will influence your choices.
A game of decisions
THINGS YOU
COULD DO
THINGS YOU
WILL DO
“IT DEPENDS”

8. 8
Design workflow: Effective decisions, efficiently made
Stage 1
Formulating
your brief
Stage 2
Working
with data
Stage 3
Establishing your
editorial thinking
Stage 4
Developing your
design solution

9. 9
Design workflow: Effective decisions, efficiently made
Stage 1
Formulating
your brief
Stage 2
Working
with data
Stage 3
Establishing your
editorial thinking
Stage 4
Developing your
design solution
What’s the curiosity? What are the conditions? What’s the purpose?

10. 10Visualisation from http://filmographics.visualisingdata.com/
“What is the pattern of success or failure in the
movie careers of a range of notable actors/directors?”
What’s the curiosity? “An eagerness to understand something”

11. 11
What are the conditions? The factors and requirements

12. 12
What are the conditions? The factors and requirements
http://chartmaker.visualisingdata.com/

13. 13
What’s the purpose? How will understanding be facilitated?
https://www.bbc.co.uk/weather
Explanatory Exploratory
Exhibitory

14. 14
Design workflow: Effective decisions, efficiently made
Stage 1
Formulating
your brief
Stage 3
Establishing your
editorial thinking
Stage 4
Developing your
design solution
Stage 2
Working
with data
Data acquisition, examination, transformation, and exploration

15. 15
HEADING
SUMMARY
STATS
CREDITS
LOGO
63 matches =
8 x 8 grid
Working with data: Understanding its properties and qualities

16. 16
Working with data: Understanding its properties and qualities

17. 17
Working with data: Understanding its properties and qualities
Qualitative (Textual)
Bolt quote: “It wasn't perfect today, but I got it done
and I’m pretty proud of what I've achieved.
Nobody else has done it or even attempted it”
Categorical (Nominal) The athletics event: Men's 100m
Categorical (Ordinal) The medal category: Gold
Quantitative (Interval)
The estimated temperature at track level
during the Men's 100m: 28℃
Quantitative (Ratio) Usain Bolt’s winning time: 9.81 seconds

18. 18
Working with data: Understanding its properties and qualities

19. 19
Working with data: Understanding its properties and qualities
WHO?
WHAT?
HOW
MUCH?

20. 20
Design workflow: Effective decisions, efficiently made
Stage 1
Formulating
your brief
Stage 4
Developing your
design solution
Stage 2
Working
with data
Stage 3
Establishing your
editorial thinking
What questions are you trying to answer in support of the overriding curiosity?

21. 21
Editorial: Which angle(s) of analysis are relevant/interesting?
How good was my run?
What distance did I run?
What time/pace did I run it in?
What were my main achievements?
What was the route elevation?
What were my 1km splits?

22. 22
Editorial: Which angle(s) of analysis are relevant/interesting?
How good was my run?

23. 23
Editorial: How will you frame your data (include vs. exclude)?

24. 24
Design workflow: Effective decisions, efficiently made
Stage 1
Formulating
your brief
Stage 2
Working
with data
Stage 3
Establishing your
editorial thinking
Stage 4
Developing your
design solution
Making data representation, interactivity, annotation, colour, and composition choices

25. 25
Data representation: A recipe of marks and attributes
Shape
Line
Form
Point
Size
Position
Angle
Pattern
Quantity Containment
Connection
Symbol
Colour
Visual placeholders to
represent data items
Visual properties to represent
data values
Direction

26. 26
Data representation: A recipe of marks and attributes
Size
Colour
Line

27. 27
Data representation: A recipe of marks and attributes
Shape
Colour
Size

28. 28
Data representation: How to show what you want to say?
CATEGORICAL
Comparing categories and
distributions of quantitative values
TEMPORAL
Showing trends and activities
over time
HIERARCHICAL
Charting part-to-whole relationships
and hierarchies
SPATIAL
Mapping spatial patterns through
overlays and distortions
RELATIONAL
Graphing relationships to explore
correlations and connections

29. 29
Data representation: How to show what you want to say?

30. 30
Interactivity: Controlling what and how your data is presented
Visualisation from http://www.visualisingdata.com/olympics2016/

31. 31
Annotation: Judging the right level of assistance
Visualisation from http://www.visualisingdata.com/2016/05/boom-bust-shape-roller-coaster-season/

32. 32
Annotation: Judging the right level of assistance
Illustration by Martin Handford https://www.amazon.com/Wheres-Waldo-Martin-Handford/dp/0763634980/ref=sr_1_5?ie=UTF8&qid=1306352231&sr=8-5
THERE’S
WALLY

33. 33
Annotation: Judging the right level of assistance

34. 34
Colour: Colouring all your chart and project contents
Visualisation from http://filmographics.visualisingdata.com/

35. 35
Colour: Colouring all your chart and project contents
Visualisation by FinViz https://finviz.com/map.ashx?t=sec&st=w1

36. 36
Colour: Colouring all your chart and project contents
Visualisation by FinViz https://finviz.com/map.ashx?t=sec&st=w1
Colour blindness
simulator
colororacle.org

37. 37
Composition: Making layout, sizing and positioning decisions

38. 38
BAR CHART UNIVARIATE BUBBLE PLOT
BUBBLE PLOT
SLOPE GRAPH
MATRIX CHART
Composition: Making layout, sizing and positioning decisions
TITLE
ABOUT THE DATA
HEADLINES
ABOUT THE SUBJECT
SECTIONS & COMMENTARY

39. 39
Composition: Making layout, sizing and positioning decisions
WHO?
WHAT?
HOW
MUCH?

40. 40
Composition: Making layout, sizing and positioning decisions

41. 41
Composition: Making layout, sizing and positioning decisions

42. 42
Composition: Making layout, sizing and positioning decisions
Visualisation by Andy Kirk http://www.visualisingdata.com/olympics2016/

43. 43
Demo
A four-stage process for efficient
and effective visualisation design

44. 44
Formulating the brief: Requirements

45. 45
Single slide overview to be used in a presentation to key
stakeholders to show “how staff feel about working here”
Formulating the brief: Requirements

46. 46
Formulating the brief: Tool constraints

47. 47
Working with data: Understanding its properties and qualities
SURVEY RESULTS
8 x question categories about work issues
5 x response categories for scale of feelings
40 x question-response quantities (%, 100% total per question)
DEMOGRAPHICS
4 x gender categories, 4 x quantities (% and abs. numbers)
3 x employment categories, 3 x quantities (% and abs. numbers)
6 x service length categories, 6 x quantities (% and abs. numbers)

48. 48
1. What the proportion of responses look like for each
question?
2. What is the breakdown across respondent demographics?
Editorial thinking: What questions are you trying to answer?

49. 49
Data representation: How to show what you want to say?
CATEGORICAL
Comparing categories and
distributions of quantitative values
TEMPORAL
Showing trends and activities
over time
HIERARCHICAL
Charting part-to-whole relationships
and hierarchies
SPATIAL
Mapping spatial patterns through
overlays and distortions
RELATIONAL
Graphing relationships to explore
correlations and connections
1. What the proportion of responses look like for each
question?
2. What is the breakdown across respondent demographics?

50. 50
Chart types: How to show what you want to say?

51. 51
Chart types: How to show what you want to say?

52. 52
Chart types: How to show what you want to say?
Agreement
Disagreeme
nt
No-opinion

53. 53
Chart types: How to show what you want to say?
Agreement
Disagreeme
nt
No-opinion

54. 54
Chart types: How to show what you want to say?
Gender
Female
Male
Other
No response
Employment Status
Full-Time
Part-Time
No response
Length of Service
Less than 1 year
Between 1 and 3 years
Between 3 and 5 years
Between 5 and 10 years
Over 10 years
No response
Female
Male
Other
No response
0 20 40 60 80 100 120 140
Gender
Full-Time
Part-Time
No response
0 20 40 60 80 100 120 140 160
Employment Status
Less than 1 year
Between 1 and 3 years
Between 3 and 5 years
Between 5 and 10 years
Over 10 years
No response
0 10 20 30 40 50 60 70 80 90
Length of Service

55. 55
Chart types: How to show what you want to say?
Back-to-back bar
chart
Bar
chart
Bubble chart

56. 56
Interactivity: Controlling what and how your data is presented
Q3. Strongly Agree = 45%
More info | Download data | Contact
Results
filtered for
female
respondents

57. 57
Annotation: Judging the right level of assistance
Main
observations
verbalised

58. 58
Colour: Colouring all your chart and project contents

59. 59
Colour: Colouring all your chart and project contents

60. 60
Colour: Colouring all your chart and project contents
Response categories
Demographic bars
Background shading
Title text
Section title text
Chart axis and value labels

61. 61
Colour: Colouring all your chart and project contents

62. 62
Composition: Defining all size and position decisions
Survey results
breakdown
Demographic
breakdown
Title

63. 63
Composition: Defining all size and position decisions

64. 64
Developing your design solution

65. 65
Developing your critical ‘eye’: Evaluating visualisations
Design layers Design evaluation
Data representation: How is the data visually
represented?
What choices are effective and why?
What choices are ineffective, why? What would be better?
Interactivity: Features to adjust the data and
presentation
What choices are effective and why?
What choices are ineffective, why? What would be better?
Annotation: Features of assistance
What choices are effective and why?
What choices are ineffective, why? What would be better?
Colour: Data associations, editorial focus, and
functional harmony
What choices are effective and why?
What choices are ineffective, why? What would be better?
Composition: Layout, size and placement of all
contents
What choices are effective and why?
What choices are ineffective, why? What would be better?

66. 66
Effective
visualisation is
TRUSTWORTHY
Effective
visualisation is
ACCESSIBLE
Effective
visualisation is
ELEGANT
Developing your critical ‘eye’: What is effectiveness?
Do I Believe it? Do I Understand it? Do I Like it?

67. 67
Learn more! ‘Introduction to Data Visualisation’ online course
https://campus.sagepub.com/introduction-to-data-visualisation

68. DATA VISUALISATION
A GAME OF DECISIONS
Andy Kirk
andy@visualisingdata.com
www.visualisingdata.com
@visualisingdata