Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Introduction - Lecture 1 - Information Visualisation (4019538FNR)

1135dc242dcff3b90ae46fc586ff4da8?s=47 Beat Signer
PRO
February 11, 2021

Introduction - Lecture 1 - Information Visualisation (4019538FNR)

This lecture forms part of the course Information Visualisation given at the Vrije Universiteit Brussel.

1135dc242dcff3b90ae46fc586ff4da8?s=128

Beat Signer
PRO

February 11, 2021
Tweet

Transcript

  1. 2 December 2005 Information Visualisation Introduction Prof. Beat Signer Department

    of Computer Science Vrije Universiteit Brussel beatsigner.com
  2. Beat Signer - Department of Computer Science - bsigner@vub.be 2

    February 11, 2021 Course Organisation ▪ Prof. Beat Signer Vrije Universiteit Brussel PL9.3.60 (Pleinlaan 9) +32 2 629 1239 bsigner@vub.be wise.vub.ac.be/beat-signer ▪ Maxim Van de Wynckel Vrije Universiteit Brussel PL9.3.58 (Pleinlaan 9) +32 2 629 3487 mvdewync@vub.be
  3. Beat Signer - Department of Computer Science - bsigner@vub.be 3

    February 11, 2021 Prerequisites ▪ Note that this is an advanced Master's level course and the following previous knowledge is required ▪ good programming skills ▪ It is not impossible to follow the course without these prerequisites, but in this case you should not complain about the potential additional workload! ▪ Note that the following courses teach principles that are also relevant for this course on Information Visualisation ▪ Gebruikersinterfaces (1019885ANR) ▪ Next Generation User Interfaces (4018166FNR)
  4. Beat Signer - Department of Computer Science - bsigner@vub.be 4

    February 11, 2021 Course Goals ▪ After attending the course on Information Visuali- sation, the student has solid background knowledge about information visualisation (terminology, principles and issues, visualisation techniques, data representation and presentation). ▪ The student can design, develop and test interactive visualisations. ▪ The student can criticise visualisations.
  5. Beat Signer - Department of Computer Science - bsigner@vub.be 5

    February 11, 2021 Exercises ▪ The course content is further investigated in the exercise sessions ▪ exercise sessions might also be helpful for the assignment ▪ assistant: Maxim Van de Wynckel - Thursday 16:00–18:00 ▪ Lab Session ▪ one of the exercise sessions is a dedicated lab session where you can work and get feedback on your assignment - Thursday 16:00–18:00 ▪ Additional content might be covered in exercise sessions ▪ strongly recommended to attend all exercise sessions! ▪ exam covers content of lectures and exercises
  6. Beat Signer - Department of Computer Science - bsigner@vub.be 6

    February 11, 2021 Course Material ▪ All material will be available on Canvas ▪ lecture slides, exercises, research papers, tutorials, ... ▪ Make sure that you are subscribed to the Information Visualisation course on Canvas ▪ https://canvas.vub.be/courses/17989 ▪ Handouts are available on Canvas at least the day before the lecture ▪ Handouts are also available on the WISE website ▪ https://wise.vub.ac.be/course/information-visualisation
  7. Beat Signer - Department of Computer Science - bsigner@vub.be 7

    February 11, 2021 Lecture Schedule Exercise 2: Data Sources and Dataset Quality Assessment 23 24 25 26 Lecture 2: Human Perception and Colour Theory Lecture 3: Data Representation Exercise 3: Preprocessing and Data Analysis Using Python Lecture 4: Analysis and Validation Exercise 6: Visualisation Frameworks online online online online online online online 27 28 Lecture 1: Introduction 22 Exercise 1: Introduction and Discussion of Visualisations online Exercise 4: Analysis and Validation online online Lecture 5: Data Presentation Exercise 5: Visualisation in Python online online Lecture 6: Data Processing and Visualisation Frameworks Lecture 7: Design Guidelines and Principles Exercise 7: Visualisation in D3.js online online
  8. Beat Signer - Department of Computer Science - bsigner@vub.be 8

    February 11, 2021 Lecture Schedule … Lecture 9: View Manipulation and Reduction Exercise 8: Interaction and Design Guidelines with Bokeh and Plotly 32 33 34 36 Lecture 10: Interaction Lecture 11: Dashboards Exercise 9: Interaction with D3.js Lecture 12: Case Studies and Course Review Lab Session 29 Final Project Presentations Lecture 8: Visualisation Techniques online online online online online online online online online Interim Project Presentations online
  9. Beat Signer - Department of Computer Science - bsigner@vub.be 9

    February 11, 2021 Assignment ▪ Interactive information visualisation ▪ realisation of an interactive information visualisation for the domain and dataset(s) of your choice - various presentations and report - evaluated based on creativity, design principles and visualisation techniques, evaluation, documentation, presentations, source code, … ▪ Assignment handed out later this week ▪ group project with 3 students per group - send an email with the 3 group members and your team name to Maxim Van de Wynckel by Monday, February 15 (mvdewync@vub.be) - final presentation (May 20), final report and code (May 23) ▪ assignment counts for 40% for the final grade
  10. Beat Signer - Department of Computer Science - bsigner@vub.be 10

    February 11, 2021 Exam ▪ Oral exam in English ▪ covers content of lectures and exercises ▪ counts 60% for the overall grade ▪ 5 mins questions about the assignment ▪ 15 mins questions about the course content (no preparation time) ▪ Overall grade = oral exam (60%) + assignment (40%) ▪ assignment is composed out of two grades - overall grade for project where students have some flexibility in distributing the grades (±2 points) (70%) - your contribution/knowledge to the project as checked in oral exam (30%) ▪ note that if either the grade for the oral exam or the grade for the assignment is lower than 8/20, then this automatically becomes the final grade!
  11. Beat Signer - Department of Computer Science - bsigner@vub.be 11

    February 11, 2021 Joseph Priestley (1769)
  12. Beat Signer - Department of Computer Science - bsigner@vub.be 12

    February 11, 2021 Joseph Priestley (1769) …
  13. Beat Signer - Department of Computer Science - bsigner@vub.be 13

    February 11, 2021 London Cholera Map by John Snow (1854)
  14. Beat Signer - Department of Computer Science - bsigner@vub.be 14

    February 11, 2021 London Cholera Map by John Snow (1854)
  15. Beat Signer - Department of Computer Science - bsigner@vub.be 15

    February 11, 2021 Florence Nightingale's Rose Diagram(1858)
  16. Beat Signer - Department of Computer Science - bsigner@vub.be 16

    February 11, 2021 Charles Minard (1869) ▪ Napoleon's March on Moscow (1812-1813)
  17. Beat Signer - Department of Computer Science - bsigner@vub.be 17

    February 11, 2021 London Underground, Harry Beck (1931)
  18. Beat Signer - Department of Computer Science - bsigner@vub.be 18

    February 11, 2021 Gapminder, Hans Rosling ▪ Hans Rosling working with developmental data for over 30 years ▪ Gapminder demonstrated at 2007 TED talk 'The Best Stats You've Ever Seen' ▪ "Let the dataset change your mindset", Rosling 2007 ▪ animated presentation in space and time
  19. Beat Signer - Department of Computer Science - bsigner@vub.be 19

    February 11, 2021 Video: The Best Stats You've Ever Seen
  20. Beat Signer - Department of Computer Science - bsigner@vub.be 20

    February 11, 2021 MindXpres Data Visualisation
  21. Beat Signer - Department of Computer Science - bsigner@vub.be 21

    February 11, 2021 Mapping 2019-nCoV
  22. Beat Signer - Department of Computer Science - bsigner@vub.be 22

    February 11, 2021 Australia Bushfires (2020) ▪ Not a satellite image! ▪ 3D visualisation of one month of data by Anthony Hearsey ▪ data collected by Nasa's Fire Information for Re- source Management System ▪ Information visualisation can be misused to deliver the wrong message
  23. Beat Signer - Department of Computer Science - bsigner@vub.be 23

    February 11, 2021 Mercator Projection
  24. Beat Signer - Department of Computer Science - bsigner@vub.be 24

    February 11, 2021 What is Visualisation (Vis)? ▪ F ▪ Augmentation of human capabilities ▪ A vis idiom is a distinct approach to creating and manipulating visual representations ▪ find best design for a particular task ▪ Resource limitations ▪ computers: computational capacity and scalability ▪ humans: perceptual and cognitive capacity ▪ displays: number of pixels - information density (data-ink ratio) = amount of information vs. unused space Computer-based visualisation systems provide visual representations of datasets designed to help people carry out tasks more effectively. T. Munzner
  25. Beat Signer - Department of Computer Science - bsigner@vub.be 25

    February 11, 2021 Why Use Visualisation? ▪ Human eyes have "superpowers"! ▪ visual system provides very high-bandwidth channel ▪ Visual reasoning is way faster and more reliable than mental reasoning ▪ perceptual inferences based on spatial location etc. ▪ External representation or "external cognition" ▪ augment human capacity beyond internal cognition and memory ▪ information can be organised by spatial location ▪ Summarise information without loosing details (details on demand)
  26. Beat Signer - Department of Computer Science - bsigner@vub.be 26

    February 11, 2021 Human in the Loop ▪ Many analysis problems are ill specified ▪ many possible questions to be asked ▪ human-in-the-loop exploration making use of human pattern detection ▪ augment human capabilities rather than replacing the human in the loop ▪ Exploratory analysis for scientific discovery (data analysis) ▪ Visualisation tools for presentation (communication) ▪ presenting existing knowledge
  27. Beat Signer - Department of Computer Science - bsigner@vub.be 27

    February 11, 2021 Computer in the Loop ▪ Visualisation of large datasets that might dynamically change over time
  28. Beat Signer - Department of Computer Science - bsigner@vub.be 28

    February 11, 2021 Showing Dataset Details ▪ Exploring a dataset to find patterns ▪ not possible if we only see a summary of the dataset ▪ Assessing the validity of a statistical model ▪ does the model fit the data? ▪ Statistical characterisation (descriptive statistics) of a dataset loses information through summarisation ▪ single summary often an oversimplification hiding the true structure of a dataset ▪ e.g. Anscombe's Quartet
  29. Beat Signer - Department of Computer Science - bsigner@vub.be 29

    February 11, 2021 Anscombe's Quartet [Visualization Analysis & Design, Tamara Munzner, 2014]
  30. Beat Signer - Department of Computer Science - bsigner@vub.be 30

    February 11, 2021 Anscombe's Quartet …
  31. Beat Signer - Department of Computer Science - bsigner@vub.be 31

    February 11, 2021 Interactivity ▪ Interactivity is necessary for vis tools handling complexity ▪ limitations of people and displays make it impossible to show a large dataset at once ▪ change level of details ▪ show different aspects of a dataset ▪ different representations and summaries of data ▪ different presentations of data
  32. Beat Signer - Department of Computer Science - bsigner@vub.be 32

    February 11, 2021 Difficulties in Design ▪ Main issue is that the vast majority of the possibilities in the design space will be ineffective for any specific usage context ▪ Design might be a poor match with the human perceptual and cognitive system ▪ Design might be a bad match with the intended task ▪ Design alternatives: consider multiple alternatives and choose the best one!
  33. Beat Signer - Department of Computer Science - bsigner@vub.be 33

    February 11, 2021 Search Space Metaphor for Vis Design [Visualization Analysis & Design, Tamara Munzner, 2014]
  34. Beat Signer - Department of Computer Science - bsigner@vub.be 34

    February 11, 2021 What-Why-How Question ▪ What data is shown ▪ Why is the visualisation tool used (task) ▪ How is the vis idiom constructed in terms of design choices
  35. Beat Signer - Department of Computer Science - bsigner@vub.be 35

    February 11, 2021 Information Visualisation Process Data Representation Data Data Presentation Interaction mapping perception and visual thinking
  36. Beat Signer - Department of Computer Science - bsigner@vub.be 36

    February 11, 2021 Exercise 1 ▪ Introduction and Discussion of Visualisations
  37. Beat Signer - Department of Computer Science - bsigner@vub.be 37

    February 11, 2021 Further Reading ▪ Parts of this lecture are based on the book Visualization Analysis & Design ▪ chapter 1 - What's Vis and Why Do It?
  38. Beat Signer - Department of Computer Science - bsigner@vub.be 38

    February 11, 2021 References ▪ Visualization Analysis & Design, Tamara Munzner, Taylor & Francis Inc, (Har/Psc edition), November 2014, ISBN-13: 978-1466508910 ▪ Information Visualization: Perception for Design, Colin Ware, Morgan Kaufmann (3rd edition), May 2012, ISBN-13: 978-0123814647 ▪ Envisioning Information, Edward R. Tufte, Graphics Press (1st edition) December 1990, ISBN-13: 978-0961392116
  39. Beat Signer - Department of Computer Science - bsigner@vub.be 39

    February 11, 2021 References ... ▪ Semiology of Graphics: Diagrams, Networks, Maps, Jacques Bertin, ESRI PR (1st edition), January 2010, ISBN-13: 978-1466508910 ▪ Data Visualization: A Practical Introduction, Kieran Healy, Princeton University Press, January 2019, ISBN-13: 978-0691181622 ▪ The Functional Art: An Introduction to Information Graphics and Visualization, Alberto Cairo, New Riders (Pap/Dvdr edition), August 2012, ISBN-13: 978-0321834737
  40. Beat Signer - Department of Computer Science - bsigner@vub.be 40

    February 11, 2021 References … ▪ Factfulness: Ten Reasons We're Wrong About The World – And Why Things Are Better Than You Think, Hans Rosling et al., April 2018, ISBN-13: 978-1119547259 ▪ Mapping 2019-nCoV ▪ https://systems.jhu.edu/research/public-health/ncov/ ▪ Australia Bush Fires ▪ https://www.sbs.com.au/news/how-fake-bushfire-images-and-misleading- maps-of-australia-are-spreading-on-social-media ▪ beautiful news daily ▪ https://informationisbeautiful.net/beautifulnews/
  41. Beat Signer - Department of Computer Science - bsigner@vub.be 41

    February 11, 2021 References … ▪ Gapminder ▪ https://www.gapminder.org ▪ https://www.youtube.com/watch?v=usdJgEwMinM ▪ https://www.youtube.com/watch?v=Z8t4k0Q8e8Y ▪ B. Shneiderman, Data Visualization’s Breakthrough Moment in the COVID-19 Crisis, 2020 ▪ https://medium.com/nightingale/data-visualizations-breakthrough- moment-in-the-covid-19-crisis-ce46627c7db5 ▪ R. Roels, Y. Baeten and B. Signer, Interactive and Narrative Data Visualisation for Presentation-based Knowledge Transfer, Communications in Computer and Information Science (CCIS), 739, 2017 ▪ https://beatsigner.com/publications/roels_CCIS2017.pdf
  42. 2 December 2005 Next Lecture Human Perception and Colour Theory