GDES-360 spring 2023 / David Ramos, American University Design

Ranges of values

A one-week project to fine-tune visualization process, and to develop skill with Observable and the Vega-Lite API. This week, we start in Observable, and use Observable to generate rough visualizations that you will improve on paper.

We are working with the “driving” dataset, one of the examples compiled under Vega Datasets. The Vega developers gathered these data from a 2010 New York Times article. (The Times article in turn cites the Energy Information Administration, Federal Highway Administration, and Brookings Institution as the original data sources.)

The data speak to driving behavior in the U.S., nationwide. They describe the relationship between miles driven per capita and the price of gas, adjusted for inflation, between 1956 and 2010.

I’ve imported these data into an Observable notebook and provided some visualizations to help you start work.


1. Explore the data

Look at the data in the Driving notebook. Can you see patterns? Questions? Impressions about what this might tell us?

2. Explore code and think about visualization design

Start making edits to the Observable notebook. Weigh your choice of encodings and formats.

3. Background

Read the original article.

4. Produce an intermediate visualization in Observable

Software is good at doing repetitive tasks with precision—use that capability to generate a graphic that has marks in the right X/Y positions and at meaningful sizes.

5. Produce more polished graphics on paper

Print this intermediate visualization. Work on paper to create a more refined versions, tracing over the printed version so that you can preserve X/Y relationships. Add titles and labels; perhaps remove titles and labels. Do you need all of the marks?



Produce one final visualization, any size and shape, on paper. For critique, bring at least three previous versions, which can be for the same concept or for a different concept. Turn in images of all of these versions on Canvas.