Infographics and Data Visualization Class: A Few Last-Minute Mock-Ups

The class is over, and unfortunately I fell behind on uploading data visualization drawings. These are the sketches I did for the final two assignments, week 4 and week 6.

In week 4, Alberto Cairo asked us to work with some unemployment data. There isn’t a media outlet that hasn’t covered unemployment with an infographic or data visualization. I decided to create an interactive graphic that answers the question I don’t see answered in any others: what industries were hit hardest in each state?

I usually don’t go for maps, but I feel like this would be a good way for a typical reader to decide if iconic geographical regions were affected in ways we’d expect. Did the steel states lose their automotive jobs? Did the breadbasket of America lose agriculture workers? I tried to represent the state’s primary industry losses with a little icon for a large NAICS or SIC code series. It’s data that would be easy to grab from BLS, but only further investigation would show whether every state would have the same icon on it.
unemployment interactive graphic

This is the mock-up for my final infographic design, based on construction injuries and fatalities. I decided against a map here; just a few simple illustrations of the numbers and trends that I found in the data.
worker injury graphic

A lot of people have asked me whether they should take the class, and what to expect. I think it was great! The fellow students in the forums made a fantastic community for reviewing visualizations and making suggestions. And the lectures and readings are great insights into how newsrooms with great infographics teams approach their projects. And it’s free, so there’s no way to lose!

Infographics and Data Visualization class: infographic design part 2


Here’s the second of a series of posts regarding the design of an infographic regarding foreign aid transparency data. This time, I’ve included a panel for a US-centered story, more horizontal graphs, and a unified color scheme.

Infographics and Data Visualization class: infographic design part 1

This week’s assignment for the Knight Center’s MOOC involves designing a visualization around foreign aid donor transparency data. My design is simple, but it involves the inclusion of another set of data to measure the big donors against the little donors (courtesy of AidData 2.0). I’m hoping to make this into a full interactive visualization with Tableau–assuming I get enough complete data from AidData.

Feedback is welcome! First, the complete visualization:

These were the questions I decided that the visualization should answer:

Infographics and Data Visualization class: graphic revision

I’m currently enrolled in the Knight Center massively open online course, taught by Alberto Cairo, a well-known infographics designer and instructor. For this week’s assignment, I decided to revise the infographic we critiqued: the New York Times’ visualization of words used by speakers during the past year’s party conventions.

I found it a bit lacking, since the content required a great deal of scrolling and the interactivity was not fulfilling. I felt that with a little more reporting and design, it could provide more context and be less of a wide wilderness for the reader. Here is my suggestion:

Hopefully you’ll forgive the rough quality of my sketches, but I think they do well to convey my idea (Alberto Cairo has encouraged us to render our revisions any way possible–I took the “pencil and paper” suggestion a bit like a challenge!). I combined another student’s suggestion of adjacent bar graphs with a more content-rich dashboard on the left. Upon first visiting the page, the reader would see a deck describing the methodology and a basic display of the most frequently used words and who used them more. Mousing over the boxes that make up the graph displays a little quote bubbles from a few of the most notable uses of the word (instead of giving the audience every relatively insignificant use of every keyword). The rate I displayed was one quote per use of the word per 200,000 words spoken at the convention. The boxes were inspired by the New York Times’ user-generated visualization of short responses to the death of Osama bin Laden. Except that this one features a twist:

Text is much more valuable when we can indicate tone, and a majority of these speeches are recorded. If the number of highlighted quotes were manageable, appending a sound bite to each of the boxes would allow the user to click on the box to hear the actual quote. This brings a wealth of comparative value to the visualization, as the simple text doesn’t allow me to compare the tone with which a Republican or Democrat is likely to say something like, “The passage of Obamacare will bring enormous changes to our healthcare system.”

Clicking on a box changes the right-side dashboard to also deliver a layer of context. First, the reader can read the entire speech, but most importantly, it allows the reader to see the eventual point being made with the use of the keyword at hand. Second, there’s the opportunity to listen to the quote again. Third, since each individual’s speech is already tagged in the original visualization with the number of times they use each keyword, I think it would be useful to see a graph of the keywords used by the speaker: it give the reader a good general idea of the speech’s theme. Maybe, if I click on a quote that uses the word “better” and find the quote, “Obama/Romney will make things better,” and then see that the speech used the keyword “economy” the most, I can infer that the speaker’s primary concern was of the economic state of America.

The visualization isn’t perfect, of course. I would prefer to display all of the details without relying on two scroll bars, for instance. Having smaller boxes would be preferable, to include as many quotes as possible–but that would mean work for the newsroom. I think there’s probably a reason why the New York Times came up with a relatively light visualization for this news item, so my suggestion is sort of a “what if” projection.

Think it’s better? Worse? Leave a comment!