2. example Map your moveswhere New Yorkers move (10 years data)distorted mapcircle = moves for one zip codered – outblue – inoverlaidhttp://moritz.stefaner.eu/projects/map%20your%20moves/
3. example Map your movesinteractive: selecting a zip code shows where movements to/fromalso hiding: what you don’t show also importanthttp://moritz.stefaner.eu/projects/map%20your%20moves/
4. what is visualistion? making data easier to understand using direct sensory experience especially visual!but can have aural, tactile ‘visualisation’
5. direct sensory experience N.B. sensory rather than linguisitic sort of right/left brain stuff!but ... may include text, numbers, etc.
6. visualising in text alignment - numbersthink purpose! 532.56 179.3 256.317which is biggest? 15 73.948 1035 3.142 497.6256
7. visualising in text alignment - numbersvisually: 627.865 long number = big number 1.005763 382.583 2502.56align decimal points 432.935or right align integers 2.0175 652.87 56.34
8. visualising in text TableLenslike a ‘spreadsheet’ ...... but some rows squashed to one pixel highnumbers become small histogram bars
9. visualising in text TableLensN.B. also an example of focus+context focus some rows in full detail context whole dataset can also be seen in overview
10. especially visual visual cortex is 50% of the brain! ... but disability, context, etc.,may mean non-visual forms needed
11. why visualisation? for the data analystscientist, statistician, possibly you! for the data consumeraudience, client, reader, end-user
12. why visualisation? understandingconsumer focus on well understood, simple representations rhetoric
13. why visualisation? to help others see what the analyst understanding has already seen consumer infographics rhetoric data journalismhttp://www.guardian.co.uk/news/datablog/2010/oct/18/deficit-debt-government-borrowing-data
14. why visualisation? the business plan hockey stick! understandingconsumer rhetoric to persuade readers of particular point lies, damn lies, (and not others!) and graphs
15. why visualisation? understandinganalyst powerful, often novel visualisations, training possible exploration
16. why visualisation? to make more clear understanding particular aspects of data consumer confirming hypotheses noticing exceptions exploration e.g. box plots ingraph from: Measurement of the neutrino velocity with the OPERA detector in the CNGS
17. why visualisation? seeking the unknown avoiding the obvious understanding wary of happenstanceconsumer exploration to find new things that have not been previously considered
18. a brief history of visualisation from 2500 BC to 2012
19. a brief history ...static visualisation – the first 2500 yearsinteractive visualisation – the glorious ’90sand now? – web and mass data – visual analytics
20. static visualisation from clay tablets to TufteMesopotamian tablets
21. static visualisation from clay tablets to TufteMesopotamian tablets10th Century time line
22. static visualisation from clay tablets to TufteMesopotamian tablets10th Century time line1855 Paris-Lyon train timetable
23. static visualisation from clay tablets to TufteMesopotamian tablets10th Century time line1855 Paris-Lyon train timetableExcel etc.
24. static visualisationread Tufte’s books ... – The Visual Display of Quantitative Information – Envisioning Information – Visual Explanations
25. interactive visualisationearly 1990s growing graphics power – 3D graphics – complex visualisations – real-time interaction possible
26. ... and nowloads of dataweb visualisationdata journalismhttp://www.guardian.co.uk/news/datablog/2010/oct/18/deficit-debt-government-borrowing-datahttp://www-958.ibm.com/software/data/cognos/manyeyes/
27. and visual analytics!
28. visualisation in context
29. plain visualisationdata visualisation
30. visual analyticsdata visualisation processing direct interaction
31. the big picture organisational action social & political contextworld ? decisiondata visualisation processing direct interaction
32. designing visualisation
33. choosing representationsvisualisation factors – visual ‘affordances’ what we can see • what we can see – objectives, goals and tasks • what we need to see what we need to see – aesthetics what we like to see • what we like to see
34. trade-off visualisation factors – visual affordances – objectives, goals and tasks – aesthetics static representation ⇒ trade-off interaction reduces trade-offinteraction reduces trade-off– stacking histogram, overview vs. detail, etc. etc.vs. –stacking histogram, overview detail, etc. etc.
35. relaxing constraintsnormal stacked histogramgood for: – overall trend – relative proportions – trend in bottom category ?bad for others – what is happening to bananas?
36. make your own (iii) relaxing constraintsinteractive stacking histograms ... or ... dancing histograms dancing histogramsnormal histogramnormal histogram except ... except ...
37. make your own (iii) relaxing constraintsinteractive stacking histograms ... or ... dancing histogramsnormal histogram except ...hover over cell to show detail
38. make your own (iii) relaxing constraintsinteractive stacking histograms ... or ... dancing histogramsnormal histogram except ...hover over cell to reveal detailclick on legend to change baseline demonstration
39. kinds of interactionhighlighting and focusdrill down and hyperlinksoverview and contextchanging parameterschanging representationstemporal fusion
40. Shneiderman’s visualisation mantra overview first, zoom and filter, then details on demand overview on demand details zoom and filter using slidershttp://www.sapdesignguild.org/community/book_people/visualization/controls/FilmFinder.htm
41. classic visualisations
42. displaying groups/clustersnumeric attributes – use average or regioncategorical attributes – show values of attributes common to clustertext, images, sound – no sensible ‘average’ to display – use typical documents/images – central to cluster ... or spread within cluster
43. using clusters the scatter/gather browsertake a collection of documentsscatter: – group into fixed number of clusters – displays clusters to usergather: – user selects one or more clusters – system collects these togetherscatter: – system clusters this new collection ...
44. displaying clusters scatter-gather browserkeywords (created by clustering algorithm) ‘typical’ documents (with many cluster keywords)
45. hierarchical datahierarchies are everywhere! – file systems – organisation charts – taxonomies – classification trees – ontologies – xml
46. problems with trees ...hard to fit text labels width grows rapidly overlapping low level nodes
47. use 3D?cone tree – use stacked circles of subtrees
48. good use of 3Dstill have occlusion ...but ‘normal’ in 3Dshadows help todisambiguatebut text labelsdifficult
49. cone trees →cam treeshorizontal layout makes labels readablesmall things matter!
50. disect 2D space - treemapstakes tree of items with some ‘size’ – e.g. file hierarchy, financial accountsalternatively divides space horizontally/vertically foreach level, proportionate to total size x  y  x x/a – 4 y/c  x/b – 2 x/a  y y/d  y/c – 1 y/d – 1 x/b  y/e  y/e – 1 http://www.cs.umd.edu/hcil/treemap-history/
51. treemaps (2)later variants improved the shape and appearanceof maps
52. treemaps (3)plus algorithms for vast data sets, for thumbnailimages, etc. etc.
53. distort space ...tree branching factor b: – number of nodes at depth d = bdEuclidean 2D space: – amount of space at radius r = 2πr – not enough space!non-Euclidean hyperbolic space: – exponential space at radius rhyperbolic browser – lays out tree in hyperbolic space – then uses 2D representation of hyperbolic space
54. multiple attributesoften data items have several attributese.g. document: – type (journal, conference, book) – date of publication – author(s) – multiple keywords (perhaps in taxonomy) – citation count – popularity
55. traditional approach ... boolean queries>new query?type=‘journal’ and keyword=‘visualisation’=query processing complete - 2175 resultslist all (Y/N)>N>refine query refine: type=‘journal’ and keyword=‘visualisation’+author=‘smith’=query processing complete - 0 results
56. faceted browsing e.g. HiBrowse (one of the earliest) multiple selection boxes – ‘or’ within box - ‘and’ between boxeskeywords authors typesdigital libraries all 173 all 173HCI 173 catarci 53 book formal models dix 9 conference interaction 157 jones 17 journal 173 task analysis shneiderman 153 other visualisation 39 smith 0 web wilson 22 (keyword=‘interaction’ or ‘visualisation’) and type=‘journal’
57. HiBrowse (ii) shows how many items with particular value – e.g. 39 documents with keyword=‘visualisation’ and type=‘journal’ e.g. 39 documents with keyword=‘visualisation’ and type=‘journal’keywords authors typesdigital libraries all 173 all 173HCI 173 catarci 53 book formal models dix 9 conference interaction 157 jones 17 journal 173 task analysis shneiderman 153 other visualisation 39 smith 0 web wilson 22
58. HiBrowse (iii) can predict the effect of refining selection – e.g. selecting‘smith’ would give empty resultresult e.g. selecting ‘smith’ would give emptykeywords authors typesdigital libraries all 173 all 173HCI 173 catarci 53 book formal models dix 9 conference interaction 157 jones 17 journal 173 task analysis shneiderman 153 other visualisation 39 smith 0 web wilson 22
59. HiBrowse (iv) refining selection updates counts in real timekeywords authors typesdigital libraries all 173 45 39 all 173 45 39HCI 173 45 39 catarci 53 19 18 book 6 formal models dix 9 1 conference interaction 157 jones 17 5 3 journal 173 39 task analysis shneiderman 153 24 21 other visualisation 45 39 smith 0 web wilson 22 8 7
60. starfield (i)scatter plot for two attributescolour/shape codes for moreadjust rest with slidersdots appear/disappear as slider values changedynamic filtering
61. starfield (ii)when few enough points more details appear
62. Influence Explorer (i)developed for engineering modelslike Starfield ...but sliders show histogramhow many in category (like HiBrowse)... and how many ‘just miss’ red = full match black = all but one attribute greys = fewer matching attr’s
63. Influence Explorer (ii)some versions highlight individual itemsin each histogramsimilar technique hasbeen used to matchmultiple taxonomicclassifications
64. Information ScentStarfield shows what is currently selected • explore using trial and errorHiBrowse and Influence Explorer show what would happenPirolli et al. call this Information Scent – things in the interface that help you know what actions to take to find the information you want
65. very large datasetstoo many points/lines to seesolutions ...space-filling single-pixel per item Keim’s VisDrandom selection (see Geoff Ellis’ thesis)clustering visualise groups not individuals