a typology for data visualization on the web

Download A Typology for Data Visualization on the Web

If you can't read please download the document

Upload: ana-figueiras

Post on 16-Apr-2017

874 views

Category:

Design


1 download

TRANSCRIPT

A Typology for Data Visualization on the Web

Ana FigueirasFCSH Universidade Nova de Lisboa

Visualizations or Infographics - All types of structured representation of information (graphs, diagrams, maps, information ilustrations, etc.)

Challenges Informative Efficient Aesthetic Stepping outside default formats Introducing storytelling Conveying huge sets of data Animation Available techniques Modern data formats and data sets Visualizing complex information...

Why it is important to have a typology for visualizations?Understanding all the pieces that compose a visualization and being able to classify visualizations is important to evaluate the progress of the maturing visualization eld, to help focus and direct future research and to help creating better visualizations that make use of the elements that are essential for a visualization to be successful.

Edward Segel and Jeffrey HeerMagazine style; Annotated chart; Partitioned poster; Flow chart; Comic strip; Slide show; Film/video/animation

Nichani and RajamanickamNarrative; Instructive; Explorative; Simulative

Ian Bogost, Simon Ferrari and Bobby SchweizerGraphs; Sequential graphics; Maps; Diagrams

Typology

200 visualizations

11 types or genres of data visualization

Narrative elementsCaptions; annotations; introductory text; accompany article; text; title; audio narration; video narration.

Reading/viewing orderLinear; user-directed path.

Visual elementsTimeline; photograph; bar chart; pie chart; doughnut chart; line chart; bubble chart; area chart; histogram; network diagram; Venn diagram; tree diagram; object size representing quantities; map; bubble map; pictogram; drawing; speech balloon; model; table; logo; video; scale; exploded view; tag cloud; pyramid; animation.

Interactive elementsinput box; user contribution; slide show; navigation buttons; scroll bar; objects reaction to mouse movement; search; filtering; zoom; click details; click highlight; hover highlight; hover details; link to external article; drag objects; game mechanics.

Sequential GraphicDrawing

Slide ShowVideo/Animation

Chart/DiagramPhotograph

MapPoster

Tag CloudGame

Model

Which elements are more prominent and which influence more the interaction that the viewer/user has with the visualization?

Video

Map

Bar charts

Animation

Pie charts

A Week of Check-ins on the Path to One Billion

Ground Zero Now

Video

Exploded view

Model

Make your own hurricane

Map

Animation

Scale

Game

Case Studies

UK riots timeline by The Guardian

The World of Seven Billion by National Geographic

Death penalty statistics, country by country by The Guardian

Home and Away: Iraq and Afghanistan War Casualties by CNN

What Does China Censor Online? by David McCandless

Ground Zero Now by The New York Times

How Many Households Are Like Yours? by The New York Times

A Week of Check-ins on the Path to One Billion by Foursquare

100 Years of World Cuisine by Clara Kayser-Bril, Nicolas Kayser-Bril and Marion Kotlarski

How Local News Is Going Mobile Infographic by Column Five Media

SPENT by McKinney

Recap: How can we identify the types of visualizations?

Identify what influences the interaction that the user/viewer has with the visualization

Identify which visual elements are more prominent on the visualization

Ana [email protected]@afigueiras