|
|
| "...because a picture is worth a thousand words" |
Information visualization is an area of computer science concerned with helping users understand data through visual representations. Visualization is a powerful technique: it is possible to pack large quantities of information into a manageable size, and people are generally quite good at detecting patterns, relationships, and anomalies visually.
Data is all around us, and it is being produced in ever-larger quantities - scientific data sets, medical data sets, customer buying habits, websurfing habits, credit histories, census data, ...the list goes on. In order for all this data to be useful, it needs to be examined - for patterns, relationships, anomalies, or anything else that might be interesting. Creating useful visualizations requires knowledge of fundamental graphical principles; creating useful visualizations of large, complex, and dynamic data also requires the ability to develop algorithms and software to create the visualizations and to help the user navigate through all of the complexity to find the interesting parts.
It is also important to deliberately design visualizations in order to see what there is to be seen and to effectively communicate those insights, and to be aware of the ways in which visualizations can intentionally and unintentionally lie.
This course has several aims:
-
developing graphicacy: an understanding of the basic principles and building blocks of visualization to be able to interpret and create meaningful graphics
-
building practical skills, to be able to design and implement effective visualizations, and
-
fostering critical thinking about the effectiveness of a visualization, the truthfulness of the conclusions drawn from a result, and the social and ethical considerations behind the responsible use of technology.
Course content falls into four main areas:
-
Fundamentals of Visual Communication: This addresses the principles and practices of effective visual communication, including aspects of human perception and cognition, the basic building blocks of visual representations, graphical integrity, and graphical excellence. These principles will provide a foundation for creating graphics and for critiquing the effectiveness of particular techniques.
-
Techniques: The fundamentals of visual communication will be applied to build up a toolbox of visualization strategies - and also to design new visualization strategies - for multivariate data, spatial and temporal data, network data, and other complex datasets. Techniques such as animation and interaction will also be introduced.
-
Tools: Visualizations will be implemented in D3.js, a JavaScript library supporting data-driven documents on the web. (While primarily used for graphical visualizations of data on the web, D3 can also be used to text-based displays and other manipulation of a web document.) Elements of HTML, CSS, SVG, and JavaScript will also be introduced.
-
Social and Ethical Considerations: Graphical integrity is important within a visualization. In the bigger picture, the visual exploration of data to discover patterns has the potential to offer many benefits but also can raise concerns about privacy, legality, and ethics.
By the end of the course, the successful student should be able to:
-
design effective visualizations, including
- selecting appropriate chart types, elements, and encodings for simple data graphics
- designing novel displays for complex data
- employing animation and interaction
-
critique and improve visualizations, including
- analyzing the effectiveness of chart types, encodings, and other elements for the intended goal of the visualization
- spotting and correcting common visualization lies
-
implement a variety of web-based visualizations using D3.js
CPSC 124 is required.
While this course does
not build directly on CPSC 124 - programming will be done in
JavaScript, not Java, and will primarily use a number of language
features of JavaScript that will be unfamiliar to Java
programmers - knowledge of core elements such as variables, arrays,
functions, and comments is assumed. JavaScript will be
introduced in the context of "JavaScript for Java programmers"
rather than as a first programming language.
Readings: Readings introduce and supplement material addressed in class. Core readings are to be completed for the class period where they are listed on the schedule page; those labelled "supplemental" or "optional" can be read after class. (Supplemental readings are still expected; optional readings are encouraged for greater depth but are not required.)
Homework and Implementation Exercises: Most of the homework exercises will involve implementation using D3, but some will be written e.g. critiquing or designing visualizations for a particular task.
Quizzes: Several quizzes, mostly in the first half of the semester, will check for understanding of core principles and concepts and basic application of those principles and concepts. They will be announced in advance (no pop quizzes).
Journal and Visualization Blog: To encourage thoughtful engagement with the course material, there will be two ongoing journal/blogs over the course of the semester. The journal is an individual journal for responses to readings and class material; specific questions to address will be posed periodically. The focus is thoughtful engagement with issues. The visualization blog is a whole-class participation effort and a forum for discussing the effectiveness of particular visualizations. More information will be provided early in the semester.
Project: The second half of the semester will involve a project where you design and implement visualizations to present a complex dataset of your choice. You will also give a brief presentation of your project during the scheduled final exam time period.
Portfolio: The final product in the course will be a portfolio consisting of three elements:
-
"top 10 stars and stinkers" - a set of best and worst examples of visualizations you have come across, along with a discussion of eachyour visualization blog contributions - a set of technical "how to ..." examples for D3 (homeworks)
- your design and implementation work (project)
Most of these elements will come from your work
throughout the course and the main effort of the portfolio
will be to gather them together, though it is also an
opportunity to improve upon earlier efforts. More information
will be provided during the semester. Instead of a
writeup, there will be a final journal entry (which will be
counted as part of the journal) - no additional work beyond
the original assignments themselves is required for the
portfolio.
Grades: Final grades in this course will be computed as follows:
- Homework: 45%
- Quizzes: 10%
- Journal: 10%
- Visualization Blog: 10%
- Project: 20%
- Porfolio: 5% (distributed between homework, visualization blog, and project)
If you are concerned about your grade, you are strongly encouraged to come to office hours to get help with any material you may be struggling with and to take advantage of the revise and resubmit option for homework problems. Staying on top of things and seeking help as soon as possible when you need it is the best route to success.
Extra Credit: There will not generally be extra credit problems or tasks formally assigned, but there is the potential for extra credit for going above and beyond on the project and in contributions to the class visualization blog and your own journal.
You are expected to attend all scheduled class meetings (3 hours per week) and should expect to spend approximately 8 hours per week on average (*) on additional work (reading, homework, journal and visualization blog entries/posts, the project, studying, etc) outside of class.
In addition, you are expected to attend 5 hours of lab sessions over the course of the semester. If you need additional help or can't make it to the designated lab sessions, this expectation can also be satisfied by coming to office hours. (5 hours = e.g. one lab session every three weeks or a 20-minute office hours visit every week)
(*) The assigned work is intended to take about this much time, though your experience may vary. However, if you routinely spend much less time, you may not be successfully mastering the material, and if you routinely spend substantially more time, especially if you feel like you are spinning your wheels and not making progress, you should come to office hours for help.
Textbook
There is no required textbook to purchase for the course. Material will be handed out or posted on the course webpage.
The following supplemental books are on 3-hour reserve at the library:
- The Visual Display of Quantitative Information, Edward R. Tufte
- Envisioning Information, Edward R. Tufte
- Visual Explanations, Edward R. Tufte
- Beautiful Evidence, Edward R. Tufte
These are classic books on the effective presentation and communication of data, though focused on print and static displays rather than the interactive graphics possible on computer screens. Readings may be assigned from these books, but they are also well worth perusing on their own.
Laptop
You are strongly encouraged to bring a laptop (Mac, Windows, or Linux) configured with the necessary software (see below) to class on certain days. (These will be announced in advance.) Please let me know as soon as possible if you do not have a laptop that you can bring so that alternatives can be considered.
Software
This course will involve implementing visualizations in a web-based environment, using the JavaScript library D3.js. The main tools you will need are a modern web browser, a text editor, D3.js and some related libraries, and (if you are working on your own computer instead of the Linux machines) a file transfer program. All of these tools are available on the lab computers in Rosenberg 009 (reboot them to Linux) and Lansing 310, and are freely available for Mac, Windows, and Linux if you want to set up your own computer. More information will be provided about specific versions and how to install what you need.