The Climate Evolution Will Be Visualized

E7ab9c918935168aae0bd07b503b9284?s=47 Geoff McGhee
December 06, 2017
14

The Climate Evolution Will Be Visualized

Presentation to Monterey Bay Aquarium Research Institute, Dec. 6, 2017

E7ab9c918935168aae0bd07b503b9284?s=128

Geoff McGhee

December 06, 2017
Tweet

Transcript

  1. The Climate Evolution Will Be Visualized Geoff McGhee Bill Lane

    Center for the American West, Stanford U. Monterey Bay Aquarium Research Institute December 6, 2017
  2. Robert Simmon/Planet Lets start out with this table of numbers

    – atmospheric CO2 measured at Moana Kea observatory.
  3. Robert Simmon/Planet And of course here we are when you

    turn it into a chart where the trendline is clear - thank you Robert Simmon for this juxtaposition!
  4. Robert Simmon/Planet

  5. A Decade in News Media ME Well, that's how I

    felt about written news reports back in the 90's. That it was too hard to divine the signal from all the noise, and that important stories, world-changing stories, were being ignored because... why? Because they were "boring." Too much text. Too much back story. Too small an incremental change to get interested. No relevance to me. I had been working for a foundation that supported policy research into the meaty topics of the immediate post cold war era, an era of globalization and liberalization. Tax policy; labor and environmental standards; intellectual property rights; All of this stuff was going to change the world we lived in and most people were just going to ignore it. What would happen when the average person saw the world around them changed, radically? (I think we know what happened) Along came the web. Well, honestly, first came CD-Roms, but I won't bore you with that. I got the notion, what if we could make news and information come alive with multimedia and interactivity?
  6. 2000: ABCNEWS4KIDS

  7. 2002: The New York Times But also this – which

    also indicates how the news needle moved – from needing to expose the hidden stories, the invisible, the “boring,” that things got catastrophically “interesting” – war, civilizational clashes, national emergencies, political division, natural and unnatural disasters from the Indian Ocean tsunami to Katrina.
  8. (The NYT Continued Without Me) Now, on one hand, the

    “explain the world” idea kind of went nowhere, right? Because the world stayed complex, and the complexity blind-sided us with the recession of 2008, the trade deficit and hollowing out of the middle class; and populist uprisings that led to Brexit and some pretty dramatic changes here at home in the US. On the other hand, I had a role in helping start the nytimes interactive graphics and multimedia desk. Along with some others, they've since become – without my help – the gold standard in information presentation for a wide audience. The field of data journalism has come into focus, something I did a documentary film about in 2010.
  9. Journalism in the Age of Data Geoff McGhee, 2010 datajournalism.stanford.edu

  10. • Big data and data visualization are changing news reporting

    and presentation • New players and skillsets are joining newsrooms • We need to learn more about telling stories with data • Good tools for narrative visualization don’t exist yet Journalism in the Age of Data (2010) datajournalism.stanford.edu
  11. But during my fellowship year, I got to know the

    ecosystem of research institutes on campus – places that were, at a low public profile, producing interesting research. And also starting to use the same digital tools we were struggling to learn in the news. That's when one side project led to the job that I still have today.
  12. The Bill Lane Center is an interdisciplinary research center started

    by two prominent historians, David M. Kennedy and Richard White. Since 2013 our director has been the political scientist Bruce Cain.
  13. • Environment and Resources • Economy and Public Policy •

    History and Culture of the West • Data visualization and multimedia for scholarship, outreach, journalism Core Issue Areas http://west.stanford.edu Our core issue areas are pretty clear, but broad enough to enable us to be opportunistic. And there's a fourth area, that I consider my main preoccupation: using data visualization and multimedia for scholarship, outreach, and journalism.
  14. The western part of north america is a pretty big

    place. And dealing with the issues of this vast area require many different types of domain expertise.
  15. Which is why we rely heavily on collaboration with other

    institutes at Stanford – of which there are MANY.
  16. Public Opinion on Wind Turbines Looking at Two Droughts, Models

    Suggest News Media Coverage is Associated With Water Conservation Climate Action Plans News Media Coverage and Water Conservation Conventional Research Projects California Coastal Commission And as you might expect, I help out with more traditional research collaborations: water conservation and media, wind turbine opinions, climate adaptation plans, studies of government agencies like the California Coastal Commission.
  17. Data Visualization and Multimedia But I've also done a fair

    amount of data vis and multimedia connected to those studies.And while we started out doing more in partnership with other organizations, like KQED, High Country News, Harpers',
  18. Original Journalism Work ’…& the West’ blog We're now doing

    original journalism projects, much of it done with my present and former colleague, Felicity Barringer. This is our "...& the West" blog, which just turned a year old. We look for stories across the American West, particularly those with an environmental or public health connection. west.stanford.edu/news/blogs/and-the-west-blog
  19. ’…& the West’ blog Here's one we did on salmon

    fisheries and their effect on enviornmental protection in Washington State.
  20. ’…& the West’ blog

  21. ’…& the West’ blog

  22. ’…& the West’ blog And looking at the role of

    the Supreme Court in allocating Colorado River water. What if California had won, not lost, a 1963 case?
  23. ’…& the West’ blog

  24. How do we ENGAGE people?

  25. Visual Explanations

  26. Bill Lane Center/Water in the West

  27. Bill Lane Center/Water in the West

  28. Bill Lane Center/KQED

  29. Interactivity

  30. ’…& the West’ blog

  31. ’…& the West’ blog

  32. ’…& the West’ blog

  33. CA Crops ’…& the West’ blog

  34. Trackers/Dashboards

  35. None
  36. Bill Lane Center for the American West and EcoWest

  37. Bill Lane Center for the American West and EcoWest

  38. Updates fire perimeters and smoke estimates 3x day Thousands of

    fire animations dating back to 2003 Can zoom to and embed fire animation or state overview Mobile-tolerant responsive layout works at multiple sizes Bill Lane Center for the American West and EcoWest
  39. Sharability Designed for syndication Bill Lane Center for the American

    West and EcoWest
  40. Groundwater Dashboard Bill Lane Center/Water in the West

  41. Why Data Visualization?

  42. • “Utilizes one of the channels to our brain that

    have the highest bandwidths: our eyes”
 – Robert Kosara • Bypass language centers, go direct to the visual cortex • Leverage ability to recognize patterns, visual sense-making • Create mental models of phenomena… both literal and metaphorical Map of New Brainland by Unit Seven via Flickr How Visualization Works Why Visualize Information?
  43. Literal

  44. Fernanda Viegas and Martin Wattenberg

  45. Metaphorical

  46. The New York Times

  47. Literal

  48. National Geographic

  49. Metaphorical

  50. The New York Times

  51. • Converting – “encoding” – information into graphical marks •

    Charts, yes, but something more fundamental Lines, shapes, patterns, size, position, shade, hue • The “charts” we know are compounds of those marks How Visualization Works Visual Encoding of Information Company A Company B Company C $110 86 62 Sales Name Million
  52. Classical visualizations were essentially done “by seat of the pants”

    Creators intuited what would work, and it mostly did 20th Century researchers analyzed patterns and put 
 practices to the test Bertin, Cleveland, Mackinlay et al. How Visualization Works Visual Encoding of Information Sémiologie Graphique
 Jacques Bertin, 1967 Graphical Perception
 Cleveland and McGill, 1984 Structure of Design Space
 Card and Mackinlay, 1997
  53. HOW IT WORKS

  54. How Visualization Works Visual Encoding of Information The two kinds

    of graphical perception: Attentive Preattentive
  55. How Many Number 5’s? Preattentive Processing

  56. Now How Many? Preattentive Processing

  57. • We’re much better at quickly detecting SHADE variations than

    SHAPE differences • First example required reading, because complex shape of a numeral like “5” is an attentive attribute. • Second example: “5’s” are clearly visible when we highlight them in a different shade. Intensity of color is a preattentive attribute. This rapidly occurs below the level of consciousness. • When you find yourself actually reading a chart to try to understand what it says, that’s attentive processing Preattentive Processing How Visualization Works
  58. Preattentive Attributes Can be organized into four main categories: Source:

    Colin Ware: “Information Visualization: Perception for Design” (2004) Preattentive Processing How Visualization Works Color Form Position Movement
  59. Not All Preattentive Attributes Behave the Same Way All preattentive

    attributes can indicate distinctness, but not all have a clear hierarchy that can be utilized for comparing values.
 • Quantitative or Ordinal Values: 
 1, 2, 3... or S, M, L... 
 Operators =,≠,<,> • Categorical Values: 
 N, S, E, W... Apples, Oranges
 Operators =,≠ > > ? Using Scales to Show Hierarchy How Visualization Works
  60. Pie Angle Size (area)
 Hue or intensity (opt.) Bar/Column Size

    (length of bar) Hue or intensity (opt.) 2D position (neg vals.) Line 2D Position Hue or intensity (for mult. lines) Scatter Plot 2D Position Hue or intensity (opt.) Added marks (icons, etc) Company A Company B Company C $110 86 62 Sales Name Million Text Table Text (yes, text) Numbers 2D Position Added marks (rules, bgs) Bubble Size (area) Hue or intensity 2D Position Network Graph 2D Position Added marks How Visualization Works Charts: Visual Encoding at Work
  61. Data Vis at Work

  62. “I think that there’s a sense that data [visualization] is

    something more like a medium, something that can be used to tell stories, and to do all of the things that a medium can do, to delight and inspire...” – Eric Rodenbeck, Journalism in the Age of Data (2010)
 datajournalism.stanford.edu
  63. But...

  64. http://bit.ly/286Rmmq

  65. http://bit.ly/1NH3q5Q

  66. Learning to Tell Stories “You can do beautiful things with

    computers and lots of data that look very, very nice, and are almost completely incomprehensible.” datajournalism.stanford.edu
  67. Communication Medium?

  68. None
  69. Ways to communicate with data 1. Explain Your Visual Encodings

    to the User
  70. Explain Your Encodings with a Legend, Key, Scale

  71. None
  72. Ways to communicate with data 2. Reduce Noise

  73. Practice Noise Reduction: The “Data-Ink Ratio” https://darkhorseanalytics.com/blog/data-looks-better-naked/

  74. Rainbow palette is popular in scientific visualization But it lacks

    a visual hierarchy Practice Noise Reduction: Clarity in Symbology
  75. Ways to communicate with data 3. Use Narrative Sequences to

    Tell a Story
  76. The “Stepper” Present Main Points of a Visualization in a

    Sequence http://stanford.io/25zXkdc
  77. “Scrollytelling” Present Main Points of a Visualization in a Sequence

    http://stanford.io/1lZ1vXO
  78. Other Narrative Formats Simulators and Models http://stanford.io/1lZ1vXO

  79. Other Narrative Formats Simulators and Models http://projects.aljazeera.com/2013/syrias-refugees/index.html

  80. Ways to communicate with data 4. Annotate Liberally to Explain

    What’s Shown
  81. • As powerful as visualization can be to enable rapid

    sense-making, many visualizations require a lot of context and interpretation, especially static, printed visualizations. • Think of the annotation layer as like the narrator’s voiceover in a documentary film. In fact, if you make a motion video, that might literally what it would be. Raise Your Narrative Voice The New York Times The Annotation Layer
  82. http://nyti.ms/1qfwceV

  83. http://nyti.ms/1qfwceV

  84. Ways to communicate with data 5. Where Possible, Offer Record-Level

    Detail
  85. • Also known as “details on demand,” interactive visualizations are

    richer when they give you as much info as possible on individual measures • In that sense, they are database front-ends in addition to graphical summaries. Visualizations are Databases Where Possible, Offer Record-Level Detail
  86. Where Possible, Offer Record-Level Detail

  87. http://citynature.stanford.edu/ Where Possible, Offer Record-Level Detail

  88. http://citynature.stanford.edu/ Where Possible, Offer Record-Level Detail

  89. Ways to communicate with data 1. Explain Your Symbology/Visual Encodings

    to the User 2. Reduce Noise 3. Use Narrative Sequences to Tell a Story 4. Annotate Liberally to Explain What’s Shown 5. Where Possible, Offer Record-Level Detail
  90. Last 6.5 mm Problem

  91. Graphic detail Daily chart America’s flat-Earth movement appears to be

    growing Is NASA covering up the truth? No Graphic detail Nov 28th 2017 | by THE DATA TEAM IT IS a stunt worthy of Evel Knievel. This week, if all goes to plan, “Mad” Mike Hughes, a Californian, will launch himself 1,800 feet (550 metres) into the sky in a homemade steam-powered rocket made of scrap metal. As well as providing entertainment, Mr Hughes wants to prove a point. On his trip over the Mojave The Economist
  92. The Economist

  93. None
  94. None
  95. Kevin Pluck

  96. Bloomberg Business Week

  97. Washington Post

  98. None
  99. Questions? @mcgeoff gmcghee@stanford.edu west.stanford.edu 


  100. Thank you! @mcgeoff gmcghee@stanford.edu west.stanford.edu