From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

36
From Data Journalism to Data Illustration Visualizing Data with JavaScript at Twitter Nicolas Garcia Belmonte / @philogb

TAGS:

Transcript of From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Page 1: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

From Data Journalism to Data Illustration

!

Visualizing Data with JavaScript at Twitter

Nicolas Garcia Belmonte / @philogb

Page 2: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

https://interactive.twitter.com/

https://interactive.twitter.com
Page 3: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Platform !

Global / Real-Time / Conversational

Page 4: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Verticals !

Government / News / Sports / TV / Music

Page 5: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Tone of the Visualization !

Narrative / Exploratory / Expositive / Fun

Page 6: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Government !

Page 7: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

State of the Union Address

SVG + CANVAS

http://twitter.github.io/interactive/sotu2014/
http://twitter.github.io/interactive/sotu2014/
Page 8: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Visual Display

Page 9: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Visual Display

Page 10: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Visual Display

Page 11: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Visual Display

Page 12: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter
Page 13: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Web of Influence on

TwitterCANVAS

https://interactive.twitter.com/election2014/
https://interactive.twitter.com/election2014/
Page 14: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Brazil ElectionsSVG

https://interactive.twitter.com/brazil2014/
https://interactive.twitter.com/brazil2014/
Page 15: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

News !

Page 16: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Typhoon Haiyan

CANVAS !

http://twitter.github.io/interactive/philippines/
http://twitter.github.io/interactive/philippines/
Page 17: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Visual Display

Page 18: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Visual Display

Page 19: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Visual Display

Page 20: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Visual Display

Page 21: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Visual Display

Page 22: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Visual Display

Page 23: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Visual Display

http://github.com/philogb/mingle

http://philogb.github.io/mingle/examples/ier/
http://philogb.github.io/mingle/examples/ier/
http://github.com/philogb/mingle
Page 24: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Sports !

Page 25: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

World CupCANVAS + SVG

https://interactive.twitter.com/wccompetitree/
https://interactive.twitter.com/wccompetitree/
Page 26: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

World CupCANVAS + SVG

https://interactive.twitter.com/wcmentions/
https://interactive.twitter.com/wcmentions/
Page 27: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

When to use WebGL ?

Page 28: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

COOL FACTOR

Page 29: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

#CannesLions

http://philogb.github.io/cannes-lions
Page 30: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Interactive Experiences

http://philogb.github.io/laika
Page 31: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

WebGL Insights http://webglinsights.blogspot.com/

!

!

Page 32: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter
http://philogb.github.io/page/temperature-anomalies
Page 33: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter
http://philogb.github.io/page/color-cube
Page 34: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Key Takeaways !

Page 35: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter
Page 36: From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

@philogb

https://interactive.twitter.com/

https://interactive.twitter.com/

Data journalism

Data journalism

Visualizing news - The future of journalism Cardiff 2013

Visualizing news - The future of journalism Cardiff 2013

Visualizing and Presenting Data

Visualizing and Presenting Data

Visualizing Census Data

Visualizing Census Data

Visualizing Health Data

Visualizing Health Data

Visualizing Dimensionally-Reduced Data

Visualizing Dimensionally-Reduced Data

Visualizing Tabular Data

Visualizing Tabular Data

Visualizing data spring2012

Visualizing data spring2012

Visualizing Library Data

Visualizing Library Data

Visualizing Data - Open Data PH talk

Visualizing Data - Open Data PH talk

Visualizing Rent Manager Data

Visualizing Rent Manager Data

Visualizing Textual Data

Visualizing Textual Data

Data Journalism (City Online Journalism wk8)

Data Journalism (City Online Journalism wk8)

Visualizing Data: An Economists’ Guide to Showing the … visualizing data...Visualizing Data: An Economists’ Guide to Presenting Data Jonathan A. Schwabish Congressional Budget

Visualizing Data: An Economists’ Guide to Showing the … visualizing data...Visualizing Data: An Economists’ Guide to Presenting Data Jonathan A. Schwabish Congressional Budget

From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

From Data Journalism to Data Illustration - Visualizing Data with JavaScript at Twitter

Visualizing spatial data

Visualizing spatial data

Lincoln Journalism Research Day - Data Journalism

Lincoln Journalism Research Day - Data Journalism

Visualizing Data Effectively

Visualizing Data Effectively

Visualizing data

Visualizing data

Data journalism without data

Data journalism without data