Principles of Analytical Design Nicolas Garcia Belmonte - @philogb - Sept. 2011
Jan 15, 2015
Principles of Analytical Design
Nicolas Garcia Belmonte - @philogb - Sept. 2011
I use Web Standards to create Data Visualizations.
I’m the author of two JavaScript data visualization frameworks.
PhiloGL JavaScript InfoVis Toolkit
Fundamental Principles of Analytical Design (Tufte)
1 - Comparisons
2 - Causality, mechanism, structure, explanation
3 - Multivariate analysis
4 - Integration of evidence
5 - Documentation
6 - Content counts most of all
Source: Edward Tufte - Beautiful Evidence
1 - Show comparisons, contrasts, differences.
Lie Factor
“The representation of numbers, as physically measured on the surface of the graphic itself, should be directly
proportional to the quantities represented.”
Source: Tufte 1991
Lie Factor
1985: the line representing 27.5 m/g is 5.3 inches long1978: the line representing 18.0 m/g is 0.6 inches long
Lie Factor: 783 / 53 = 14.8!Source: The New York Times
Sometimes it’s useful to emphasize something.
2 - Show causality, mechanism, explanation, systematic structure.
Source: Semiology of Graphics - Jacques Bertin
Charles Minard’s data-map describes the successive losses in men of the French army during the French invasion of
Russia in 1812Source: Edward Tufte - Beautiful Evidence
3 - Show multivariate data; that is, show more than 1 or 2 variables.
Channel Ranking vs. Data Type
PositionLengthAngleSlopeArea
VolumeDensity
SaturationHue
TextureConnectionContainment
Shape
PositionDensity
SaturationHue
TextureConnectionContainment
LengthAngleSlopeArea
VolumeShape
PositionHue
TextureConnectionContainment
DensitySaturation
ShapeLengthAngleSlopeArea
Volume
Quantitative Ordinal Nominal
Source: Tamara Munzner. Chapter 27, p 675-707, of Fundamentals of Graphics, Third Edition, by Peter Shirley et al. AK Peters, 2009
Maps for height, hair color and cephalic index distribution
Source: Semiology of Graphics - Jacques Bertin
Map for height, hair color and cephalic index distribution
Source: Semiology of Graphics - Jacques Bertin
Source: Reddit.com
4 - Completely integrate words, numbers, images, diagrams.
Source: Vancouver Map
Source: Carmel Map
Source: Zurich Map
Source: The Hague Map
Source: Paris Bus Map
5 - Thoroughly describe the evidence. Provide a detailed title, indicate the authors and sponsors, document the data
sources, show complete measurement scales, point out relevant issues.
Source: Beautiful Evidence - Edward Tufte
6 - Analytical presentations ultimately stand or fall depending on the quality, relevance and integrity of their
content.
Source: Wikipedia
Other Useful Principles
6 - Interactivity
7 - Personalization / Identification
8 - Aesthetic value
Other Useful Principles
Source: The New York Times
Thanks!
Nicolas Garcia Belmonte
http://philogb.github.com/@philogb