Switch branches/tags
Nothing to show
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
306 lines (275 sloc) 16.7 KB

Data Visualization for Architecture, Urbanism and the Humanities

  • Columbia University | GSAPP and A&S | ARCHA4892 | Spring 2017
  • Fridays 9am - 11am | Ware Lounge (600 Avery)
  • Professor: Juan Francisco Saldarriaga (jfs2118)
  • Teaching Assistant: Buck Wanner (brw2103) and Mark Madera (mmm2362)
  • Office hours:
    • Juan: Mondays 10am - 12pm (previous email required)
    • Buck: Wednesdays 10am - 12pm (previous email required)

Course Overview

This course provides an introduction to data visualization theory and methods for students entirely new to the fields of computation and information design. Through a series of in-class exercises and take-home assignments, students will learn how to critically engage and produce interactive data visualization pieces that can serve as exploratory and analytical tools. The course is part of a larger initiative, hosted by the Center for Spatial Research to teach courses in the critical use of digital tools across fields in architecture, urbanism, and the humanities.

The course will be centered around a semester long data visualization group project, through which the students will learn the basics of data visualization, data analysis, data collection, programming and version control. However, even though the course will teach specific visualization tools, the main conceptual thread will be centered around how to work with data, both in the humanities and in architecture and urbanism. Students will define their final projects around their own interests, and will bring their own datasets into their final projects.

General Topics

  • Data visualization history and concepts
  • Working with data: collection and analysis
  • Basic programming skills and web languages (HTML, CSS, Javascript)
  • Interactivity and online data visualization
  • Collaborative work and version control (GitHub)
  • Working with text data
  • APIs and Web-scraping
  • Generative art

Evaluation and Grading

  • 10% Class participation and discussion
  • 20% Individual assignments and homework
  • 15% Midterm presentation
  • 20% Data visualization critique
  • 35% Final project and final presentation

Resources and Materials

Course files, tutorials and presentations will be located on Courseworks, on the Center for Spatial Research website and on this repository.

The readings for the class will be duly uploaded to this repository. Students will be required to submit their assignments by uploading them to Courseworks. Finally, the class will also rely heavily on submissions to the blog. Students will be required to upload some of their own work as well as inspirational material, encouraging and developing a critical stance and visual skills.

Link to the blog


Week 1: Introduction to course and setup

January 20

  • Course administration and syllabus
  • Overview of the course
  • Assignments and final project
  • Resources
  • Why data visualization (discussion)
  • Basic infrastructure (stack)
  • Introduction to HTML and CSS
  • Setup of local server

Week 2: Basic web concepts and GitHub

January 27

  • Discussion: what is data in your field
  • Version control basics
  • Setup a GitHub repository
  • Setup a GitHub projects page
  • Bootstrap
  • Readings due:
    • Kirk, Andy, Data Visualization, Chapter 1 "Defining Data Visualization"
    • Kirk, Andy, Data Visualization, Chapter 4 "Working With Data"

Week 3: Data visualization matrix and basic programming concepts

February 3

  • Introduction to p5.js
  • Introduction to JavaScript
  • Console
  • Basic programming exercises
  • Readings due:
    • Manovich, Lev, "What is Data Visualization"
    • Manovich, Lev, "Visualization Methods for Media Studies"

Week 4: Introduction to data visualization

February 10

Week 5: Presentations

February 17

Week 6: Contemporary data visualization & advanced programming

February 24

  • Contemporary concepts and examples of data visualization
  • Basic data analysis concepts and techniques
  • Programming exercises:
    • Functions
    • Objects
  • Reading due:
  • Due: Final project proposal (group)

Week 7: Interactivity

March 3

Week 8: Interactivity (Part 2)

March 10

  • Interactivity concepts and techniques
  • Readings due:
    • Kirk, Andy, Data Visualization, Chapter 11 "Visualization Literacy"
    • Tufte, Edward, "Aesthetics and Technique"
  • Guest lecture: Giorgia Lupi from Accurat (Canceled)

Week 9: Spring Break (no class)

March 17

Week 10: APIs

March 24

  • APIs and web-scrapping techniques

Week 11: Working with text data

March 31

  • Guest lecture: Michelle McSweeney (working with textual data)
  • Reading due:
    • Blei, D. M. (2013). Topic Modeling and Digital Humanities. Journal of Digital Humanities, 2(1).
    • Gitelman, L. (2013). “Raw data” is an oxymoron. Cambridge, Massachusetts: The MIT Press.
    • Michel, J.-B., Shen, Y. K., Aiden, A. P., Veres, A., Gray, M. K., Team, T. G. B., … Aiden, E. L. (2011). Quantitative Analysis of Culture Using Millions of Digitized Books. Science, 331(6014), 176–182.
    • Schulz, K. (2011, June 24). The Mechanic Muse - What Is Distant Reading? The New York Times.

Week 12: Generative Art

April 7

  • Readings due: TBD

Week 13: 3/4 review

April 14

  • Assignment 4 Due: Data visualization critique (individual)

Week 14: Work in class

April 21

  • Work in class

Week 15: Work in class

April 28

  • Work in class

Week 16: Final review

May 5

Assignment Schedule (Due Dates)

  • February 10: Website with homepage and type of data visualization (individual)
  • February 17: Detailed presentation of data visualization project (group)
  • February 24: Final project proposal (group)
  • March 3: Visualization of one dataset (individual)
  • April 14: Midterm review (group)
  • April 14: Data visualization critique (individual)
  • May 5: Final review



  • Data Visualization:
    • Data Flow: Visualizing Information in Graphic Design
    • Data Flow 2: Visualizing Information in Graphic Design
    • Data Points, Nathan Yau
    • Atlas of Shrinking Cities, Beyer Elke
    • Visualizing Information for Advocacy, Tactical Technology Creative
    • Design for Information, Isabel Meirelles
    • Semiology of Graphics, Jacques Bertin
    • The Visual Display of Quantitative Information (2nd Edition), Edward R. Tufte
    • Envisioning Information, E. R. Tufte
    • Visualization Analysis and Design, Tamara Munzer
    • Dear Data, Giorgia Lupi, Stefanie Posavec
    • Show Me the Numbers: Designing Tables and Graphs to Enlighten, Stephen Few
    • Now You See It: Simple Visualization Techniques for Quantitative Analysis, Stephen Few
    • Information Visualization: Perception for Design, Colin Ware
    • The Functional Art: An Introduction ton Information Graphics and Visualization, Alberto Cairo
  • Programming:
    • Generative Design, Hartmut Bohnacker, Benedikt Gross, Julia Laub, Claudius Lazzeroni
    • Processing: A Programming Handbook for Visual Designers (Second Edition), Casey Reas and Ben Fry
    • The Nature of Code: Simulating Natural Systems with Processing, Daniel Shiffman
    • Eloquent JavaScript, Marijn Haverbeke
    • Beginning JavaScript (4th Edition), Paul Wilton
    • JavaScript: The Definitive Guide (4th Edition), David Flanagan
    • HTML & CSS: Design and build websites, Jon Duckett
    • Program or Be Programmed: Ten Commands for a Digital Age, Douglas Rushkoff
  • Typography:
    • Thinking With Type, Ellen Lupton

Blogs & Websites



  • Text editors:
  • Python IDEs:
  • Raw
  • Color:
  • Visualization toolkits:
    • D3 - a JavaScript library for manipulating documents based on data.
    • Vega - a declarative format for creating, saving, and sharing interactive visualization designs.
    • Vega-lite - is a high-level visualization grammar. It provides a concise JSON syntax for supporting rapid generation of visualizations to support analysis.
    • Processing - a flexible software sketchbook and a language for learning how to code within the context of the visual arts.
    • p5.js - a JavaScript library that starts with the same goal as Processing, to make coding accessible for artists, designers, educators, and beginners, and reinterprets it for today's web.
    • Protovis - JavaScript visualization language, predecessor of d3.
    • Leaflet - an open-source JavaScript library for mobile-friendly interactive maps.
    • Visdown - visualization with markdown
    • g9.js - automatic interactive graphs
    • Bamboo DiRT Nearly comprehensive list of tools to use for DH projects
  • Text Analysis Tools
    • AntConc Does basic text analysis NLTK-style. Great for non-Pythonic approach to distant reading a text. Best used with The Programming Historian's Tutorial.
    • MALLET Topic modelling tool. Best used with The Programming Historian's Tutorial .
  • Data Cleaning Tools

Tutorials & Resources