How We Visualized America’s Food and Drink Spending

One of our favorite things about data visualization is that every single project comes with interesting people, a whole new context and a different story to tell. Recently, we had the chance to meet the people from the Bundle headquarter, to dive into a bunch of interesting data about food and drink spending in America and to develop an exciting infographic. Now we would like to let you take a glimpse behind the scenes.

The Story

You know it’s hard to track all your spending and to be in full control of your personal budget — even harder in busy times. Not everyone is as disciplined as Nicholas Felton and keeps every single receipt of a Starbucks coffee. That’s where the young but fast growing online platform Bundle comes in: Their service is called Everybody’s Money and is a mix of anonymized credit card transactions and governmental data. It aims at helping people to compare their savings and spendings all over the United States, in all possible categories. Have a look at the short introduction movie:

After a full year of collecting and providing data, Bundle engaged different designers to participate and create a series of reports to summarize America’s total spending. Stefanie Posavec, an American artist living and working in London, introduced the series with the holistic 2010 Bundle Report. This introduction was to be followed by a closer look on the “Food & Drink” spending category, which we had been asked to take care of.

The Creation

The “Food & Drink“ category is composed of spending both on dining out as well as groceries. For these two sub-categories Bundle provided us with a complete dataset for 50 states and 95 major cities. As Bundle wanted to publish the final infographic on their website, the width of the format was limited to 610 pixels. These were the cornerstones. Now, which is the most suitable visualization method to achieve a simple and yet creative infographic? Walking this thin line between readability and visual complexity is always a challenge but fun to master.

After structuring the data file, the first goal is to gain a primary, rough visualization. In this way, you get a nice overview and you can even make first conclusions about data quality and emerging patterns.

Our main intention is to make the huge differences in spending amounts visible, not only for the “Food & Drink“ total, but also for the two sub-categories “Dining Out“ and “Groceries“. In order to hit the nerve and make the visualization something that exceeds a plain reproduction of statistics, we started compiling questions of interest: Where do hedonists live, which is the town of home-cookers and where is saver’s paradise? With a width of only 610 pixels at our disposition but no vertical restrictions, a top down ranking with stacked bar charts seems to be the perfect match to illustrate these moments of contextual relevance.

Another decision to make was whether to refer to the complete dataset that contains a broad range of states and cities, or to focus on a smaller selection. We opted for the display of cities only, because people tend to have a stronger empathy with a concrete place — we are all some sort of local patriots. As not to neglect the scope of the data set, we decided to include all cities rather than generating hitlists, for example top or bottom ten.

Below is one of the first drafts made in Illustrator. The bars on the left represent the average spending amounts on dining out, the bars on the right the average spending amounts on groceries. The sum up of both sides is the average spending on food and drink per household in 2009, with one line representing one single city.

Looking at this draft, we wondered about the relation of a city’s spending amount and its population. Do inhabitants of a bigger urban space spend more money than others? To find the answer, we compiled the population numbers of all cities and added this dimension to the visualization by adjusting the bar’s height of the city in question.

Now the basic framework is constructed, but a narrative layer is still missing. Our idea was to highlight cities that step out of line by attaching a speech bubble which labels the specific interesting characteristic and underlays it with key facts. By only reading these highlights, you can get a fast and easy access to key information. If it grabs your attention and you want to explore more data, you can go into the details and, for example, discover where your city ranks.

The Visualization

To distinguish which cities rank above and which below the ordinary food and drink cunsumption we integrated a horizontal bar and vertical lines representing the U.S. average of spending on groceries and dining out respectively. And finally, to add the finishing touch, we arranged every single pixel, added all the labels, and inserted a header and a footer.

What are your thoughts? We are very interested in your thoughts on the presented process and the final infographic, so please share your opinion with us and comment below.

This project was realized by Interactive Things. As publisher of Datavisualization.ch we regularly give you insights into the development processes of our own work.

Wanna have your work featured here?
Submit a link!