Responsible
data visualization
Visualization by Arthur Buxton
Responsible
data visualization
Visualization by Arthur Buxton
(for the web)
Matisse’s Icarus
Its creation = encoding
Its use = decoding
Ben Fry’s 7 steps
of visualizing data
Author of Visualizing Data / Co-developer of Processing software
Our scope:
Design:
Visual encoding
Development:
Web implementation
What does it mean to be responsible?
Accurate
Effective
Accessible
Integrity
Efficiency
Performance
Access(ibility)
Maintainability
Form
___
Tools
Form
Integrity
Efficiency
Performance
Access(ibility)
Maintainability
___
70%
+ 63%
+ 60%
= 193%!
Accurate bubble sizes
Years competed
Truncated axes
Production Budget
Form
Integrity
Efficiency
Performance
Access(ibility)
Maintainability
___
Legend alternatives
Form
Integrity
Efficiency
Performance
Access(ibility)
Maintainability
___
Speed to load
Not specific to
charts and graphs, but...
Performant user interactions
Click, hover, scroll, etc.
Designers are in a unique position to impact overall page load time and perceived performance. The decisions that are made during the design process have an enormous impact on the end result of a site.’’
- Lara Hogan
Form
Integrity
Efficiency
Performance
Access(ibility)
Maintainability
___
Visual
Motor
Auditory
Cognitive
Visual
<meta name="viewport" content="width=device-width, initial scale=1">
Semantic HTML
Test with screen readers!
Motor
Game Boy
Smart TVs / game consoles
Sharing
Responsiveness
Form
Integrity
Efficiency
Performance
Access(ibility)
Maintainability
___
Can we add more gems?
Can it have longer gem names?
Is it flexible in width?
:)
:/
:)
Easy for scripting?
:)
Responsive?
:)
Can we add more sections?
:/
Easy for scripting?
:/
Can change to pie chart!
:)
Scatter plot
Responsive?
:)
Can we add more points of data?
:)
Can we add another dimension?
:)
Easy for scripting?
:)
Form
Integrity
Efficiency
Performance
Accessibility
Maintainability
___
The End
Thank you!
(=^◡^=)
Responsible Data Visualization V2
By Amanda Cheung
Responsible Data Visualization V2
Front Porch 2015, CSS Dev Conf 2015, Future of Web Design NYC 2015, Refresh Boston November 2015, NYC D3.js November 2015 Meetup
