Embed Size (px)
Citation preview
Data Visualization Lessons From the Movies
A Bigger Boat
Mark Vaillancourt - Microsoft
Trish Vaillancourt – St. Catherine University
Our Cats
Agenda3
https://imgflip.com/memetemplate/62844217/Princess-Bride-Miracle-Max
Agenda4
Why Bother?
https://imgflip.com/memetemplate/62844217/Princess-Bride-Miracle-Max
Agenda5
Why Bother?
Perception
https://imgflip.com/memetemplate/62844217/Princess-Bride-Miracle-Max
Agenda6
Why Bother?
Perception
Preattentive Attributes
https://imgflip.com/memetemplate/62844217/Princess-Bride-Miracle-Max
Agenda7
Why Bother?
Perception
Preattentive Attributes
Attribute Encoding
https://imgflip.com/memetemplate/62844217/Princess-Bride-Miracle-Max
Agenda8
Why Bother?
Perception
Preattentive Attributes
Attribute Encoding
Gestalt Principles
https://imgflip.com/memetemplate/62844217/Princess-Bride-Miracle-Max
Why Bother?
VIDEO
A Bigger Boat
Why Data Visualization?11
Jawshttps://www.youtube.com/watch?v=2I91DJZKRxs
Audience Participation Time!
On how many days did Crisp sales exceed 160 bars?
On how many days did Crisp sales exceed 160 bars?
On how many days did Crisp sales exceed 160 bars?
On how many days did Crisp sales exceed 160 bars?
17
A Pie Chart
VIDEO
A Pie Chart
This is REALLY funny to us... mostly Mark19
Never Gonna Give You Up, Rick Astleyhttps://www.youtube.com/watch?v=oHg5SJYRHA0
20
% of you that just got RickRoll’d
% of you eating actual pie
A Pie Chart
Research Studies
Presentations to funders
Well-displayed information is powerful
Answer questions quickly and easily
Why Should Librarians Care?
Perception
VIDEO
Perception vs Reality
Perception vs Reality24
Sneakershttps://www.youtube.com/watch?v=coDtzN6bXAM
Perceptual Processing Types25
Perceptual Processing Types26
Preattentive Attentive
Source: Stephen Few, Show Me the Numbers
Perceptual Processing Types27
Preattentive Attentive
VERY fast
First type of processing that occurs
Like a snapshot
Source: Stephen Few, Show Me the Numbers
Perceptual Processing Types28
Preattentive Attentive
VERY fast Much slower
First type of processing that occurs
Like a snapshot
Sequential process that can result in Learning, Understanding, Remembering
Source: Stephen Few, Show Me the Numbers
Audience Participation Time!
How many 5s do you see? 30
Source: Stephen Few, Show Me the Numbers
How many 5s do you see? 31
123569831245369841230630169425896312435217896300016576489353200612034098763189
Source: Stephen Few, Show Me the Numbers
Preattentive Processing FTW!32
123569831245369841230630169425896312435217896300016576489353200612034098763189
Source: Stephen Few, Show Me the Numbers
Perceptual Processing Types33
Preattentive Attentive
VERY fast Much slower
First type of processing that occurs
Like a snapshot
Sequential process that can result in Learning, Understanding, Remembering
Source: Stephen Few, Show Me the Numbers
Preattentive Attributes
35
Preattentive Attributes36
Form Color
Spatial Position Motion
Source: Stephen Few, Show Me the Numbers
Preattentive Attributes37
Form
Length
Width
Orientation
Shape
Size
Enclosure
Source: Stephen Few, Show Me the Numbers
Preattentive Attributes38
Form
Length
Width
Orientation
Shape
Size
Enclosure
Source: Stephen Few, Show Me the Numbers
Preattentive Attributes39
Form
Length
Width
Orientation
Shape
Size
Enclosure
Source: Stephen Few, Show Me the Numbers
Preattentive Attributes40
Form
Length
Width
Orientation
Shape
Size
Enclosure
Source: Stephen Few, Show Me the Numbers
Preattentive Attributes41
Form
Length
Width
Orientation
Shape
Size
Enclosure
Source: Stephen Few, Show Me the Numbers
Preattentive Attributes42
Form
Length
Width
Orientation
Shape
Size
Enclosure
Source: Stephen Few, Show Me the Numbers
Preattentive Attributes43
Color
Hue
Intensity
Source: Stephen Few, Show Me the Numbers
Preattentive Attributes44
Color
Hue
Intensity
Source: Stephen Few, Show Me the Numbers
Preattentive Attributes45
Spatial Position
2-D Position
Source: Stephen Few, Show Me the Numbers
VIDEO
2-Dimensional Thinking
2-Dimensional Thinking47
Star Trek II: The Wrath of Khanhttps://www.youtube.com/watch?v=RbTUTNenvCY
Audience Participation Time!
What is the value for Santino?49
What is the value for Santino?50
Michael
What is the value for Santino?51
MichaelMichael
What is the value for Santino?52
MichaelMichael
Caution
3-Dimensional Thinking53
! !
Our perception of Depth is weak
Source: Stephen Few, Show Me the Numbers
54
3-D charts and graphs are GREAT, right?
3-Dimensional??55
Star Wars: The Empire Strikes Backhttps://www.youtube.com/watch?v=FSWiMoO8zNE
Preattentive Attributes56
Motion
Flicker
Source: Stephen Few, Show Me the Numbers
Preattentive Attributes57
Source: Stephen Few, Show Me the Numbers
Form Color
Spatial Position Motion
Preattentive Attributes: Who Cares?58
The Breakfast Clubhttps://www.youtube.com/watch?v=6sxdm5ktwqk
“Understanding these attributes enables us to design tables and graphs that visually emphasize
the most important information they contain.”
~ Stephen Few, Show Me the Numbers
Preattentive Attributes: Who Cares?59
Attribute Encoding
Attribute Encoding61
Attribute Encoding62
Quantitative Categorical
Source: Stephen Few, Show Me the Numbers
Attribute Encoding63
Quantitative Categorical
Values across a continuum
Not just difference, but degree of difference
Source: Stephen Few, Show Me the Numbers
Attribute Encoding64
Quantitative Categorical
Values across a continuum Difference alone
Not just difference, but degree of difference
Source: Stephen Few, Show Me the Numbers
Attribute Encoding65
Length
Form
Source: Stephen Few, Show Me the Numbers
Attribute Encoding66
Length
Form
Source: Stephen Few, Show Me the Numbers
Attribute Encoding67
Length
Form
Source: Stephen Few, Show Me the Numbers
Attribute Encoding68
Color
Hue
Source: Stephen Few, Show Me the Numbers
Attribute Encoding69
Kung Fu Pandahttps://www.youtube.com/watch?v=lp2blBW5yWw
Attribute Encoding70
Color
Hue
Source: Stephen Few, Show Me the Numbers
Attribute Encoding71
Color
Hue
Source: Stephen Few, Show Me the Numbers
Attribute Encoding72
Attribute
Length
Width
Orientation
Shape
Size
Enclosure
Hue
Intensity
2-D Position
Quantitatively Perceived
Color
Form
Spatial Position
Category
Source: Stephen Few, Show Me the Numbers
Attribute Encoding73
Attribute
Length
Width
Orientation
Shape
Size
Enclosure
Hue
Intensity
2-D Position
Quantitatively Perceived
No
No
No
NoColor
Form
Spatial Position
Category
Source: Stephen Few, Show Me the Numbers
Attribute Encoding74
Attribute
Length
Width
Orientation
Shape
Size
Enclosure
Hue
Intensity
2-D Position
Quantitatively Perceived
Yes, but limited
No
No
Yes, but limited
No
No
Yes, but limitedColor
Form
Spatial Position
Category
Source: Stephen Few, Show Me the Numbers
Attribute Encoding75
Attribute
Length
Width
Orientation
Shape
Size
Enclosure
Hue
Intensity
2-D Position
Quantitatively Perceived
Yes
Yes, but limited
No
No
Yes, but limited
No
No
Yes, but limited
Yes
Color
Form
Spatial Position
Category
Source: Stephen Few, Show Me the Numbers
Audience Participation Time!
Which flavor had the highest sales?
Which flavor had the highest sales?
Which flavor had the highest sales?
Too Much Variety81
Too Much Variety82
Return of the Jedihttps://www.youtube.com/watch?v=HWUQzbYUqGA
Attribute Encoding83
Attribute
Length
Width
Orientation
Shape
Size
Enclosure
Hue
Intensity
2-D Position
Quantitatively Perceived
Yes
Yes, but limited
No
No
Yes, but limited
No
No
Yes, but limited
Yes
Color
Form
Spatial Position
Category
Source: Stephen Few, Show Me the Numbers
4
4
4
4
4
4
8
4
4
Max Variations
VIDEO
Everybody’s Special
Everybody’s Special85
The Incredibleshttps://www.youtube.com/watch?v=1E9pKU_N15A
Option 1
Everybody’s Special
86
Option 1 Option 2
Everybody’s Special
87
Option 1 Option 2
Everybody’s Special
88
Competitor A
Competitor B
Our Company
Competitor C
Competitor D
VIDEO
A World of Color
A World of Color90
The Wizard of Ozhttps://www.youtube.com/watch?v=8lik-qTakrs
Gestalt Principles
Principle
Gestalt Principles92
Similarity
Enclosure
Closure
Continuity
Connection
Proximity
Source: Stephen Few, Show Me the Numbers
Application
Principle
Gestalt Principles93
Similarity
Enclosure
Closure
Continuity
Connection
Proximity
Source: Stephen Few, Show Me the Numbers
Principle
Gestalt Principles94
Similarity
Enclosure
Closure
Continuity
Connection
Proximity
Source: Stephen Few, Show Me the Numbers
Principle
Gestalt Principles95
Similarity
Enclosure
Closure
Continuity
Connection
Proximity
Source: Stephen Few, Show Me the Numbers
Application
Principle
Gestalt Principles96
Similarity
Enclosure
Closure
Continuity
Connection
Proximity
Source: Stephen Few, Show Me the Numbers
Application
Principle
Gestalt Principles97
Similarity
Enclosure
Closure
Continuity
Connection
Proximity
Source: Stephen Few, Show Me the Numbers
Principle
Gestalt Principles98
Similarity
Enclosure
Closure
Continuity
Connection
Proximity
Source: Stephen Few, Show Me the Numbers
Application
Principle
Gestalt Principles99
Similarity
Enclosure
Closure
Continuity
Connection
Proximity
Source: Stephen Few, Show Me the Numbers
Michael Michael
Principle
Gestalt Principles100
Similarity
Enclosure
Closure
Continuity
Connection
Proximity
Source: Stephen Few, Show Me the Numbers
Application
Principle
Gestalt Principles101
Similarity
Enclosure
Closure
Continuity
Connection
Proximity
Source: Stephen Few, Show Me the Numbers
Fruit Color Sales
Apple Red 4
Green 6
Yellow 2
Grape Red 6
Green 8
Black 3
Principle
Gestalt Principles102
Similarity
Enclosure
Closure
Continuity
Connection
Proximity
Source: Stephen Few, Show Me the Numbers
Application
Gestalt Principles103
Similarity
Enclosure
Closure
Continuity
Connection
Proximity
Source: Stephen Few, Show Me the Numbers
Application
Gestalt Principles104
Similarity
Enclosure
Closure
Continuity
Connection
Proximity
Source: Stephen Few, Show Me the Numbers
Application
Gestalt Principles105
Similarity
Enclosure
Closure
Continuity
Connection
Proximity
Source: Stephen Few, Show Me the Numbers
VIDEO
The Power of Proximity
The Power of Proximity107
Jawshttps://www.youtube.com/watch?v=CwdGYMM2bHM
Audience Participation Time!
Which square is the lightest?109
Source: Stephen Few, Show Me the Numbers
Which square is the lightest?110
Source: Stephen Few, Show Me the Numbers
Which square is the lightest?111
Return of the Jedihttps://www.youtube.com/watch?v=4F4qzPbcFiA
Which square is the lightest?112
Source: Stephen Few, Show Me the Numbers
Which square is the lightest?113
Source: Stephen Few, Show Me the Numbers
They are identical.
“It is not how much information there is, but rather how
effectively it is arranged.” ~ Edward Tufte
114
Questions?
Mark VaillancourtBlog: markvsql.comTwitter: @markvsql
Trish VaillancourtTwitter: @trishzv
Slide Deck Download:https://github.com/markvsql/LibTech2018
