pycon data design_meaning
TRANSCRIPT
DATADESIGN
MEANING
djangoproject.com
skillsapp.com
(tweet @skillsapp for invite)
♥ VISUALIZATIONSRSLY, GUISE
DATA
?
PROFITMEANING!
acquireparsefiltermine
representrefine
interact
acquireparsefiltermine
representrefine
interact
ENGINEERING
DESIGN
DATA
?
PROFITMEANING!
VISUALIZATIONS
CHARTS
http://bit.ly/vYZgQb
21HeH
4 5 6 7 8 9 103Be B C N O F NeLi
12 13 14 15 16 17 1811Mg Al Si P S Cl ArNa
20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 3619Ca Sc Ti V Cr Mn Fe Co Ni Cu Zn Ga Ge As Se Br KrK
38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 5437AgSr Y Zr Nb Mo Tc Ru Rh Pd Cd In Sn Sb Te I XeRb
56 72 73 74 75 76 77 78 79 80 81 82 83 84 85 8655Ba Hf Ta W Re Os Ir Pt Au Hg Tl Pb Bi Po At RnCs
88 104 105 106 107 108 109 110 111 112 113 114 115 116 117 11887Sg Rg Uuq UupRa Rf Db Bh Hs Mt Ds Cn Uut Uuh Uus UuoFr
57 58 59 60 61 62 63 64 65 66 67 68 69 70 71DyLa Ce Pr Nd Pm Sm Eu Gd Tb Ho Er Tm Yb Lu
89 90 91 92 93 94 95 96 97 98 99 100 101 102 103Ac Th Pa U Np Pu Am Cm Bk Cf Es Fm Md No Lr
GroupPeriod
Lanthanides
Actinides
1
2
3
4
5
6
7
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
21HeH
4 5 6 7 8 9 103Be B C N O F NeLi
12 13 14 15 16 17 1811Mg Al Si P S Cl ArNa
20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 3619Ca Sc Ti V Cr Mn Fe Co Ni Cu Zn Ga Ge As Se Br KrK
38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 5437AgSr Y Zr Nb Mo Tc Ru Rh Pd Cd In Sn Sb Te I XeRb
56 72 73 74 75 76 77 78 79 80 81 82 83 84 85 8655Ba Hf Ta W Re Os Ir Pt Au Hg Tl Pb Bi Po At RnCs
88 104 105 106 107 108 109 110 111 112 113 114 115 116 117 11887Sg Rg Uuq UupRa Rf Db Bh Hs Mt Ds Cn Uut Uuh Uus UuoFr
57 58 59 60 61 62 63 64 65 66 67 68 69 70 71DyLa Ce Pr Nd Pm Sm Eu Gd Tb Ho Er Tm Yb Lu
89 90 91 92 93 94 95 96 97 98 99 100 101 102 103Ac Th Pa U Np Pu Am Cm Bk Cf Es Fm Md No Lr
GroupPeriod
Lanthanides
Actinides
1
2
3
4
5
6
7
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
21HeH
4 5 6 7 8 9 103Be B C N O F NeLi
12 13 14 15 16 17 1811Mg Al Si P S Cl ArNa
20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 3619Ca Sc Ti V Cr Mn Fe Co Ni Cu Zn Ga Ge As Se Br KrK
38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 5437AgSr Y Zr Nb Mo Tc Ru Rh Pd Cd In Sn Sb Te I XeRb
56 72 73 74 75 76 77 78 79 80 81 82 83 84 85 8655Ba Hf Ta W Re Os Ir Pt Au Hg Tl Pb Bi Po At RnCs
88 104 105 106 107 108 109 110 111 112 113 114 115 116 117 11887Sg Rg Uuq UupRa Rf Db Bh Hs Mt Ds Cn Uut Uuh Uus UuoFr
57 58 59 60 61 62 63 64 65 66 67 68 69 70 71DyLa Ce Pr Nd Pm Sm Eu Gd Tb Ho Er Tm Yb Lu
89 90 91 92 93 94 95 96 97 98 99 100 101 102 103Ac Th Pa U Np Pu Am Cm Bk Cf Es Fm Md No Lr
GroupPeriod
Lanthanides
Actinides
1
2
3
4
5
6
7
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
21HeH
4 5 6 7 8 9 103Be B C N O F NeLi
12 13 14 15 16 17 1811Mg Al Si P S Cl ArNa
20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 3619Ca Sc Ti V Cr Mn Fe Co Ni Cu Zn Ga Ge As Se Br KrK
38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 5437AgSr Y Zr Nb Mo Tc Ru Rh Pd Cd In Sn Sb Te I XeRb
56 72 73 74 75 76 77 78 79 80 81 82 83 84 85 8655Ba Hf Ta W Re Os Ir Pt Au Hg Tl Pb Bi Po At RnCs
88 104 105 106 107 108 109 110 111 112 113 114 115 116 117 11887Sg Rg Uuq UupRa Rf Db Bh Hs Mt Ds Cn Uut Uuh Uus UuoFr
57 58 59 60 61 62 63 64 65 66 67 68 69 70 71DyLa Ce Pr Nd Pm Sm Eu Gd Tb Ho Er Tm Yb Lu
89 90 91 92 93 94 95 96 97 98 99 100 101 102 103Ac Th Pa U Np Pu Am Cm Bk Cf Es Fm Md No Lr
GroupPeriod
Lanthanides
Actinides
1
2
3
4
5
6
7
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
21HeH
4 5 6 7 8 9 103Be B C N O F NeLi
12 13 14 15 16 17 1811Mg Al Si P S Cl ArNa
20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 3619Ca Sc Ti V Cr Mn Fe Co Ni Cu Zn Ga Ge As Se Br KrK
38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 5437AgSr Y Zr Nb Mo Tc Ru Rh Pd Cd In Sn Sb Te I XeRb
56 72 73 74 75 76 77 78 79 80 81 82 83 84 85 8655Ba Hf Ta W Re Os Ir Pt Au Hg Tl Pb Bi Po At RnCs
88 104 105 106 107 108 109 110 111 112 113 114 115 116 117 11887Sg Rg Uuq UupRa Rf Db Bh Hs Mt Ds Cn Uut Uuh Uus UuoFr
57 58 59 60 61 62 63 64 65 66 67 68 69 70 71DyLa Ce Pr Nd Pm Sm Eu Gd Tb Ho Er Tm Yb Lu
89 90 91 92 93 94 95 96 97 98 99 100 101 102 103Ac Th Pa U Np Pu Am Cm Bk Cf Es Fm Md No Lr
GroupPeriod
Lanthanides
Actinides
1
2
3
4
5
6
7
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
http://nyti.ms/z7n5Xg
I NCEPT ION
acquireparsefiltermine
representrefine
interact
ENGINEERING
DESIGN
DO NOHARM
first,
OMITNEEDLESS
DATA
OMIT
NEEDLESSthe
DATA INKto ratio
from “Designing with Data” by Brian Sudahttp://www.designingwithdata.com/
from “Designing with Data” by Brian Sudahttp://www.designingwithdata.com/
from “Designing with Data” by Brian Sudahttp://www.designingwithdata.com/
from “Designing with Data” by Brian Sudahttp://www.designingwithdata.com/
from “Designing with Data” by Brian Sudahttp://www.designingwithdata.com/
CHARTJUNK
LIES,
LIES,
STATISTICS
damn
and
2007 2008 2009 2010 2011
20%
20%
20%
20%
20%
2007 2008 2009 2010 2011
DO NOHARM
first,
VISIONf*cking
how does it work?
GESTALT PRINCIPLESof
PERCEPTION
(just google it later)
RELATIONSHIPSPROXIMITYSIMILARITYENCLOSURE
CLOSURECONTINUITYCONNECTION
PROXIMITY SIMILARITY ENCLOSURE
CONNECTION CONTINUITY CLOSURE
ANGLES
ANGLES
SHAPES
COLOR
HUE
VALUE
MS LBLUE GREEN RED
http://en.wikipedia.org/wiki/Opponent_process
http://en.wikipedia.org/wiki/Opponent_process
vs vs
http://en.wikipedia.org/wiki/Opponent_process
vs vs
DEUTERANOPIA“RED-GREEN COLORBLINDNESS”
1 IN 10 MALES
http://en.wikipedia.org/wiki/Opponent_process
vs vs
http://en.wikipedia.org/wiki/Opponent_process
vs vsvs
ACTUALLY,
http://en.wikipedia.org/wiki/Lab_color_space
vs vsvs
CIE LAB COLORSPACE
L a b
http://en.wikipedia.org/wiki/HSL_color_space
HSL HSV
HSV VHSL L
CIELAB L*
Images courtesy Wikipedia & Luc Viatour / www.Lucnix.be
COLOR SCIENCETL;DR
GETS REAL DEEP, REAL FAST
BREWER PALETTEShttp://colorbrewer2.org/
HIERARCHYestablish a visual
DE/EMPHASIS
123widgets sold
123widgets sold
normal
emphasized
de-emphasizednormal
ONCE
ONCE A DAY?or
8 / 10
NUMERALS
Early 2096 was…
Early !"#$ was…
old-style
lining
LINING FIGURESPROTIP
JUST USE THEM
1,002,9828,239,8719,242,853
proportional
tabular
%&''(&)*(*&(+)&*,%)&(-(&*.+
TOTAL
TOTAL
INTERACTIVE
MUCH MOREyou can show
data
TOO MUCHyou can show
data
NARRATIVE
READER
AUTHORdriven
NARRATIVE VISUALIZATION
http://vis.stanford.edu/files/2010-Narrative-InfoVis.pdf
TELLING STORIES WITH DATA
“THE MARTINI GLASS”figure 1
“THE MARTINI GLASS”figure 1
STARTGUIDED
NARRATIVEEXPLORE
“THE MARTINI GLASS”figure 1
WOWGUIDED
NARRATIVELEDEADD
DETAIL
“THE TWIST”
“THE INTERACTIVE SLIDESHOW”
figure 2
ABC 123 *@!
http://vis.stanford.edu/files/2010-Narrative-InfoVis.pdf
“THE DRILL-DOWN”figure 3
AUDIENCE
I NCEPT ION
I DA NCEPT IONF R O M T H E P R O D U C E R S O F P Y C O N
O HAI IM
EDWARDTUFTE
ThN y!@idangazit & htp://gazit.me
don’t be shy, come say hi!