World-Aid-Transparency-Interactive-Mockup-v2

Visualizing World Aid Transparency

The assignment for the third week of Alberto Cairo’s Introduction to Infographcis and Data Visualization online course was to create a mock-up of a data set on world aid transparency based on this article on the Guardian Data Blog, using information from a report by Publish What You Fund.

The instruction’s from Cairo:

Your goal is to think about how an interactive graphic based on those same data should look like. Imagine that you report to me (your managing editor) and you wish to make a proposal for a visualization based on this. How would you convince me that your idea is relevant? You will need to show me detailed sketches (made with design programs or by hand) to do that. What kind of graphics or maps would you need to tell a compelling story? How would you extract meaning out of the Guardian’s data and the report? What would you highlight in the main headline and secondary headlines of your graphic? How would you give context to the data? How would you navigate the graphic? Your main goal this week is to produce a detailed sketch of your interactive graphic.

Each person in the course would then post their mock-up or sketch somewhere and link to that in one of the forums for the course.

The most challenging aspect of this for me, and I think for many others, was the esoteric nature of the topic. Being totally unfamiliar with world aid, and transparency, I had to spend a fair amount of time just reading through the information in the Publish What You Fund report. (As an aside, I found it quite ironic that an organization advocating transparency, did, I think, a fairly poor job in making their information accessible. The report is full of jargon and acronyms and obscure references.) All part of the journalism process I suppose.

Anyway, spending so much time trying to get familiar with the material left little time to actually work on my mock-up for the interactive visualization proposal.

This mockup shows three different “screenshots” of the proposed visualization; a top level, then a depiction of what would be shown if the user hovers over a certain area, and another depiction of what would be shown in response to user interaction. The speach bubbles are meant as notes to show what would happen, and would not be part of the visualization itself.

My main focus was on showing the flow of aid from one organization to it’s recipient countries, the third and lowest panel in the mockup.

As pointed out by Alberto (I’m absolutely amazed at how much commenting and interacting he’s doing with 2,000 students), the colors in the lowest panel are probably not needed. On reflection, they’re a bit garish and a better solution would have been to use a rollover effect on each line to colorize it and add additional details.

My attempt

I can’t say that I’m very satisfied with the outcome, and, reviewing the work submitted by others in the course, there are certainly much better attempts.

My wife, who is also taking the course did a much better job of both researching the subject matter and in her mock-up.

And a few other examples of student work that I found interesting. I haven’t had the time to explore them all so this is just a small subset of what I’ve seen.

Jan

Anna

Ramiro

Yves

Ben Steward

Tina Frank

Laís Scortegagna

Pretty amazing to see all the diversity of approaches and presentations. Another student, Mike Kinde has blogged about his experience with this project as well.

All in all, kind of a challenging project but worthwhile. Now it’s time to work on this week’s assignment – an interactive visualization of US Unemployment.