The Good, The Bad and The Greys of Data Visualisation Design

The Good, The Badand The Greys of Data Visualisation Design

Andy Kirkwww.visualisingdata.com | @visualisingdata

THE GOOD{do more of this stuff}

3Visualisation from http://filmographics.visualisingdata.com/

#1 Be curious: Questions fuel data visualisation

“What is the pattern of success or failure in the movie careers of a range of notable actors?”

4Visualisation from http://www.visualisingdata.com/2016/05/boom-bust-shape-roller-coaster-season/


“What percentage of Liverpool FC’s matches during the 2015/16 season have been relaxing?”

5Visualisation from http://www.visualisingdata.com/olympics2016


“What is the pattern of improvement between genders in the results of Olympic events measured by time?”

6


“What does the rhythm and architecture of every episode of Seinfeld look like?”

7

#2 Say something: If there’s something to say, say it

Visualisation from http://www.nytimes.com/2015/03/03/upshot/fewer-women-run-big-companies-than-men-named-john.html?abt=0002&abg=1&_r=0

8

#2 Say something: If there’s something to say, say it

Visualisation by New York Times http://www.nytimes.com/interactive/2016/05/22/world/europe/europe-right-wing-austria-hungary.html

9

#3 Make it personal: Participation > interaction

Visualisation by New York Times http://www.nytimes.com/interactive/2013/12/20/sunday-review/dialect-quiz-map.html?_r=0

10

#3 Make it personal: Participation > interaction

Visualisation by Matt Stiles http://thedailyviz.com/2016/09/17/how-common-is-your-birthday-dailyviz/

11

#4 Sweat the small stuff: Care about every pixel

12

#4 Sweat the small stuff: Care about every pixel

THE BAD{do less of this stuff}

14Visualisations from www.cdc.gov/Pcd/Issues/2015/14_0395.html &

http://www.slate.com/articles/life/culturebox/2014/06/death_map_the_most_common_causes_of_death_in_each_state_of_the_union.html

#1 Wake-up: Stop going through the motions

15


Visualisation by YouGov https://yougov.co.uk/news/2014/11/09/public-attitudes-tax-distribution/

16


17


#2 Everything has a role: Don’t be a (knee) jerk

Google search: “Marketing Infographics”


20


Visualisation by SCMP http://lasombra.blogs.com/la_sombra_del_asno/2013/03/kwc.htmlVisualisation from BMJ http://www.bmj.com/content/350/bmj.g7620/infographic

BAD PIE CHARTS ARE BAD CHARTSBAD BAR CHARTS ARE BAD CHARTS

BAD WORD CLOUDS ARE BAD CHARTSBAD RADAR CHARTS ARE BAD CHARTS


22

#3 Lazy colouring: ‘Above all do no harm’

Image from http://eagereyes.org/basics/rainbow-color-map | Photo from https://twitter.com/espurrkawa/status/829238117848739841

23Visualisation from http://www.vulture.com/2013/04/leading-men-age-but-their-love-interests-dont.html


24

1.LOCKED2.DISARMED3.ALERT?4.EXIT

1.ALERT?2.ARMED3.DANGER4.OPEN5.PULL


25

#4 Story ‘badging’: It’s not all storytelling

26


27


“For sale: Baby shoes. Never worn.”

E. Hemingway

28


THE GREYS{be more discerning

about this stuff}

30

#1 Interactivity: Fewer hurdles, not more

Cover image from https://www.amazon.co.uk/Dont-Make-Me-Think-Usability/dp/0321344758 | Image from http://i.imgur.com/u7ikyWS.jpg

31

#1 Interactivity: Fewer hurdles, not more

From Archie Tse’s talk https://github.com/archietse/malofiej-2016/blob/master/tse-malofiej-2016-slides.pdf

Visualisation by Jonathan Corum http://13pt.com/projects/nyt071211/ Visualisation by Bloomberg http://www.bloomberg.com/infographics/2014-01-16/tracking-super-bowl-ticket-prices.html

#2 Clarity is king: Simplifying is dependent

33Visualisation by FT https://twitter.com/theboysmithy/status/705323516711804928 | Video from https://www.youtube.com/watch?v=UNs-ziziPyo

#2 Clarity is king: Simplifying is dependent

34

#3 Audiences are complex: It’s for them, not you

What do you want to tell them? What do you know they need to know? If you

were them what would you find relevant?

35


36Visualisation from New York Times http://www.nytimes.com/elections/results/president


37


Perceiving Interpreting Comprehending

What does it mean?Is it good or bad?

Meaningful or insignificant?Unusual or expected?

What does it show?Where is big, medium, small?

How do things compare?What relationships exist?

What does it mean to me?What are the main messages?

What have I learnt?Any actions to take?

SUBJECT KNOWLEDGEFORM OF COMMUNICATION AUDIENCE RECEPTIVENESS

38

#4 Reading vs. Feeling: Sometimes, its about the gist

Visualisation by Periscopic http://guns.periscopic.com/

39


Visualisation by LA Times Graphics http://graphics.latimes.com/kobe-every-shot-ever/

40


Visualisation by Washington Post http://www.washingtonpost.com/wp-srv/special/politics/2014-state-of-the-union/language-of-sotu/

41


Visualisation by New York Times http://www.nytimes.com/interactive/2016/07/29/us/elections/trump-clinton-pence-kaine-speeches.html

42

#1 Be curious: Questions fuel data visualisation#2 Say something: If there’s something to say, say it

#3 Make it personal: Participation > interaction#4 Sweat the small stuff: Care about every pixel

#1 Wake-up: Stop going through the motions#2 Everything has a role: Don’t be (knee) jerk

#3 Lazy colouring: ‘Above all do no harm’#4 Story ‘badging’: It’s not all storytelling

#1 Interactivity: Fewer hurdles, not more#2 Clarity is king: Simplifying is dependent

#3 Audiences are complex: It’s for them, not you#4 Reading vs. Feeling: Sometimes, its about the gist

The Good, The Bad and The Greys

The Good, The Badand The Greys of Data Visualisation Design

Andy Kirkwww.visualisingdata.com | @visualisingdata

The Good, The Bad and The Greys of Data Visualisation Design

Design

Transcript of The Good, The Bad and The Greys of Data Visualisation Design