African Bond Markets (AFMI) is an NGO created to help promote and encourage investment in Africa via African government bonds. It was created by one of our other NGO clients - the African Development Bank together with other partners such as Thompson Reuters (news agency).
One of the aims of the web site was to showcase key data regarding african government bond prices, GDP data and other relevant financial information. Live data feeds for this information was provided by the client and the challenge here was to display this information in a way that was engaging, informative, easy to to digest – and ultimately helped the key audiences for this website.
Initial data visualisations
For the current design of the website which we initialled produced, the data is shown for individual countries on their respective country pages.
A simple table is used to display all the data values together for the available years:
Two graphs are then used to compare and contrast two key sets of values:
For the first graph (combined bar and line graph) we devised to display a bar chart of the total debt for that country combined with a line graph of the percentage GDP – both per year. This allows someone to immediately get a sense of how debt is growing (or shrinking) in proportion to GDP over time for a particular country i.e. giving the viewer an immediate sense of how able this country is to repay its debt so they can assess the risk v reward ratio. This graph is also interactive, allowing a reader to hover over particular parts of the chart to get exact values for either the GDP or debt for a particular year (and country).
For the second graph we decided to represent the ratio of government bonds to bills by using a stacked bar chart. This gives a reader a sense of how the relative proportion of these two metrics (short term v long term government debt) changes over time – and again the graph is interactive so hovering over particular bars in the chart displays exact values for these at particular points.
Other relevant information is also shown on the country pages, such as related news articles and related documents.
Improving the data visualisations
Now that the site has launched and has been running for sometime, it was a great opportunity to reflect on what we did with the data visualisations on this site and see how we might improve and further enhance them.
One aspect to bear in mind is that this site, like other NGO's of this type have their own specialised data portals which allow website users to drill down into and export very granular levels of data.
This is AFMI's data portal for example:
The portal serves an essential purpose of course, providing a level of data and specificity suitable for government officials, academics, and other researchers that require this level of detail for the work that they do. This then begs the question – given such a data portal and what it provides – what should be the point and purpose of any data or visualisations on the website itself ? Is there any point or possibility beyond mere cosmetics to do something there thats actually useful and different to the data portal ? To simply duplicate some or all of the information provided in the portal would perhaps seem redundant and pointless.
Some differences and objectives for website data visualisations as opposed to data portal visualisations might be:
- To highlight key insights in the data or comparisons for website audiences
- To innovate with more engaging and adventurous data visualisations that might only be possible with a smaller or more focussed number of data sets
- To encourage more engagement with the data available in the data portal by demonstrating interesting insights highlighted by richer and more innovative data visualisations – that are more easily showcased on a website than a specialised portal
Another aspect I considered was what other views into the existing data on the website might be useful for it's target audiences ? One thing that struck me was that all of the data was shown only within and individual country context – there was no ability to compare country data in different ways. Yet this might be one of the very things website audiences might be seeking to do – for example potential bond investors looking for good countries to invest in, or government officials looking to understand the attractiveness of their bonds relative to other countries.
With these aspects in mind I have looked at 2 new visualisations that aim to address these.
Continental map based visualisation
In this view, all countries covered by AFMI are displayed together in a continental map of Africa. You can select a particular metric from the drop down under the map and then this alters the shading colour for a particular country, based on that countries value for that metric (i.e. a Choropleth map). You view the metric value for a particular country simply by hovering over that country.
Using this map, at a glance its very easy to see a particular countries metric value in relation to all other countries – as well as being able to quickly identify the highest and lowest value countries for that metric across the whole of Africa – something previously not possible on the site. All the 4 main metrics used on the site are selectable for this map, making it possible to compare all of these in this way.
Bubble chart based visualisation
Wheras the Choropleth map allows us to compare one factor over many countries, a bubble chart can allow us to compare up to 4 different factors simultaneously across countries. While the Choropleth allows us to see differences more easily, the bubble chart can help us view correlations between countries more easily.
For this particular chart we have selected bonds and bills as the x and y axis respectively, the bubble size corresponds to the country's GDP value and optionally – year can be used as a fixed selection or one could animate the whole chart to cycle through the years available.
How can this graph be useful ? If we look we can see for example in this sample data set, Cameroon and Ghana might be considered similar countries – they have a similar ratio of Bills to bonds, as well as a similar GDP (they are in a similar position in the graph – and have a similar bubble size). It is much easier to see these kinds of relationships with this kind of chart. If you had considered Cameroon as a potentially good country to buy bonds in, this might lead you to consider that Ghana's bonds might also be worth investing in for a similar risk/reward profile.
If we introduced time as a animated feature (cycling through the years automatically, as mentioned previously) this would also allow us to see easily how these relationships have changed over time – how countries have go to the position they have – and perhaps even – the trend of where they might be going. This kind of graph has been used to great effect for example by researcher Hans Rosling in his very entertaining and enlightening TED talk looking at how life expectancy has changed across countries over time.
In many ways, this chart could serve as a very useful discovery tool – revealing new insights and relationships that would be difficult see with the existing very limited data and graphs, or even with the granular level of data offered by the data portal.
This could therefore offer new insights for website target audiences, such as NGO's, researchers, government officials, as well as potential investors.
Conclusion and further information
From a purely data perspective, this project presented some interesting challenges in terms of:
Using live data sources from many different data sources
Representing the data in a way that was useful for the intended audiences, quick and easy to understand, yet containing more detailed breakdowns that could be examined if desired.
The range of site users includes a diverse range of audiences including students, academics, journalists, commercial banks, investors and government officials.
In this article we have also looked at some potential new visualisations that offer new insights into the data for the various audiences that will be using the site.
Pranath is our back-end developer who knows the deepest, darkest secrets of our CMS of choice - Typo3. In his free time he likes to balance the mind and body doing plenty of hot yoga, freediving, SUP, or balancing on his new slackline in front of the old west pier.