Redesigning our interactive data visualizations
How our data visualizations have changed, our plans to improve things further, and how you can help.
Our mission at Our World in Data is to publish “research and data to make progress against the world’s largest problems.”
To achieve this, we are building a team with diverse skills and backgrounds. Our team’s researchers and data scientists bring together and explain the data and research. Designers and software developers build and maintain the online publication you are reading now.
Usually, our researchers do the writing; in this article, we flip things around. Three product and engineering team members discuss our recent work on a major project: the redesign of our Grapher, the tool that displays our data in interactive visualizations.
In this article, we talk about the changes we’ve made, why we made them, our plans to improve things further, and how you can help.
Redesigning our data visualization software
Maintaining and improving the software that powers our interactive data visualizations is a significant part of our team’s work every month.
However, the latest round of changes marks the outcome of a more substantial and concerted effort to rethink and improve the layout and functionality of our charts.
This is what the Grapher looked like before the redesign we launched today:
And this is what the same chart looks like in the now redesigned Grapher:
The updates fall into four categories:
- Selecting a view
- Downloading and sharing
- Highlighting the data sources
- Enabling full-screen data exploration
Selecting a view
Most of our graphics allow you to view the same dataset in multiple ways: as a chart, a color-coded map, and a spreadsheet-like table. To switch between these different views, you can click on the buttons in the upper left corner of the graphic:
Within each view, you can fine-tune how it is displayed and highlight specific entities within the dataset through the controls in its upper right corner. Each view’s controls are slightly different, containing just the settings relevant to what you’re currently looking at.
Chart views
Charts allow you to narrow down the elements of a given dataset by selecting among their ‘entities’—frequently corresponding to countries, regions, and continents. Click on the Edit countries and regions button to open a menu allowing you to include additional countries or remove countries currently in the chart.
To make changes to the style of the chart rather than its contents, click on the Settings button to open a menu with all the configurable options for the current chart. For instance, many charts allow you to split the data, presenting it as multiple discrete graphics rather than overlaying multiple lines on a single pair of axes. The Align axis scales switch toggles whether the y-axes on the charts are kept constant to allow for country-to-country comparisons or are zoomed to show the range of values in each country independently.
Table views
Tables now have enhanced contrast between rows and more consistent alignment to improve their readability. Their rows can be re-sorted by clicking on the column headings, and include summary statistics when a range of years has been selected using the timeline slider. The switch in the upper right corner allows you to examine just the table rows that correspond to entities specified in the chart view.
Map views
Maps typically show the entire world by default but can be focused on particular regions using the menu in their upper right corner.
Clicking on a country on a map will take you to that specific country's chart view (when applicable).
Downloading and sharing
The downloading and sharing options are in the bottom right corner. The download menu offers graphics (SVG or PNG files) and tabular data (CSV file). The sharing options include quick sharing of the chart on X/Twitter and Facebook, and provide an embed code to include interactive charts on your website.
Built for reuse
Reusability is at the core of our Grapher tool. All our interactive visualizations are free to use and can be embedded in your own website using the code snippet provided in the download menu. You can see this in action, for example, in this article by the charity GiveDirectly.
As with every other tool developed and used at Our World in Data, the Grapher is open-source. You can find all the code in a Github repository, published under the MIT license.
Sharing dynamic previews of our charts
When you share a link to a Grapher chart on social media or messaging apps, we will show a preview thumbnail that shows the exact chart configuration.
So, for example, if you're looking at a chart of population growth in South Korea, you will also see a preview for South Korea. The same also works if you've selected a different tab, changed the timespan, selected multiple countries, etc.
These previews will appear on Twitter, Slack, Facebook, LinkedIn, WhatsApp, Signal, and many other platforms.
Highlighting the data sources
Our World in Data brings together data published by a wide range of sources to make it more accessible and understandable. However, the data is only there thanks to the dedicated efforts of the statisticians, researchers, and institutions that produce it and make it available for reuse. For this to continue, these individuals and institutions must receive the recognition they need to continue their essential work.
In each of our visualizations, the source of the data is always displayed prominently. Clicking "Learn more about this data" shows an overlay with more in-depth information.
Enabling full-screen data exploration
Finally, the full-screen zoom button allows you to expand any chart to use your entire browser window, which is especially helpful for pages containing many smaller charts or getting a closer look at data in tables.
What’s next?
We are already planning some new and improved features for the next release of Grapher. Upcoming improvements include a whole new country/entity selector, an optimized mobile experience, a new and improved Sources view, support for multiple chart types in a single Grapher, animated transitions, and much more.
In the meantime, we welcome any suggestions you might have as we strive to make our charts even more readable and configurable, empowering you to dig even deeper. You can leave us your feedback by clicking on the “Feedback” button in the bottom right corner of our website.
If you’re interested in talking to our design team on a 45- to 60-minute video call to discuss your experience using Our World in Data and how we might improve it, please fill out this form.
Reuse this work freely
All visualizations, data, and code produced by Our World in Data are completely open access under the Creative Commons BY license. You have the permission to use, distribute, and reproduce these in any medium, provided the source and authors are credited.
The data produced by third parties and made available by Our World in Data is subject to the license terms from the original third-party authors. We will always indicate the original source of the data in our documentation, so you should always check the license of any such third-party data before use and redistribution.
All of our charts can be embedded in any site.