Playgrounds for Data: Inspiration from NYTimes Interactives

[Editor's warning: This article may be too fun to read. We recommend you wait until reading the entire article before playing with the examples we've given you.]

I recently learned that there's a pattern to how the US Presidential candidates talk about each other during the televised debates. To distinguish themselves from their opponents, they'll often mention an opponent's name when stating how their position on an issue is different, even if the difference is minor.

For example, in one Republican Debate, Former Massachusetts Governor Mitt Romney "politely" pointed out a small adjustment to what Former Arkansas Governor Mike Huckabee had just said, "I don't believe you had the finest record of any Governor in America on education." He then continued to point out his own successes.

I found it interesting that, in the debates leading up to the recent Iowa Caucuses, hardly any of the Republican candidates ever mentioned Governor Huckabee. Senator Barack Obama was mentioned many times by each of the Democratic candidates (and by the Republican Romney a few times, even though he wasn't even in the same debates). While both won the Iowa Caucuses, it seems the Democrats perceived Obama a greater threat than the Republicans considered Huckabee.

Even more interesting to me is that everyone, in almost every debate from both parties, talked about Democratic Senator Hillary Clinton. (In one Republican debate, Romney mentioned Clinton more than 5 times.) One could deduce that every campaign is thinking she's a threat.

Yet, perhaps the most interesting thing to me is not the data itself, but how I discovered it: in a flash-based interactive put together by the New York Times interactive team, called Naming Names. They analyzed the transcripts from the debate and created a clever little tool which shows who talked about whom.

Looking a bit like a Spirograph drawing toy, the designers put all the candidates in a circle. Under each candidate's name is a small bar code, with line widths representing the number of words the candidates spoke. Then they drew arrows to the opponents mentioned.

When you move your mouse over a candidate, the arrows for all of the opponents who mentioned them appear. It's an even distribution, until you move your mouse over Hillary Clinton's name and see the burst of discussion about her. It's not hard to deduce that both sides think she's the person to beat.

This Came From Where?

Mainstream media is often chided for not being hip with the latest in design technology. The New York Times, having started in 1851, is about as mainstream as you can get. Yet, in my opinion, they are a leader in creating interactive modules to accompany their news stories, often yielding in an impressive and fun experience.

The Naming Names interactive is just one of many the teams at the New York Times have produced over the last few years. Looking over their work is a real source of inspiration on how to start with complicated data and turn it into an informative experience for the reader.

Here are some of basic principles we can extract by reviewing a handful of the NYTimes interactive components:

Data Is More Fun When You Play With It

One of the most complicated decisions a person may face is whether to rent an apartment or buy a home. The most cost effective answer depends on the apartment's rent, the cost of the house, the interest of the mortgage, the likely increase in the house's worth, and the annual increase in the rent. Most people, faced with decision, wouldn't know where to begin in figuring out the benefits.

To accompany a story back in April, 2007, called "A Word of Advice During a Housing Slump: Rent", the team put together an interactive called Is It Better to Buy or Rent. Using a calculator, readers can enter in their essential data and instantly see a chart showing when buying becomes better than renting. You should rent when the chart is grey, buy when it's orange.

Sliders from -10% to +30% control the annual home appreciation and rent increase/decreases. Playing with sliders instantly shows how long it will take a house to be worth the investment, if, for example, housing prices are dropping or rents are skyrocketing. Moving the slider a little for the home value's appreciation can show dramatic changes in the graph.

Clicking on a specific data point is even more fun. When you select a point, the chart shows the exact amounts spent on buying versus renting, up until that year. The reader can see how much money their decision has cost or saved them.

All this data could be presented in a multi-column chart. However, because of the interactive nature, there's a game play aspect to the exercise, making it instantly more engaging for the user. Complex mathematical formulas become a video game, with the user trying to optimize the values for their particular goal, such as figuring out when to wait to buy or how long to hold onto the house.

Time is a Fascinating Variable

Since April 2007, the reporters of the New York Times have been following the candidates as they make campaign stops across the country. Not surprisingly, candidates leverage their time in places where they feel it's important.

The NYTimes interactive team applied their creativity to a US map that tracks the candidates. Across the map are circles, the size representing the number of visits to a location. The initial presentation, representing August until now, shows (as of today) a huge number of visits in Iowa (because of the recent caucuses), New Hampshire (from yesterday's primary), and up and down the coasts. Looking at just the Democrats shows mostly focus on Iowa and New Hampshire, while Republicans are spending more time in other states.

Pressing a Play button shows the travel schedules in one-month increments over the period. You can see the candidates constantly returning to Iowa and New Hampshire, interspersed with other trips. Clicking on individual candidates can show their travel schedules, over the same periods.

Playing with data over time shows a different story. You can see, for example, when a specific candidate decided to gear up their Iowa campaigns.

Time is a variable we often don't think about. Non-interactive charts often leave this part of the story out. Adding a Play button to show changes over time can introduce an additional engaging element.

Choosing Variables to Play With

While talking about healthcare costs and care across the country, the NYTimes interactive team created an map that shows Medicare reimbursements, surgery rates, and Medicare enrollees across the country.

Readers can explore total reimbursements or focus on a specific type, such as acute care, outpatient, or surgical reimbursements. Moving the cursor across the regions on the map displays its average compared to the rest of that region's state and the nation.

Again, represented as a table, this data would have hundreds of rows and dozens of columns. It wouldn't be interesting and it would be hard to discern interesting patterns.

Yet, as an interactive map, it becomes a different story. The team has carefully chosen variables that tell us something about medical care in the US. For example, with a quick glance, we can see total reimbursements in San Francisco are about the national average, but much higher in Boston. (There's a band of orange -- representing higher-than-average reimbursements -- from Boston to DC.)

Using color, shape, location, and a clever fly-over display, the team has taken a ton of variables and presented them in a more useful format.

Finding Inspiration

Every organization sits on a ton of data. Making that data useful is a constant challenge for designers.

By looking at what the NYTimes interactive team has done, often with very small time frames, we can see examples of what is possible. From their work, we can learn new ways of presenting complex information in fun and engaging ways.

 Share this article with a friend/colleague.

Join over 25,000 subscribers to UIEtips, our free email newsletter


  • Original articles by Jared Spool delivered to your inbox
  • Podcasts that help to improve your UX skills
  • UX Insights from the brightest minds around
  • Awareness of all things UIE