Telling Stories with Data Visualisation

77
Telling Stories with Data Visualization Jo Wood Professor of Visual Analytics giCentre City University London [email protected] gicentre.org jwoLondon Image source: Scott McCloud (2006) Making Comics

description

 

Transcript of Telling Stories with Data Visualisation

Page 1: Telling Stories with Data Visualisation

Telling Stories with Data

Visualization Jo Wood

Professor of Visual Analytics giCentre

City University London

[email protected] gicentre.org jwoLondon

Image source: Scott McCloud (2006) Making Comics

Page 2: Telling Stories with Data Visualisation

But more from me later …

Page 3: Telling Stories with Data Visualisation

Much of the work in data visualization focuses on visual and interaction design (for good reason). We will touch on some of those issues this evening, but what I want to focus on is how we might incorporate ideas from storytelling from other media into the design and use of data visualization to: Make it more memorable Make it more engaging Help people make sense of what they see Make visualization more persuasive I want move move away from considering datavis as a way of throwing information at people [like this collection of charts], and instead consider how we can use the visual with narrative to help us make sense of data.

Page 4: Telling Stories with Data Visualisation

Charles Minard, 1869 Carte figurative des pertes successives en hommes de l'Armée Française dans la campagne de Russie 1812-1813

Page 5: Telling Stories with Data Visualisation

First, a story… Before the Tour de France there was the Paris-Best-Paris (1891). A 1200km (750 miles) race to be completed in under 90 hours (3.75 days). A series of ‘controls’ every 50 miles or so where you can stop for food, and if you have time a short rest/sleep. One of the biggest challenges is managing sleep deprivation and stopping minor injuries becoming more serious.

Page 6: Telling Stories with Data Visualisation

Here’s an excerpt from a short film about PBP in the 1980’s that includes an account of two sisters who had trained together to complete in the event. Video: Damon Peacock: http://youtu.be/pmcui9ynsus

Page 7: Telling Stories with Data Visualisation

Fast forward to 2011 – 5000 riders let off in smaller groups over a period of several hours. Temperature was 30 degrees in the sun. What has this got to do with data visualization? Well, I was there, getting sun stroke while waiting for 3 hours before setting off for 3 days and nights of non stop cycling. After the event I decided to chart my progress… Image Source: http://3.bp.blogspot.com/-f7lNv8cmazU/Tl0qocQXR9I/AAAAAAAABc4/sdGgtxf3FCI/s1600/pbp24-start-shade.jpg

Page 8: Telling Stories with Data Visualisation

0

500

1000

1500

2000

2500

3000

3500

4000

4500

5000

200 300 400 500 600 700 800 900 1000 1100 1200 1300

Villaines

Fougeres

TinteniacLoudeac

Carhaix

Brest

Mortagne

Dreux

Saint Quentin

Carhaix

LoudeacTinteniacFougeres

Villaines

Dehydrated; two short sleep stops in a field; couldn't eat

Found my form; good fixed terrain; fast riding buddy

RODE THROUGH STORM RATHER THAN SLEEP

SECOND SLEEP STOP

FIRST SLEEP STOP

STOP FOR SHOWER

SHOWER

Hallucinating with Lack of Sleep. Forced SLEEP STOP

GOOD FIXED TERRAIN; ATE PROPERLY

GOOD FOOD and weather

D i s t a n c e P o s i t i o n

Paris-Brest-Paris 2011

Arrivee !!82 hrs

While this was a a single example of my own attempt at ‘personal visualization’ it provided the inspiration for visualization of 1000 riders taking part in the 2013 London-Edinburgh-London long distance cycle event…

Page 9: Telling Stories with Data Visualisation

London – Edinburgh – London 2013

See http://gicentre.org/lel2013 (try entering number C35 as an example). See also http://www.gicentre.net/blog/2013/10/31/lel

Page 10: Telling Stories with Data Visualisation

0

50

100

150

200

250

300

350

400

450

Britai

n Ger

many

France

Un

ited S

tates

Italy

Polan

d Net

herlan

ds Jap

an

Irelan

d Spa

in Can

ada

Sweden

Den

mark

Finlan

d Swi

tzerla

nd

Greece

Aus

tralia

Bel

gium

India

Taiwa

n Sou

th Afri

ca Aus

tria

Sloven

ia Bra

zil

Singap

ore

Russia

Bul

garia

Croati

a Uzb

ekista

n Chi

na

Norwa

y Tim

or-Lest

e Col

ombia

Bel

arus

Loughton

Edinburgh

Great Easton

St Ives

KirtonMarket Rasen

PocklingtonThirsk

Barnard Cast le

Brampton

Moffat

TraquairN

W

E600melevation

50 km

London - Edin burgh - London Info Sketches

Eskdalemuir

6%Proportion of starters who were women

22%Proportion of starters who did not make it to the end

within time limit

All graphics based on data collected from digital records of riders arriving at each control. Some records may be missing and summary figures are approximate only. Thanks to Danial Webb and Alex Greenbank for providing raw data during and after the event.. For interactive versions of these graphics, see http://gicentre.org/lel2013

7%Proportion of finishers who were women

Number of finishers by nationality 43%

Proportion of ridersfrom the UK

Time in hand for each rider at each control. Blue lines indicate finishers within time limit; red show non finishers.

Spread of riders at 3pm on day one and day three

Number of DNF by nationality

26Number of starters

from Poland

51 hrs 11 mins

Time between first and last finishers

13.6 km/h

Average speed, including all stops, of all finishers

Average speed, including all stops,of first finisher

21.7 km/h

Relative position of every rider. DNFs shown in red.

Jo Wood, Sept 2013

26Number of finishers from Poland

N u m

b e r

o f

R i d e

r sT I

M E

I N H

A N D

( H O U

R S )

5040302010

01020304050

50

45

40

35

30

25

20

15

10

5

0

-5

Tue 30th JulySun 28th July

Fastest

AveragePosition

Fu!Value

Lough

ton

St. Iv

es

Kirton

Marke

t Rase

n

Pockli

ngton

Thirsk

Barna

rd Ca

stle

Bramp

ton

Moffa

t

Edinb

urgh

Traqu

air

Eskda

lemuir

Bramp

ton

Barna

rd Ca

stle

Thirsk

Pockli

ngton

Marke

t Rase

n

Kirton

St. Iv

es

Great

Easto

n

Lough

ton

Lough

ton

St. Iv

es

Kirton

Marke

t Rase

n

Pockli

ngton

Thirsk

Barna

rd Ca

stle

Bramp

ton

Moffa

t

Edinb

urgh

Traqu

air

Eskda

lemuir

Bramp

ton

Barna

rd Ca

stle

Thirsk

Pockli

ngton

Marke

t Rase

n

Kirton

St. Iv

es

Great

Easto

n

Lough

ton

Lough

ton

St. Iv

es

Kirton

Marke

t Rase

n

Pockli

ngton

Thirsk

Barna

rd Ca

stle

Bramp

ton

Moffa

t

Edinb

urgh

Traqu

air

Eskda

lemuir

Bramp

ton

Barna

rd Ca

stle

Thirsk

Pockli

ngton

Marke

t Rase

n

Kirton

St. Iv

es

Great

Easto

n

Lough

ton

Page 11: Telling Stories with Data Visualisation

The previous example was richer in data with some narrative.

Alternatively, we can increase the narrative content while constraining the data content (this example from a 1000km cycle ride across Wales).

The degree to which narrative forms part of the data visualization depends on the audience, the purpose and the medium.

Page 12: Telling Stories with Data Visualisation

Llanwrtyd

Upton Magna

Lake Vyrnwy

Llanberis

Dolgellau

Pendine

St David's

Cilgerran

Llandovery

Aberystwyth

1. Arrived Thursday evening for a pre-ride meal. Fellow audaxers looking intimidatingly

fit in their non-lycra civvies. A sense of foreboding and onion soup pervades the

village hall.

27. While stopped at the Tenby info control, Flatus mobbed by a gaggle of women of a certain age who appeared very interested in

where he'd been and where he was going. Afterwards he tells me to get

my Gortex, we've pulled - or words to that effect.

35. Terrible road surface on steep descent, now christened Hobson's Hill: If I brake

hard, my dynamo light dwindles to almost nothing, if I don't I pick up speed with

alarming rapidity. Friendly car appears from behind and lights

the way on undipped beam.

34. As the rain starts in earnest, the sun sets and climbing continues, I realise that

the "only one hill of note" mentioned in the pub is not the pass between Llandovery

and Llanwrtyd, but an increasingly bleak looking Mynydd Llanybyther. Get

flashbacks of crossing Yad Moss alone in a storm at midnight on the LEL.

41. Can this climb get more beautiful? Yes - we come across a small herd of wild horses complete with

flowing manes and come hither eyelashes. It's as if a Victorian landscape painter had had them helicoptered

(or rather steam engined) in to complete the bucolic idyll.

2. Welsh place names seem to arrive remarkably quickly. The pace is quite fast, with a fairly organised peloton and turns at the front.

This is a new part of the country for cycling for me. The good weather, clear, dry, little wind, brings out the best in the landscape.

3. Climbing begins in earnest through stunning landscape. Unexpected surprise to see the magnificent dam at Lake Vyrnwy -

and then to cycle over it. The first control does generous beans on toast - the first of about ten I'll get through on this long weekend.

4. Wonderful wooded road along the banks of Lake Vyrnwy. Not a car (or cyclist) in sight.

5. Climbing proper begins up to Bwlch y Groes. Highest point on the ride, but not the hardest climbing. We ascend the "easy" way. At the t-

junction near the top, get precipitous views of the 25% climb to our left that thankfully we avoid.

8. Magnificent views of Snowdon as we begin the steady climb from Betws Y Coed to Pen-y-pass. Sun is out, little wind to bother us. The last part of the climb overlaps with the Brian Chapman

route, but feels much easier today with fresher legs and benign weather.

6. The climb up above Ffestiniog starts to feel increasingly remote. In this weather it's beautiful, surrounded by the higher peaks of

Snodonia. In poor weather this could be a bit of a brute.

9. Beetroot soup and a chocolate milkshake at Pete's Eats in Llanberis. Hummers remarks that to have willingly chosen the beetroot must mean my body has developed an immunity to it. There is talk in the cafe from veterans of the Snowdon and Coasts of taking the long way round to avoid a gratuitous climb out of town. I decide to take the official route

and am rewarded with stunning views of Snowdon and coasts.

7. Have run out of water and am feeling increasingly thirsty. Fill water bottles up in

mountain stream. More eco-friendly than Evian.

10. Interesting to ride a bit more of the Brian Chapman here, but earlier in the day

with better weather and fresher legs. A novelty not to get minor hassle from drunken locals in Penrhyndeudraeth. A slight tail wind helps

speed me on my way.

11. Get the beginnings of the bonk, so munch through two Snickers flapjacks (very good on the bike comfort eating) and a Magnum with views of holiday

folk on the beach.

12. Barmouth bridge as delightful as ever. Man at toll both very careful to make sure I have my ticket. I wonder how much they've

made in tolls from the various Brian Chapmans and other audaxes over the years.

13. Decide to take the road rather than

NCN route to Dolgellau.

Relief not to have to climb up to Kings

YHA.

14. Civilised food stop and in Dolgellau. Apparently about 'half

the field' have already

controlled here.

15. Great to climb Cross Foxes and descend Dinas

Mawddwy on gears for a change. Seems easier than at 5am on day two of the Brian Chapman.

A novelty to experience

overheating on this climb. Could do with

less traffic though.

16. MattH catches me on the descent. We end up riding the rest of the MC together. Your company is much appreciated.

17. Relief to leave the slightly tedious road normally followed on the Brian Chapman. Relief is short lived as we face some of the toughest climbing of the day. Good views of the Clywedog reservoir make up for the pain.

18. Much needed stop at Llanidloes Spar as the sun sets.

19. A rollercoaster of a road that will become very familiar to all riders

by the end. Makes the Hereford-Monmouth road at the end of the

Brian Chapman look tame.

20. A very welcome welcome from the helpers at the Llanwrtyd village hall at 11:30pm. Not many of us here at this point - the fastest riders are in bed, most of the others still on the road. "Mrs Overall" keeps up the esprit de corps with her deadpan humour. Escorted to camp bed in

sleeping hall where Hummers gives my bed a welcoming pat and reassures me that during the night he is only an arm's reach away.

21. A gradual climb at the start of day two to get us warmed up for the strenuosity to come. It only dawns on me at

the top that we've been on the Brevet Cymru route for a while.

22. We ride with Hummers for a while until the lanes get narrower, the hedges higher and road lumpier. His

Devonian spirit kicks in and he shoots off into the distance. Fellow Devoniab Vorsprung helps us to keep pace, but Hummers remains an occasional speck on the horizon.23. Our first patches of drizzly rain on this leg.

Nothing too unpleasant, but a gentle reminder that Wales is not always sunny and dry.

24. The ups and downs a little steeper now. No landspeed records are broken as we approach Pendine Sands.

25. Never has a control been more appreciated. More egg and beans on toast consumed. We are wary that the toughest stage on the whole ride is yet to come.

26. Steep 20% climbs followed by steep 20% descents, cycle paths and tunnels. Not my favourite kind of riding. The kms tick by very slowly.

28. Ups and downs taking their toll on my achilles which is now challenging my ankles for the widest part of my lower leg. I

stop at a Lloyds pharmacy for some Ibuprofen gel and a rest. Coninue to find that MattH has kindly waited. We continue on the coastal rollercoaster to St Davids with Flatus and Malvolio

29. Get caught up in St David's one way system looking for somewhere to eat. Eventually found a good but slow source of hot chocolate, cake and baguettes.

30. Flatus, MattH and I head off expecting more coastal aerobics but are generally

surprised by the relatively easy going stage as we move inland.

31. Spirits lifted as the rain stops and the evening sun comes out. We are joined by Welshman who is on his first Audax.

32. Fantastic reception from the locals at the Cilgerran pub control. They try

out their joke "Sorry lads, there's no food left", not, I suspect for the first time. 33. I stop to change my GPS batteries

and recharge my own. I'm on my own for the remains of this stage.

36. Arrive at end of day two at 11:45. Quick shower, two pineapple upsidedown puddings and bed. Unlike the previous night, I actually get some sleep. Snoring and farting down to legal levels.

37. A wonderful start to day three with a big climb into the Brecon Beacons. Sun is out, but air is cool and almost no wind. Play leapfrog with Mel who's a steady

climber but demon descender.

38. "Technical" stretch over freshly gravelled steep lanes. Not the last of these we'll see today.

39. Custard slice in West

End cafe

40. Yet another stunning climb up above Llyn Brianne

42. We join the Elenith route at "The Telephone" followed by a great descent

into Tregaron for a Spar stop.

43. Aberystwyth hovers enticingly on the horizon and seems to take an age to arrive.

MattH nearly squished by recklessly overtaking artic.

44. The Aber control feels like a turning point. From here onwards we're heading home, subject to a few scenic diversions.

Sun is at full strength now so climbing will be more of an effort. But really, we've been very lucky with the weather.

45. Great views on both sides as we climb the ridge to Devil's Bridge

46. The Elan valley is a different place in good weather. Magical

rather than threatening. Victorian reservoirs add to the feeling of

otherness here.

47. Final visit to the Llanwrtyd village hall for a quick bite sandwiched between two traversals of the Beulah-coaster that seem to

get easier on each visit.

48. Very strange experience on this long and steady climb in the dark. Cannot tell whether we are going up or down, whether we have a head or tail wind. The GPS tells me we've gained 250m.

49. Arrive at sleep stop at 11:30pm. Hall is empty with two valiant volunteers bracing themselves for the onslaught to come. Very little sleep

tonight as we have be away by 3:30am. Can hardly walk in the morning as both ankles in a state of some disrepair. Cycling seems easier though.

50. Great descent down to Newtown, that even I can go for at full pelt. Am grateful we're not climbing this as we would be on the Brian Chapman.

51. This stage a bit of an early dawn haze, punctuated only by a spell of heavy rain and patches of gravelly road.

52. Meet up with Miniog and Nuncio giving us a much needed morale boost all the way to the finish

53. Arrive at the arrivee at 7:30am in time for several breakfasts. Stiff competition for who looks the most tired.

Vorsprung just takes it from U.N. Dulates in a photo finish.

Mille CymruCast of Characters

The narrator . . . . . . . . . . . . . . . . . . . . . . . . . . . Jo WoodU.N. Dulates . . . . . . . . . . . . . . . . . . . . . . . John HamiltonFlatus . . . . . . . . . . . . . . . . . . . . . . . . . . . James GumbrellHummers . . . . . . . . . . . . . . . . . . . . . . Mark HummerstoneMattH . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Matt HaighVorsprung . . . . . . . . . . . . . . . . . . . . . . . . . Jamie AndrewsMal Volio . . . . . . . . . . . . . . . . . . . . . . . . . Phil ChadwickWelshman . . . . . . . . . . . . . . . . . . . . . . . . . . Sam MorganMel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Mel KirklandMiniog . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Ian SharpeNuncio . . . . . . . . . . . . . . . . . . . . . . . . . . . Simon Spooner

0 25km 50

600m 0

Page 13: Telling Stories with Data Visualisation

story telling models: Part one

Page 14: Telling Stories with Data Visualisation

Dramatic Structure:

A whole is what has a beginning (protasis) and middle (epitasis) and

end (catastrophe).

Aristotle: Poetics, 335 BC

Page 15: Telling Stories with Data Visualisation

Gustav Freytag: Die Technik des Dramas, 1863

Exposition

Climax

Denouement

Page 16: Telling Stories with Data Visualisation

Of the modes of persuasion furnished by the spoken word there are three kinds.

Persuasion is achieved by the speaker's personal character when the speech is so spoken as to make us think him credible. Secondly, persuasion may come through the hearers, when the

speech stirs their emotions. Thirdly, persuasion is effected through the speech itself when we have proved a truth

or an apparent truth by means of the persuasive arguments suitable to the case

in question.

Aristotle: On Rhetoric, 350 BC

Page 17: Telling Stories with Data Visualisation

Of the modes of persuasion furnished by the spoken word there are three kinds.

Persuasion is achieved by the speaker's personal character when the speech is so spoken as to make us think him credible. Secondly, persuasion may come through the hearers, when the

speech stirs their emotions. Thirdly, persuasion is effected through the speech itself when we have proved a truth

or an apparent truth by means of the persuasive arguments suitable to the case

in question.

Aristotle: On Rhetoric, 350 BC

Ethos

Page 18: Telling Stories with Data Visualisation

Of the modes of persuasion furnished by the spoken word there are three kinds.

Persuasion is achieved by the speaker's personal character when the speech is so spoken as to make us think him credible. Secondly, persuasion may come through the hearers, when the

speech stirs their emotions. Thirdly, persuasion is effected through the speech itself when we have proved a truth

or an apparent truth by means of the persuasive arguments suitable to the case

in question.

Aristotle: On Rhetoric, 350 BC

Pathos

Page 19: Telling Stories with Data Visualisation

Of the modes of persuasion furnished by the spoken word there are three kinds.

Persuasion is achieved by the speaker's personal character when the speech is so spoken as to make us think him credible. Secondly, persuasion may come through the hearers, when the

speech stirs their emotions. Thirdly, persuasion is effected through the speech itself when we have proved a truth

or an apparent truth by means of the persuasive arguments suitable to the case

in question.

Aristotle: On Rhetoric, 350 BC

Logos

Page 20: Telling Stories with Data Visualisation

For sale: baby shoes, never worn.

Ernest Hemingway: Shortest story ever told, c.1925

Page 21: Telling Stories with Data Visualisation

See: http://guns.periscopic.com

Page 22: Telling Stories with Data Visualisation

why tell stories?

Page 23: Telling Stories with Data Visualisation

How risky is cycling in London?

Page 24: Telling Stories with Data Visualisation

Pathos

Page 25: Telling Stories with Data Visualisation

Pathos Ethos

Page 26: Telling Stories with Data Visualisation

Logos

Ethos

Pathos

Page 27: Telling Stories with Data Visualisation

Logos

Ethos

Page 28: Telling Stories with Data Visualisation

Logos Ethos

Page 29: Telling Stories with Data Visualisation

0

100

200

300

400

500

600

700

1994 1995 1996 1997 1998 1999 2000 2001 2002 2003 2004 2005 2006 2007 2008 2009 2010 2011 2012 2013

Num

ber o

f inc

iden

ts

Cyclists Killed or Seriously Injured, Greater London Serious Injuries

Fatalities

Page 30: Telling Stories with Data Visualisation

0.0

0.5

1.0

1.5

2.0

2.5

3.0

3.5

4.0

2000 2001 2002 2003 2004 2005 2006 2007 2008 2009 2010 2011 2012 2013

Inci

dent

s pe

r mill

ion

jour

neys

Cyclists KSI per million journeys, Greater London

Serious injuries

Fatalities

Inci

dent

s pe

r mill

ion

jour

neys

Page 31: Telling Stories with Data Visualisation

“denominator neglect”

Page 32: Telling Stories with Data Visualisation

0

50

100

150

200

250

0.0

0.5

1.0

1.5

2.0

2.5

3.0

3.5

4.0

2000 2001 2002 2003 2004 2005 2006 2007 2008 2009 2010 2011 2012 2013

Ann

ual n

umbe

r of j

ourn

eys

(mill

ions

)

Inci

dent

s pe

r mill

ion

jour

neys

Bicycle journeys and KSI rate, Greater London

Serious injuries Fatalities Number of journeys

Page 33: Telling Stories with Data Visualisation

Exercise: Redesign the KSI data visualization(s) using storytelling elements to help answer the question: “How risky is cycling in London?”

Page 34: Telling Stories with Data Visualisation

A  human  scale  of  representa1on:  Isotype  (early  20th  century  approach  of  depic1ng  sta1s1cs  as  pictograms).    See  h>p://www.gicentre.net/blog/2013/11/24/risk-­‐cycling-­‐and-­‐denominator-­‐neglect    

Page 35: Telling Stories with Data Visualisation
Page 36: Telling Stories with Data Visualisation
Page 37: Telling Stories with Data Visualisation
Page 38: Telling Stories with Data Visualisation
Page 39: Telling Stories with Data Visualisation

In 2012 there was one serious injury for every 0.3 million bicycle journeys made.

Page 40: Telling Stories with Data Visualisation
Page 41: Telling Stories with Data Visualisation

What are the chances of being killed if you make a bicycle journey tomorrow?

Page 42: Telling Stories with Data Visualisation
Page 43: Telling Stories with Data Visualisation
Page 44: Telling Stories with Data Visualisation
Page 45: Telling Stories with Data Visualisation
Page 46: Telling Stories with Data Visualisation

stories place you, the audience, in the picture

Page 47: Telling Stories with Data Visualisation

See http://www.nytimes.com/interactive/2012/08/05/sports/olympics/the-100-meter-dash-one-race-every-medalist-ever.html

Page 48: Telling Stories with Data Visualisation

A conventional ‘heat map’ showing densities of ball position from pitcher Mariano Rivera. This may be a data visualization, but it is not a story. To see how the New York Times created a story from these data, see

http://www.nytimes.com/interactive/2010/06/29/magazine/rivera-pitches.html?ref=magazine

Page 49: Telling Stories with Data Visualisation

stories can surprise by changing perspective

Page 50: Telling Stories with Data Visualisation
Page 51: Telling Stories with Data Visualisation
Page 52: Telling Stories with Data Visualisation

the individual in the crowd

We’ve seen several examples of this already (London-Edinburgh-London cycle event, Periscopic’s ‘Gun Deaths’ visualization, Rivero’s pitches etc. This form of story telling can support ‘exposition’ and emphasise ‘pathos’.

Page 53: Telling Stories with Data Visualisation

‘We Are the City’ exhibition, Museum of London, 2013 - see http://gicentre.org/watc

Page 54: Telling Stories with Data Visualisation
Page 55: Telling Stories with Data Visualisation

https://vimeo.com/66477874

Page 56: Telling Stories with Data Visualisation

hearing the voice in data visualization

Page 57: Telling Stories with Data Visualisation

A standard Google Maps view of London may contain data, or even have a distinct visual style, but it has little of an ‘authored voice’.

Page 58: Telling Stories with Data Visualisation

Stamen Design’s watercolour maps using OpenStreeMap. See http://content.stamen.com/watercolor_process and http://maps.stamen.com/watercolor/#15/51.5221/-0.0719

Page 59: Telling Stories with Data Visualisation

For (computer simulated) hand drawn visualization, see http://www.gicentre.net/software/#/handy/

Page 60: Telling Stories with Data Visualisation

story telling models: Part two

Page 61: Telling Stories with Data Visualisation

situation complication resolution

likable hero encounters barriers emerges transformed

The Universal Story

Hey! That was my idea!

Exposition

Climax

Denouement

Page 62: Telling Stories with Data Visualisation

The Contour of Communication (Duarte 2010)

what is

what could be what could be reward

what is what is

call to action

call to adventure

Page 63: Telling Stories with Data Visualisation

Author- and reader- driven stories (Segal and Heer 2010)

Martini glass

Interactive slideshow

Drill-down

See http://vis.stanford.edu/papers/narrative

Page 64: Telling Stories with Data Visualisation

Panel-to-panel transitions from comic book drawing. Source: Scott McCloud (2006) Making Comics

Page 65: Telling Stories with Data Visualisation

0

50

100

150

200

250

300

350

400

450

Britai

n Ger

many

France

Un

ited S

tates

Italy

Polan

d Net

herlan

ds Jap

an

Irelan

d Spa

in Can

ada

Sweden

Den

mark

Finlan

d Swi

tzerla

nd

Greece

Aus

tralia

Bel

gium

India

Taiwa

n Sou

th Afri

ca Aus

tria

Sloven

ia Bra

zil

Singap

ore

Russia

Bul

garia

Croati

a Uzb

ekista

n Chi

na

Norwa

y Tim

or-Lest

e Col

ombia

Bel

arus

Loughton

Edinburgh

Great Easton

St Ives

KirtonMarket Rasen

PocklingtonThirsk

Barnard Cast le

Brampton

Moffat

TraquairN

W

E

600melevation

50 km

London - Edin burgh - London Info Sketches

Eskdalemuir

6%Proportion of starters who were women

22%Proportion of starters who did not make it to the end

within time limit

All graphics based on data collected from digital records of riders arriving at each control. Some records may be missing and summary figures are approximate only. Thanks to Danial Webb and Alex Greenbank for providing raw data during and after the event.. For interactive versions of these graphics, see http://gicentre.org/lel2013

7%Proportion of finishers who were women

Number of finishers by nationality 43%

Proportion of ridersfrom the UK

Time in hand for each rider at each control. Blue lines indicate finishers within time limit; red show non finishers.

Spread of riders at 3pm on day one and day three

Number of DNF by nationality

26Number of starters

from Poland

51 hrs 11 mins

Time between first and last finishers

13.6 km/h

Average speed, including all stops, of all finishers

Average speed, including all stops,of first finisher

21.7 km/h

Relative position of every rider. DNFs shown in red.

Jo Wood, Sept 2013

26Number of finishers from Poland

N u m

b e r

o f

R i d e

r sT I

M E

I N H

A N D

( H O U

R S )

5040302010

01020304050

50

45

40

35

30

25

20

15

10

5

0

-5

Tue 30th JulySun 28th July

Fastest

AveragePosition

Fu!Value

Lought

on

St. Iv

es

Kirton

Marke

t Rase

n

Pockli

ngton

Thirsk

Barna

rd Ca

stle

Bramp

ton

Moffa

t

Edinb

urgh

Traqu

air

Eskda

lemuir

Bramp

ton

Barna

rd Ca

stle

Thirsk

Pockli

ngton

Marke

t Rase

n

Kirton

St. Iv

es

Great

Easto

n

Lought

on

Lought

on

St. Iv

es

Kirton

Marke

t Rase

n

Pockli

ngton

Thirsk

Barna

rd Ca

stle

Bramp

ton

Moffa

t

Edinb

urgh

Traqu

air

Eskda

lemuir

Bramp

ton

Barna

rd Ca

stle

Thirsk

Pockli

ngton

Marke

t Rase

n

Kirton

St. Iv

es

Great

Easto

n

Lought

on

Lought

on

St. Iv

es

Kirton

Marke

t Rase

n

Pockli

ngton

Thirsk

Barna

rd Ca

stle

Bramp

ton

Moffa

t

Edinb

urgh

Traqu

air

Eskda

lemuir

Bramp

ton

Barna

rd Ca

stle

Thirsk

Pockli

ngton

Marke

t Rase

n

Kirton

St. Iv

es

Great

Easto

n

Lought

on

moment-to-moment increases suspense ;slows action down; catches small changes.

See https://vimeo.com/73026163

Page 66: Telling Stories with Data Visualisation

action-to-action Moves narrative forward; emphasises cause and effect

Page 67: Telling Stories with Data Visualisation

subject-to-subject Changes angle to support comparison

Alphabetic bias in voting habits: See http://www.gicentre.net/featuredpapers/#/woodballotmaps2011

Page 68: Telling Stories with Data Visualisation
Page 69: Telling Stories with Data Visualisation

scene-to-scene Encourages deductive reasoning to provide an explanation for the link between scenes.

Page 70: Telling Stories with Data Visualisation

Source: http://eagereyes.org/blog/2013/golden-age-information-graphics

aspect-to-aspect Holds time still; encourages contemplation.

Common in the ‘infographic’ paradigm.

Page 71: Telling Stories with Data Visualisation

one final example…

Page 72: Telling Stories with Data Visualisation

We can’t talk about data-driven story telling without considering one of the best at the craft – Hans Rosling. In the following video, how many of the story telling ideas we’ve discussed in the last hour or so he uses in these 4 minutes:? Story-structure; pathos, ethos, logos; repetition; contour of communication; placing the reader in the picture; transition types; authorship. See video at : http://youtu.be/jbkSRLYSojo

Page 73: Telling Stories with Data Visualisation

xkcd.com/904

Page 74: Telling Stories with Data Visualisation

Stories should probably have an

ending

Page 75: Telling Stories with Data Visualisation

So I’ll leave you with this “call to action”…

Page 76: Telling Stories with Data Visualisation

Next time You create a data Visualization, try adding one or more of these

storytelling elements

Page 77: Telling Stories with Data Visualisation

Further reading

And some useful technologies: Tableau: http://www.tableausoftware.com

Processing: http://processing.org D3: http://d3js.org

Ellipsis: http://idl.cs.washington.edu/projects/ellipsis