Information graphics & data visualization Why visualize? - - PowerPoint PPT Presentation

▶
information graphics amp data visualization why visualize
SMART_READER_LITE
LIVE PREVIEW

Information graphics & data visualization Why visualize? - - PowerPoint PPT Presentation

Sep 11, 2023 237 likes •832 views

Design & Presentation Information graphics & data visualization Why visualize? Show patterns Identify trends and outliers Communicate relationships Allow readers to discover for themselves or to search for interesting or specic

slide-1
SLIDE 1

Design & Presentation

Information graphics & data visualization

slide-2
SLIDE 2

Why visualize?

Show patterns Identify trends and outliers Communicate relationships Allow readers to discover for themselves or to search for interesting or specic data points in a larger eld Get a better understanding of data & inspire new questions for further exploration

Via Designing Data Visualization

slide-3
SLIDE 3

John Snow's map of London cholera deaths, 1854

Via University of York

slide-4
SLIDE 4

Show patterns

Via Wall Street Journal

slide-5
SLIDE 5

Identify trends …

Via NASA

slide-6
SLIDE 6

… and outliers

Via New York Times

slide-7
SLIDE 7

Communicate relationships

Via Washington Post

slide-8
SLIDE 8

Let the reader discover the point …

Via The Guardian

slide-9
SLIDE 9

… or let them explore

Via ProPublica

slide-10
SLIDE 10

Terminology

Infographics v. data visualization

slide-11
SLIDE 11

Infographics are …

manually drawn (more like illustrations) aesthetically rich (strong visual content meant to draw the eye and hold interest) relatively data-poor (because all info must be manually encoded)

Via Designing Data Visualization

slide-12
SLIDE 12

Via GOOD magazine

slide-13
SLIDE 13

Data visualizations are …

algorithmically drawn (may have custom touches but is largely rendered with the help of a computer)

  • ften less decorative

relatively data-rich (large volumes of data are welcome and viable)

Via Designing Data Visualization

slide-14
SLIDE 14

Via The Guardian

slide-15
SLIDE 15

But many interactive projects and graphics are somewhere in between! (Our outside this categorization entirely)

slide-16
SLIDE 16

Via The Guardian

slide-17
SLIDE 17

Via The Guardian

slide-18
SLIDE 18

So you want to visualize some data?

slide-19
SLIDE 19
slide-20
SLIDE 20

Basic charts types

  • Bar/column
  • Line
  • Pie
slide-21
SLIDE 21

Bar chart

Via Quartz

slide-22
SLIDE 22

Column chart

Via FiveThirtyEight

Save
slide-23
SLIDE 23

Pro-tip: don't truncate your y-axis!

Via Heap Analytics

slide-24
SLIDE 24

Line chart

Via Quartz

slide-25
SLIDE 25

Via New York Times

slide-26
SLIDE 26

Pro-tip: you might want to truncate your y-axis*

*( ) a contentious subject

Via Quartz

slide-27
SLIDE 27

Pie chart

Via Business Insider

slide-28
SLIDE 28

Pro-tip: too many slices will make your stomach hurt

Via New York Times

slide-29
SLIDE 29

Pro-tip: you can't have more than 100% of a pie

Via Heap Analytics

slide-30
SLIDE 30

Pro-tip: people are bad at comparing areas

Via The Economist

slide-31
SLIDE 31

Other chart types to keep in mind …

slide-32
SLIDE 32

Area chart

Via WSJ

slide-33
SLIDE 33

Via New York Times

slide-34
SLIDE 34

Pro-tip: area v. line

Via Visual.ly

slide-35
SLIDE 35

Stacked bar chart

Via ProPublica

slide-36
SLIDE 36

Via ProPublica

slide-37
SLIDE 37

Via R Bloggers

slide-38
SLIDE 38

Chart-design basics

  • Labels and alignment
  • Color
slide-39
SLIDE 39

Link for gif

slide-40
SLIDE 40

Link for gif

slide-41
SLIDE 41

Link for gif

slide-42
SLIDE 42

Tools:

Chartbuilder

https://quartz.github.io/Chartbuilder/

Highcharts

http://www.highcharts.com/

slide-43
SLIDE 43

Basic map types

  • categorical
  • choropleth
  • dot density
slide-44
SLIDE 44

Categorical map

Via Wall Street Journal

slide-45
SLIDE 45

Choropleth map(s)

Via Washington Post

slide-46
SLIDE 46

Pro-tip: use choropleth for standardized data

Via Directions Magazine

slide-47
SLIDE 47

Dot density map

Via New York Times

slide-48
SLIDE 48

Pin map (now ubiquitous)

Via Yelp

slide-49
SLIDE 49

How to use (and not abuse) color on maps

slide-50
SLIDE 50

Via Eager Eyes

slide-51
SLIDE 51

Via Mapbox

slide-52
SLIDE 52

Via Penn State

slide-53
SLIDE 53

Via Princeton

slide-54
SLIDE 54

Via VOX

slide-55
SLIDE 55

Pro-tip: test for colorblindness!

Via VizWiz

slide-56
SLIDE 56

Tools:

Carto

https://carto.com

slide-57
SLIDE 57

The end!

Keep in touch: nadja.popovich@journalism.cuny.edu