50 Shades of Data, A Zen Masters Guide to Colour

Post on 24-Jan-2017

778 views 2 download

Transcript of 50 Shades of Data, A Zen Masters Guide to Colour

FIFTY SHADESOF DATA

Warning: The following presentation contains flashing images*

*Well I have got to get through 300+ slides in 45 minutes

Viewer discretion is advised

1665

10

Isaac Newton

Isaac Newton

added colour

White

2nd prism

not adding colour

refraction

wavelength

SPECTRUMSPECTRUM

“The original or primary colours are Red, Yellow, Green, Blew, & a

violet purple; together with Orang, Indico, & an indefinite

varietie of intemediate gradations”

why 7?

indigo

40

legacy

colour theory

45

I’m MattI’m Matt

my day job…my day job…

welcome welcome

welcome trust welcome trust

welcome trust sanger

welcome trust sanger

welcome trust sanger institute

welcome trust sanger institute

My Office My Office

biologybiology

chemistrychemistry

engineeringengineering

electronicselectronics

datadata

Lots of dataLots of data

69

by nightby night

blog

wannabedatarockstar.blogspot.com

Tweet

a lot

@Matt_Francis

You may remember me from such videos

as…

And

81

Tableau Public

Zen Master

today I’m going to give you my guide

colourcolour

86

93

improve aesthetics

catch peoples attention

96

improve understanding

theory

practical

pick the right colours

data -> viz type

data -> colours

107

perceptionperception

108

associationsassociations

109

highlightinghighlighting

emotionsemotions

themesthemes

COLOUR THEORYCOLOUR THEORY

3

primary

red

blueyellow

“fundamental”

can’t be made by mixing

Primary +

primary

3

secondary

green

purpleorange

Primary +

secondary

6

tertiary

yellow-orange

red-orange red-purple

blue-green yellow-green

blue-purple

pick colours

colour harmony

pleasing to the eye

balance

chaotic

engaging

boring

135

create harmony

complementary

opposite colours

High Contrast

COLOURS POP

warning

a

148

once seen

cannot be unseen

151

everywhereeverywhere

Why?

most films contain humans

skin tone

shadows

blue

highlights

orange

opposing concepts

movie posters

176

default colours

great for showing

differences

how do we pick colours?

COLOUR PERCEPTION

COLOUR PERCEPTION

183

Quiz Time

black blue?

white gold?

Another Question

what was the colour of the gorilla’s tie?

#1 rule when using

colour

Never distract

Always enhance

improve esthetics

improve understanding

what does the dress tell us?

people see colours

differently

cannot assume

Colour

blindness

red green

1 in 10

Quiz Time

the BIG Question

can you use red/green?

NO!!!

NEVER!!!

Worse thaN Pie Charts!!!

Stephanie Evergreen

Bad

good

if the viz is just for you

limited audience

if its going to be public

Emily kundEmily kund

http://tinyurl.com/seeallthedata

use high contrast shades

example in a map

www.vischeck.com

NOT with a colour range

241

242

243

244

only using discrete colours

Red

green

COLOUR ASSOCIATIONS

COLOUR ASSOCIATIONS

249

252

253

254

fruityfruity

255

berriesberries

256

full bodied

full bodied

Red Wine

decided before they

tasted

we can use this in our data viz

Quiz Time

261

262

politics?politics?

263

264

265

the letter “o”

the letter “o”

map + blue + red = political

map + blue + red = political

map + blue + red = political

map + blue + red = political

colour is one of the first

things we see

assumptions

272

BAD

negative

DANGER

279

281

282

283

COLOUR HIGHLIGHTING

COLOUR HIGHLIGHTING

285

biased highlighting

impartial highlighting

288

How do Europe's all-time top goalscorers

compare to Zlatan Ibrahimovic?

How do Europe's all-time top goalscorers

compare to Zlatan Ibrahimovic?

291

292

EMOTIONSEMOTIONS

294

295

296

297

COLOUR THEMESCOLOUR THEMES

300

301

302

304

tabpal.co

interworks colour tool

90%

10%

313

314

315

316

317

www.wannabedatarockstar.blogspot.com

@Matt_Franciswww.facebook.com/wannabedatarockstar

Please complete the session survey from the Session Details screen in your TC15 app