Information Visualisation (Multimedia 2009 course)

2,808 views
2,635 views

Published on

Introduction to information visualisation (Multimedia course)

Published in: Business, Technology
1 Comment
5 Likes
Statistics
Notes
No Downloads
Views
Total views
2,808
On SlideShare
0
From Embeds
0
Number of Embeds
8
Actions
Shares
0
Downloads
107
Comments
1
Likes
5
Embeds 0
No embeds

No notes for slide

Information Visualisation (Multimedia 2009 course)

  1. 1. Information Visualisation Multimedia 25 - 09 - 2009 Joris Klerkx joris.klerkx@cs.kuleuven.be 1
  2. 2. 2
  3. 3. Information Visualisatie ... is the use of interactive visual representations of abstract data to amplify cognition. [Card et al.] 3
  4. 4. Information Visualisatie ... is the use of interactive visual representations of abstract data to amplify cognition. [Card et al.] 3
  5. 5. Information Visualisation Let A, B, C, D, E be natural persons, departments of universities, states, etc. • A is positively affected by B and affects B, C and E positively. • B is affected by A and C positively and affects D negatively and A positively. • C is positively affected by A, negatively affected by E, and affects B positively. • B and E negatively affect D. • E affects C and D negatively and is positively affected by A. What’s going on? 4
  6. 6. Information Visualisation Let A, B, C, D, E be natural persons, departments of universities, states, etc. A B • A is positively affected by B and affects B, C and E positively. • B is affected by A and C positively and affects D negatively and A positively. • C is positively affected by A, negatively affected by E, and affects B positively. C • B and E negatively affect D. • E affects C and D negatively and is positively affected by A. What’s going on? E D 4
  7. 7. Information Visualisation Let A, B, C, D, E be natural persons, departments of universities, states, etc. A B • A is positively affected by B and affects B, C and E positively. • B is affected by A and C positively and affects D negatively and A positively. • C is positively affected by A, negatively affected by E, and affects B positively. C • B and E negatively affect D. • E affects C and D negatively and is positively affected by A. What’s going on? E D “A picture is worth a 1000 words...” 4
  8. 8. Use Human Perceptual System Pattern recognition scan, recognize, remember Graphical elements facilitate comparisons length, shape, orientation, texture, color Animation time changes 5
  9. 9. The Visualisation Pipeline 6
  10. 10. The Visualisation Pipeline 6
  11. 11. Issues How to provide efficient and effective access to large collections of data to enable insight in the contents of such a collection. using information visualisation techniques Does it work better? [Van Wijk, 2006], [Spoerri, 2004] 7
  12. 12. CS1: Visualising a LOR Study LOM [IEEE LOM, 2002] start from Topic of LO [France et al., 1999], [Najjar, 2008a] Study existing information visualisation techniques Tree-map visualisation [Shneiderman and Johnson, 1991], [Shneiderman, 1996], [Lamping and Rao, 1996], [Venn, 1880], [Kobsa, 2004], [Wang et al., 2006], [Rivadeneira and Bederson, 2003], [Bruls et al., 2000], etc. Design & practical creation of an exploratory search application Evaluation 8
  13. 13. Learning Object Metadata [IEEE LTSC LOM, 2002] 9
  14. 14. Learning Object Metadata [IEEE LTSC LOM, 2002] 9
  15. 15. Learning Object Metadata [IEEE LTSC LOM, 2002] 9
  16. 16. Tree-map Algorithm Ariadne Classification Exact Sciences Human Sciences Informatics Physics 10
  17. 17. Tree-map Algorithm Ariadne Classification Exact Sciences Human Sciences Ariadne Classification Informatics Physics 10
  18. 18. Tree-map Algorithm Ariadne Classification Exact Sciences Human Sciences Ariadne Classification Informatics Physics Exact Sciences 10
  19. 19. Tree-map Algorithm Ariadne Classification Exact Sciences Human Sciences Ariadne Classification Informatics Physics Exact Sciences Human Sciences 10
  20. 20. Tree-map Algorithm Ariadne Classification Exact Sciences Human Sciences Ariadne Classification Informatics Physics Exact Sciences Human Sciences Informatics Physics 10
  21. 21. Access to the Ariadne KPS Human Exact Sciences Sciences 11
  22. 22. Access to the Ariadne KPS 12
  23. 23. Access to the Ariadne KPS 12
  24. 24. Access to the Ariadne KPS 12
  25. 25. Access to the Ariadne KPS Overview first, Zoom and Filter, then Details on Demand “Visual Information-Seeking Mantra” [Shneiderman, 1996] 12
  26. 26. Access to the Ariadne KPS Overview first, Zoom and Filter, then Details on Demand “Visual Information-Seeking Mantra” [Shneiderman, 1996] 12
  27. 27. Access to the Ariadne KPS Overview first, Zoom and Filter, then Details on Demand “Visual Information-Seeking Mantra” [Shneiderman, 1996] 12
  28. 28. Access to Ariadne KPS: Demo 13
  29. 29. Access to Ariadne KPS: Demo 13
  30. 30. Prototype Evaluation 14
  31. 31. Prototype Evaluation Study 1: Perception of 1 infovis expert user [Nielsen, 1992b] 7 user tasks to support Exploratory Search [Shneiderman, 1996] overview, zoom, filter, details-on-demand, relate, history, extract 14
  32. 32. Prototype Evaluation Study 1: Perception of 1 infovis expert user [Nielsen, 1992b] 7 user tasks to support Exploratory Search [Shneiderman, 1996] overview, zoom, filter, details-on-demand, relate, history, extract Study 2: User Study [Rubin, 1994], [Nielsen, 1992a], [Likert, 1932], [Najjar et al., 2005], 10 users, 2 groups of 5, independent tasks comparison traditional tool (SILO) and Prototype Task time, Task Accuracy, Satisfaction (Likert Scale) 14
  33. 33. Prototype Evaluation Study 1: Perception of 1 infovis expert user [Nielsen, 1992b] 7 user tasks to support Exploratory Search [Shneiderman, 1996] overview, zoom, filter, details-on-demand, relate, history, extract Study 2: User Study [Rubin, 1994], [Nielsen, 1992a], [Likert, 1932], [Najjar et al., 2005], 10 users, 2 groups of 5, independent tasks comparison traditional tool (SILO) and Prototype Task time, Task Accuracy, Satisfaction (Likert Scale) 14
  34. 34. Visual Information Seeking Overview Zoom Filter Details-on-Demand Relate History & Extract 15
  35. 35. CS2: Eurosong 2009 Results http://blob.creanode.com/ blob/eu2009/ Visualisation for analysis 16
  36. 36. CS3: EC-TEL Proceedings Visualisation of concepts 17
  37. 37. Music Industry bron: http://en.wikipedia.org/wiki/Music_industry 18
  38. 38. CS4: Visualising Reuse Study ALOCOM [Verbert et al., 2005] isPartOf/hasPart relations Study existing information visualisation techniques Node-link graph [Ware and Franck, 1994], [Becker et al., 1995], [Shneiderman, 1996] Design & practical creation of an exploratory search application with advanced support to Gain insight in actual reuse of the different components Search & Find relevant components Evaluation 19
  39. 39. Reuse? Repository filled with 48286 components from 653 presentations: 14113 slides 5768 images 198 tables 26 diagrams 27543 text fragments 20
  40. 40. Reuse? Repository filled with 48286 components from 653 presentations: 14113 slides 5768 images 198 tables 26 diagrams 27543 text fragments ➡ Average reuse-value: 0.22 20
  41. 41. Reuse? Repository filled with 48286 components from 653 presentations: 14113 slides 5768 images 198 tables 26 diagrams 27543 text fragments ➡ Average reuse-value: 0.22 20
  42. 42. Access to ALOCOM: Demo 21
  43. 43. Access to ALOCOM: Demo 21
  44. 44. Access to ALOCOM: Demo 21
  45. 45. Evaluation 22
  46. 46. Evaluation Expert review 4 expert users in TEL community prototype = effective & efficient 22
  47. 47. Evaluation Expert review 4 expert users in TEL community prototype = effective & efficient Recommendations calculate statistics, social network of authors, reuse through time, other dynamic controls, generalise target group 22
  48. 48. CS5: http://www.liveplasma.com/ Visualisation for recommendation 23
  49. 49. CS6: Visualising Social Bookmarks Study social bookmarks & metadata del.icio.us [delicious, 2008], CALIBRATE [CALIBRATE, 2008] Investigate existing information visualisation techniques Cluster map [Fluit et al., 2005], [Dodge and Kitchin, 2001], [Pampalk, 2006], [Heer and Boyd, 2005]... Design & practical creation of an exploratory search application with advanced support to provide understanding in bookmarks, tags, users and the relationships between them Evaluation 24
  50. 50. Clustermap Algorithm 25
  51. 51. Clustermap Algorithm 25
  52. 52. Clustermap Algorithm 25
  53. 53. Clustermap Algorithm 25
  54. 54. Clustermap Algorithm 25
  55. 55. Clustermap Algorithm 25
  56. 56. Access to del.icio.us: Demo Filters Empty Visualisation: Selection Widget “Start with what you know, then grow” Results 26
  57. 57. Access to del.icio.us: Demo 26
  58. 58. Prototype Evaluation 27
  59. 59. Prototype Evaluation Study 1: Expert review by 4 experts portal integration, zooming, learning curve, complexity, timeline integration 27
  60. 60. Prototype Evaluation Study 1: Expert review by 4 experts portal integration, zooming, learning curve, complexity, timeline integration Study 2: Subjective review by 10 end users to assess effectiveness efficiency subjective acceptance usability issues 27
  61. 61. CS7: Many Eyes: Visualisation for the masses http://manyeyes.alphaworks.ibm.com/manyeyes/visualizations/finding- new-music-artists-takes-time Visualisation for recommendation 28
  62. 62. CS8: Visualising a Network of LORS 29
  63. 63. CS8: Visualising a Network of LORS Unlock the deep web of the learning repository networks that members of GLOBE maintain [Globe, 2008] 29
  64. 64. CS8: Visualising a Network of LORS Unlock the deep web of the learning repository networks that members of GLOBE maintain [Globe, 2008] Timeline Visualisation of Search History 29
  65. 65. Find Material: Demo 30
  66. 66. Find Material: Demo 30
  67. 67. Timeline Visualisation of History: Demo 31
  68. 68. Timeline Visualisation of History: Demo 31
  69. 69. CS9: Listening History http://www.leebyron.com/what/lastfm/example.jpg 32
  70. 70. CS10: Emotion in HAPPY ANGRY Lyrics Integrated Karaoke Player with Synesketch On-the-fly visualisation of FEAR SURPRISE lyrics during Song. SADNESS DISGUST http://www.synesketch.krcadinac.com/ 33
  71. 71. Thriller, Michael Jackson 34
  72. 72. Thriller, Michael Jackson 34
  73. 73. Shiny Happy People, REM 35
  74. 74. Shiny Happy People, REM 35
  75. 75. Information Visualization Manifesto (1/2) “The purpose is insight, not pictures” (Sheiderman) “Form Follows Function” “Start with a Question” “Interactivity is Key” “Cite your source” http://www.visualcomplexity.com/vc/blog/?p=644 36
  76. 76. Information Visualization Manifesto (2/2) “The power of Narrative” “Do not glorify Aesthetics” “Look for Relevancy” “Embrace Time” “Aspire for Knowledge” “Avoid gratuitous visualizations” http://www.visualcomplexity.com/vc/blog/?p=644 37
  77. 77. Pointers http://wearecolorblind.com/articles/quick-tips/ http://visualizingmusic.com/ http://infosthetics.com/ http://www.visualcomplexity.com/vc/ http://bestario.org/research/remap http://visualthinkmap.blogspot.com/ http://www.infovis.net/ 38
  78. 78. Libraries http://wiki.okfn.org/OpenVisualisation http://flare.prefuse.org/ http://iv.slis.indiana.edu/sw/ http://abeautifulwww.com/2008/09/08/20-useful- visualization-libraries/ etc. 39
  79. 79. Further Readings “Readings in Information Visualization: Using Vision to Think”, Card, S et al “Show Me the Numbers”, Few, S. “Beautiful Evidence”, Tufte, E. “Information Visualization. Perception for design”, Ware, C. etc. 40
  80. 80. Thanks Questions? 41

×