Human Development Report of United Nations

Visualizing development trends of 187 countries

Project Brief

This is a data visualization work I learned to make from an online course website - Lynda (http://www.lynda.com/Illustrator-tutorials/Designing-Data-Visualization/175720-2.html). It shows a whole picture of 2013 Human Development Report (HDR) of United Nations (UN). Each year, the UN releases its HDR, which looks at the overall progress of nations as measured by one statistic called the Human Development Index (HDI). The complete report contains over 10 tables, each with data of nearly 200 countries and regions. In this project, I picked three table and learned to visualize the data with Excel, Illustrator, and JavaScript.

See completed work at the bottom of this page. (Note: This is not an original work. This page shows my learning process.)

Learning Process

1. Filtering and sorting data with Excel

The HDR data Excel contains over 14 tables, and we pick three of them to visualize:
Table 1: Human Development Index (contains overall index and three components of life expectancy, education, and income for 187 countries);
Table 2: Human Development Index trends from 1980 to 2013;
Table 3: Inequality-adjusted Human Development Index (shows how inequality affects each country's rank).

Table 1: Human Development Index and three components 

Sorting process:
what we want: difference between the HDI rank and component rank of a country
Step 1: Sort country ranks by three different components: life expectancy, education, and income. Then we have four ordering of 187 countries: by  their HDI rank, life expectancy rank, education rank, and income rank.
Step 2: Calculate differences between the HDI rank and one of the components rank. For example, for Norway, its HDI rank is 1, and its life expectancy rank is 13, then the difference is 12.

Table 2: Human Development Index trends from 1980 to 2013

Sorting process:
what we want: rank percentile difference between the country’s 1980 HDI and 2013 HDI
Step 1: pick 1980, 1990, 2000, 2013 to show overall change throughout the entire time period.
Step 2: Sort country ranks by years (1980 and 2013) separately.
Step 3: Calculate rank percentile of 1980 and 2013.
Step 4: Calculate rank percentile difference in 1980 and 2013.

Table 3: Inequality-adjusted Human Development Index

Sorting process:
what we want: rank difference between the HDI and Inequality-adjusted HDI of a country
Step 1: Calculate the difference.

2. Storytelling - pick outliers

Now we have all rank differences in three tables, but what we finally need is to dig out stories from these differences. In this case, we used Conditional Formatting function to set a standard and then catch outliers of each table to deliver stories.

Table 1: Human Development Index and three components 

For table 1, we pick 62 (one third of 187) as the standard for outliers. If one of the three components goes up by more than 62, we mark it green; if it goes down more than -62, we mark it red.

Table 2: Human Development Index trends from 1980 to 2013

For table 2, we went a step further to get the rank percentile rather than just rank in previous data processing. In this way, we know that a country ranks, say, 58% higher than other countries by its HDI. This makes more sense to readers than if we only know it ranks 24th.
We pick 15 percentile points as the standard. If the number is greater than 0.15, we mark it green; if it is less than -0.15, we mark it red.

Table 3: Inequality-adjusted Human Development Index

For table 3, we pick 15 as the standard. If the value is greater than 15, which means they changed in rank by 15 or more rank places based on inequality, we mark it green; if the value is less then -15, mark it red.

Then we drew several outliers in each table. For example, we discovered that the income rank of Equatorial Guinea jumps tremendously compared to its overall rank. We also found that when factoring in inequality, US dropped 23 places in terms of rank. Ukraine, does't have a huge, really high, overall human development, they're ranked 83rd, but when you factor in inequality, they jump up 18 places.
All these interesting findings are the stories we are going to tell to readers with a user-friendly visual design.

3. Sketching and wireframing

Sketching

Types of data visualization

I tried different visualization types to learn to figure out one that fits this project. Bubbles or circles are beautiful, but they are not proper for presenting trends comparison. Finally I picked bar charts and line charts to compare development trends and rank changes.

4. Visualizing data with Illustrator & JavaScript

HDI & three components

Country names (left) & development trends (right)

Inequality-adjusted HDI

Automating visualization with JavaScript

5. Deliver final design

The story

In the final design, several interesting facts are drawn out:

1. Inequality - The Islamic Republic of Iran had by far the most dramatic change in HDI rank dut to inequality, dropping by 34 places. The dubious distinctions of second place goes to the United States (-23). The greatest rise in rank due to inequality goes to Ukraine, which gained 18 places. Mongolia and Moldova followed closely, each juping 16 spots.
2. Trends - Since 1980, only Nambia and Congo have fallen by at least 15% in percentile ranking since 1980. Meanwhile, nine countries have increased by at least 15% during that time, including four (South Korea, Saudi Arabia, Turkey and China) jumping by more than 25%.
3. Education - Just three countries’ education ranks vary by at least 46.75 (meaning a 25% variance) as compared to their overall HDI rank. For example, Oman has an overall HDI rank of 56th while its education rank is 105th. Its education system severely lags other countries in the same HDI range. The other two countries - Ukraine and Fiji - actually have better relative education rankings compared to their overall HDI ranks (+50 and +47 respectively)
4. Health - Life expectancy has by far the most variance between countries. Fourteen countreis have a rank variance of at least 25%. The most dramatic are Viet Nam, whose life expectancy rank exceeds its overall HDI rank by 66 places, and Russia, whose life expectancy lags behind its overall HDI rank by 70 places
5. Income - No other country even comes close when it comes to the difference between its income HDI rank and overall HDI rank, Equatorial Guinea is ranked 48th in income, compared to 144th overall. The closest second to this 96 place variance is Gabon, which has a variance of 47 places

What I learned:

This is the first data visualization work I learn to make and I've got some reflections during the learning process.

1.Processing with data to make it nice and simple is the first step for visualization. It can be tedious but it is necessary and important for visualization later. We need to understand data at a deeper level in order to better work with them. Normally the processing phase can take probably 40% of a project.

2. Catching outliers is one way to deliver stories with large amounts of data. In this case, I use the Conditional Formatting function of Excel to do this work. By filtering data, we notice hidden problems and can further delve deep to uncover stories.

3. Storytelling sense, the subtle perception of what should be conveyed rather than what can be, plays a vital role in data visualization. In this case, for example, when we deal with development trends (table 2), we went a step further to get the rank percentiles rather than just ranks. This is because percentile differences make more sense to readers than simple ranks. We can easily understand what 58% ranks stand for, but we don't know what 24th rank means. Therefore, we need carefully pick formats of data to visualize and ensure that the work really aids audiences' understanding or decision-making.

What's Next

My next goal is to give "life" to data stories - learn to make interactive data visualization work with processing and D3.js. I will also continue to learn JavaScript and other programming language through small projects.

Completed Work