Datasurfer Surface Plot Tool

Corner View of surface plot


Datasurfer is a four-dimensional surface plot developed in Processing, for Introduction to Computational Media.  Datasurfer takes a two-dimensional spreadsheet (CSV) and translates values into a 3D surface, which can be manipulated by moving the viewpoint, or by shrinking or growing a two-dimensional window (in the case of the NYISO Grid Data, hours of the day/days of the year) of which blocks are plotted.  Moving the viewpoint changes the apparent representation of the data, allowing for a wider set of conclusions to be made–in this case, it is easy to see that there is substantial variation in the load both over the course of the year, and over the course of the day.


The processing sketch is based on a two-dimensional parsing algorithm from Jonathan Cousins and Nick Sears, and adapted with help from Zannah Marsh.  The interface buttons and sliders come from the spectacular plugin set ControlP5, and the 3-D manipulation is provided by PeasyCam (much easier than writing my own manipulation with the Processing Camera commands).  Of course, neither ControlP5 nor PeasyCam are perfect, but they do work quite well.  A special thanks is due to Andreas Schlegel, author of ControlP5, for modifying the library to allow for changing the slider edge width – right when I needed it at the Ebay Design Expo.

At the ITP show, this is being displayed on a giant touchscreen, which is really a lot of fun, but unfortunately is a little hard to manipulate due to being only single-touch.  Multitouch (which everyone loves on tablets, phones, and now laptops) is going to really extend the computing experience, much more than it has already.


As a programmable interface, there is nearly infinite ability for customization of the tool to different datasets–half the work of information visualization is setting up the tool in such a way as to yield valid conclusions and minimize artifacts.  One of the goals of this project is to build a real-time interface for data from a feed, such as a Tweet-A-Watt.

Special Thanks

Thanks to Jonathan Cousins and Nick Sears for a great fall introduction to information visualization and the seed of this project (and the start of the code), Zannah Marsh for the opportunity (need) to develop this for ICM, the Processing community for developing great plugins (ControlP5, PeasyCam), and of course ITP (specifically George Agudow and Red Burns).

Quantaproject: The Shake Out

It is fitting to describe the increase in the incidence of obesity and diabetes in the US as an epidemic. For most of human history, the problem has been solving the calorie problem—but now we are suffering on a mass scale from the opposite problem: a surfeit of calories, and ’empty calories’ at that.

Right now, the United States has an enormous public health crisis in the form of a large and rising proportion of the population classified as overweight, obese, and extremely obese. And the trend points to an increasing rate of obesity—and attendant health problems including diabetes type 2.

And it gets worse: the rate of obesity among young people is substantially greater than that of the population as a whole, it is forecast that up to 1/3 of today’s teenagers are at risk for developing diabetes type 2, and may lose 1/3 to 1 year of predicted gains in life expectancy, and a greater number of life-quality years (a year where they cut your toes off isn’t so happy).


How did we get here?

With regard to the need to increase the value of farm products during the Great Depression, subsidy programs were enacted to increase the income of farmers. In 1973, under the direction of Secretary of Agriculture Earl Butz, the paradigm changed to payment to support greater production. Paying to support production of commodity crops has led to (1) a shift towards larger farms, and (2) a decrease in the real cost of sugars, refined grains, cheese, and meat. While this could be considered beneficial in terms of delivering more calories per dollar, it has decreased the quality of the American diet, and undoubtedly contributed to the increase in obesity and diabetes.

Americans now spend less on food than at any time in history, but this decrease in expenditure on food comes at the loss of diet quality. Vegetables, fruit, and non-industrial foods are still rather expensive, and therefore make up less of our diet. The ultimate result of the decrease in food cost is that we eat more: restaurant and recipe portions have both increased in energy value and size, and it’s disturbingly true that we will eat what’s in front of us, see Brian Wansink’s research on this topic:

The US spends billions on agricultural subsidies, which distort the market for agricultural goods, specifically commodity grains which are storable, convertible into products, and useful for animal feed. In 2009, the US spent 4 billion USD on corn subsidies alone, and nearly all of that corn was converted to corn syrup, ethanol for fuel, or used for animal feed. These subsidies can constitute half a farmer’s income, as the fair market price of corn is deflated by the sheer volume produced. On the international scene, these subsidies depress the cost of American grains, injuring farmers abroad and damaging developing nations’ economies.

To use all of this grain and derivatives, new food products and new formulations of familiar ones have been engineered. The Twinkie™ is the standard bearer of packaged food products. Contrary to urban legend, it’s just an engineered cake with a designed shelf life of 25 days. Twinkies are made of things one would expect, like flour, water, butter–and things which are a little surprising, like petrochemicals and processed phosphate rock.

The changes in the American diet may has a metabolic dimension: fructose is metabolized differently than glucose or sucrose (a glucose bound to a fructose molecule), and this may have metabolic effects. See this presentation by Robert Lustig, MD at UCSD for a theory of the impact of high fructose intake. An April 13 NY Times article discusses Lustig’s take on fructose metabolism being a major cause of the increase in diabetes and weight gain. We’re certainly eating a lot more sugar, and a lot more of it is high fructose corn syrup—an average of 42.8 pounds more sugar per year compared to the 1950s, and 42% of it is now HFCS (mostly 55% fructose/45% glucose).

All this sugar is just one component of the greater amount we’re eating, which leads to there being a greater amount of us—and a greater number of us with diabetes type 2.

What it means

All of this adds up to a public health disaster—a loss of longevity, a reversal of the hard-won gains in life expectancy.

The mean life expectancy of current generations (Baby Boom, Gen-X, Gen-Y, Millenials) may actually decrease, relative to predicted increases, as a result of the prevalence of obesity and attendant health effects. The graphic above shows the predicted longevity of a 65-year-old woman. In 2010, she would have a predicted 19.3 more years, in 2050, 21.7 years—but with the effects of increased prevalence of diabetes, and heart disease related to obesity, she could lose 1/3 to 1 year of that predicted gain. This is a terribly disturbing conclusion: gains in life expectancy may slow or potentially reverse, as a result of lifestyle disease—fuelled by a food system designed around profit and special-interest benefits, not the public good.

What to do?

There are plenty of good ideas about what to do. Taking a systems approach, we need to restructure the agriculture subsidies. It’s poor policy to promote growing mountains of corn so vast that new ‘sinks’ have to be developed to use it, it’s unethical to spend taxpayer money to market full-fat cheese at the same time a different department of the same agency is fighting the increase in calorie density of foods and the size of restaurant portions. Restructuring the Department of Agriculture would be a good idea. Changing our diet is a top-down and bottom-up proposition. Access to reasonably priced, healthy foods (fruits, vegetables, legumes, whole grains) is necessary, and many areas this access is not adequate—and in many cases people who can eat well, don’t as a result of preferences. These preferences can be changed as a result of greater exposure and conscious and non-conscious behavior change.

Stop, children … everybody look what’s going down.

Stop, children, what’s that sound? Everybody look what’s going down”—For What It’s Worth: Buffalo Springfield

I saw this NY Times op-art piece and had to stop for a moment:

I admire the sentiment, but the execution is a little rough—The soda labels are good, and factually accurate, but the milk bottle is confusing and the bagged meal label makes no sense.

The soda bottles are clever, eye-catching, and say the right things. Drinking too much soda can lead to weight gain, diabetes, possibly tooth decay, and is generally not supposed to be a staple item.  The average American drinks 53 gallons of soda a year, mostly made with high-fructose corn syrup, or artificial non-nutritive sweeteners.  Irrespective of whether HFCS has a different metabolic path than sucrose (cane sugar), that’s still about 79,000 kilocalories a year to drink (that would be 565 12-floz cans of Coca-Cola classic).  Or in other terms, 20 lbs of fat, in energy terms.  Whether or not aspartame or sucralose have adverse health effects is a debate I’m not going to get into here.

The milk bottle doesn’t make sense to me: the label on the side says “organic” and there’s a big ‘no’ symbol on the big kid, so what do they mean? does it contain rBGH or not?

The bagged meal, is rather confusing as well: what do you mean by “this meal will not decompose for one year”?  Strange, but not really informative.  It sounds a little like the urban legend that Twinkies ® are intended for a 25 year life.  Apparently, they’re designed to last 25 days (see Twinkie, Deconstructed)

Information presentation is supposed to get a message across.  To that end, it has to be (A) the right message and (B) intelligible.  While the point of this is satire, injecting some levity into the recent announcement of more graphic labels on cigarette packages.  Those messages will have some effect, but I think the FDA could do well saying “this product is only available because the tobacco lobby bribed congress members” (appeal to moral revulsion)

For a very good discussion of moral revulsion and how your brain is cross wired, see here:


I’m interested in making sense of how we got here – and promoting conscious, reasoned actions to steer the future. Over the last 100 years, there has been profound change in the way we live, and those changes inevitably influence the immediate future of our society. Our environment determines our actions to a great degree, especially when we do not consider its influence.

By making our path to the here and now sensible and understandable, we as a society can take a measured look at our situation, and consider where we are going. If where we’re headed on the status quo line isn’t where we really want to go, we can make changes in our behaviors, technologies, and environment, in order to end up in a (hopefully) better situation.

An information presentation is inevitably persuasive, and by designing the presentation to be acted on, change in behavior can be effected. As BJ Fogg’s mantra says, “put hot triggers in the path of motivated people” (Fogg, 2010). See Lily’s YouTube video on the topic. This change can be in individual behavior, or in the system—through changes in the built environment or in policy.

Many examples of information visualizations of how our environment evolved have appeared in the media and in academic papers, and they influence the understanding of issues and present conceptual frameworks, such as “Climate Wedges”:

Policy and design decisions have caused us to gain weight, shaped our living patterns, changed the ways we view and use resources, and have modified the dynamics of our relationships. Irrespective of value judgments related to these issues, these changes have for the most part been out of the view and out of the consideration of the public, and more importantly have only considered their impact narrowly.

In order to make reasoned decisions about the future (especially important in a democratic political model), an understanding of the situation is essential, and its historical context. While it is impossible to present information without bias, especially in a persuasive medium, the facts do lean towards certain conclusions.

The Wicked Problems paradigm describes the highly complex interactions underlying issues such as the obesity epidemic, which combines such disparate issues as the development of high fructose corn syrup and zoning laws. Bob Horn’s Mess Mapping visual analysis technique can be very useful in understanding complex problems such as this, and through visual analysis the antecedents to the problem can be determined, and therefore addressed.

A framework for telling these types of stories has been to follow a process or item. Steve Ettlinger’s Twinkie Deconstructed tells the story of the Twinkie, and shows the ‘miracles of science’ part of our food system by breaking down a food product into its chemical constituents (see Dwight Eschliman’s photography of those items, for a real visual treat). The documentary King Corn follows an acre of corn, and ventures into a discussion of agriculture policy and food science. Nicholas Felton’s Feltron reports are an excellent showpiece of how to make data look elegant, but it doesn’t tell as much of a narrative story.

To address highly complex issues, it is necessary to have both a solid understanding of the antecedents, and a method for effecting change. As the obesity epidemic stems from a large variety of antecedents, the issue must be addressed on multiple levels, by policy changes, technological innovations, and individual efforts. Being able to understand where to start, especially at the policy level (which can incentivize changes on other levels of intervention), can make it possible to change the direction of the epidemic.

Parsing data

Data feeds come in machine-type formats, like a CSV or XML.  Which is fine for storing data but not particularly useful for human readability.  Which is where data visualization, or information visualization comes in.  But there’s an intermediate step: parsing the feed.

Lacking critical parts for my Tweet-A-Watt (which have since arrived, thank you Adafruit), I instead used data from my PowerTap.  Which I have plenty of (most rides back to June 2007), and is eminently parseable and simple to visualize.

The Code

Modifying the code provided by the instructors, I made a simple parser and chart generator in Processing.  Man this was so much easier than doing it in Java, in 1999, when I had no idea what I was doing.

// Data parser for CSV

void setup() {
// frameRate(24);  //probably not necessary

//variables for display
int x = 0;
int y = height;
int time = 0;
int watts = 0;

void parsePTCSV() {
String[] lines = loadStrings(“PTData.csv”);    // Load file into an array of Strings (each line is a String)
for(int i = 0; i < lines.length; i++) {        // For each line,up to the length of the line
String line = lines[i];            // read the line into a string
String chunks[] = line.split(“,”);    // Split the line into an array of Strings, using “,” to separate (each field is a String)

if(i > 1) {                // Ignore the first two rows
String time = chunks[0].trim();    // chunk the fields into named Strings, trim edges
String torque = chunks[1].trim();
String MPH = chunks[2].trim();
String watts = chunks[3].trim();
String miles = chunks[4].trim();
String cadence = chunks[5].trim();
String HR = chunks[6].trim(); //Heart Rate
String ID = chunks[7].trim(); //split ID
String alt = chunks[8].trim(); //altitude

//data for graph
int x = i; // set x equal to i.  moves one space to the right each cycle.
int y = height;
float power = Float.valueOf(watts.trim()).floatValue();  // converts a string into a floating point value.
//display data as a graph  – because variables are private, they reside in here.
if (power > 200) {
stroke(255,0,0); //red
else {
stroke(0,0,255); //blue
line(x, y, x, y-power); // draw line

} //end if

// Print the output to verify
// println(“time: ” + time + “, power: ” + watts);    // simple way to print line
println(String.format(“time: %s, torque: %s, MPH: %s, watts: %s, miles: %s, cadence: %s, HR: %s, ID: %s, Alt: %s”,  // formatting line %s for string (in order below)
time, torque, MPH, watts, miles, cadence, HR, ID, alt)); // data line (variables in order
}//end for loop
}//end setup (run once)


what you end up with from there is a nice graph like this:

blue columns: power levels below 200W
red columns: power levels above 200W

Data File: