Download - Infographics

Transcript
Page 1: Infographics

All sections to appear here

5

4

InfographicsThe power of numbers and design language

#mspdays #infographics

Page 2: Infographics

Nikita LukianetsUkraine, UX, Hitchhike, Start-up, Design, Web, @nikiluk

https://www.facebook.com/UXNext

Page 3: Infographics

Data, Information, Knowledge

lat. informatio — explanation;gr. γραφικος — illustrative

Page 4: Infographics
Page 5: Infographics
Page 6: Infographics

Things and Signs

The inspiration is not selling, But you can make a bit from text

/Talk of poet and a bookseller/“

Page 7: Infographics

Tărtăria tablets [5500 BC]

Page 8: Infographics

Mapping. Dynamics + Distribution

Page 9: Infographics

Heat Map

Page 10: Infographics

Heat Map

Page 11: Infographics

Inclusion

Page 12: Infographics

Scale

Page 13: Infographics

Mapping - comparison

Page 14: Infographics

Process )

Page 15: Infographics

Needs

Page 16: Infographics

Or this way

Page 17: Infographics

http://www.elmundo.es/

Page 18: Infographics

Structure

Page 19: Infographics

Chernoff Faces

The Use of Faces to Represent Points in K-Dimensional Space Graphically, by Herman Chernoff © 1973 American Statistical Association.

Page 20: Infographics

Coffee is different

Page 21: Infographics

Scaling

Page 22: Infographics

Trees

©Nikita Lukianets, LimeJam

Page 23: Infographics

All-in-one

Page 24: Infographics

Comics

Page 25: Infographics

Choosing the right visualization type

Page 26: Infographics

Project Crescent

Crescent (in SQL Server Denali)

http://sharepoint/sites/crescent/SitePages/Welcome.aspx

Page 27: Infographics

Geo-mapping

ImapBuilder - http://www.imapbuilder.com/

amMap - http://www.ammap.com/

Page 28: Infographics

Affinity analysis

©Nikita Lukianets, LimeJam

Touch Graphhttp://www.touchgraph.com

Page 29: Infographics

Fraze-frequency analysis

©Nikita Lukianets, LimeJam

Wordle Text Cloudshttp://www.wordle.net/

Page 30: Infographics

Bin connection analysis

©Nikita Lukianets, LimeJam

GATE – General Architecture for Text Engineering, IBM many Eyeshttp://gate.ac.uk/

Page 31: Infographics

Using Isotype Pictograms

lat. pictus — drawgr. γράμμα — mark

Keywords: Isotype, Vienna method, Otto Neurath & Gerd Arntz

Page 32: Infographics

Numbers and Meanings

360

Page 33: Infographics

Color Grades

COLOURlovershttp://www.colourlovers.com

Kuler Adobehttp://kuler.adobe.com/

Page 34: Infographics

What to Read?

Books1. Tufte, Edward R. «The Visual Display of Quantitative Information» (2nd

edition, 2001, Cheshire, CT: Graphics Press; ISBN 0961392142: PDF, 12,7 Mb)

2. "Gesellschaft und Wirtschaft. Bildstatistisches Elementarwerk" (PDF, 14.9 Mb)

3. "Modern Man in the Making" (PDF, 17.2 Mb)

4. Petrenko V.F. Basic Psychosemantics. 2-nd edition.

5. Willard Cope Brinton – Graphic Presentation

Web

6. http://visualcomplexity.com7. http://www.flickr.com/groups/infografias/8. http://infographer.ru

Page 35: Infographics

How?

1. Define objects and Structure2. Define relationships3. Sequence of actions, Events4. Quantitative criteria5. Model-Presentation

Page 36: Infographics

TUFTE rules

1. Compare, show difference.

2. Show structure and mechanisms.

3. Use polivariative data, at least 2 dimensions.

4. Get to full integration of text, numbers, graphics.

5. Show sources and metadata.

6. Remember about content, it’s core.

Page 37: Infographics

Nikita Lukianets– [email protected], twitter: nikiluk http://uxnext.org.ua