Data visualization, for a designer, is the process of taking a complex structure and breaking it down in a way that the reader can easily comprehend. It is a powerful tool used to translate complex data into accessible insights.
In this article, I’ll explain the four critical steps we took to create a visualization graph for the World Economic Forum (WEF).
Step 1: Decipher the Data
The first step in any data visualization process begins with unpacking all of the elements and establishing the goal of the visualization or infographic. First we needed to figure out what problem we were trying to solve and, from there, start to conceptualize the solution. As designers, our task was to decipher the data provided and clearly translate it for the viewer.
The Networked Readiness Index (NRI) is an index comprised of four sub indexes and ten pillars. Starting with the information provided in the figures above, our design challenge was to integrate both of these competing concepts into a singular visualization.
Step 2: Iterate…Iterate…Iterate
We embarked on an iterative process exploring a variety of graphic structures before we reached a solution where the viewer could unquestionably discern the data. We iterate because we know that we won’t get it right the first time – or even the second. Iteration allows us the opportunity to explore until we ultimately arrive at a solution that works.
There are many different styles of graphs which can be used for data visualization. We explored two types for this project: the radial partition and the venn diagram. The radial partition graph displays hierarchical data on a radial system by splitting up the sectors of a simple pie chart on different rings. Venn diagrams are specially designed diagrams that show all possible logical relations and capture the relationships between different categories and levels of information. Through the process of iteration, we discovered that the venn diagram seemed to capture the information more accurately than the radial partition graph.
Step 3: Create a Graphic Narrative
Once we understood the message we needed to communicate, we then needed to create the visual language to articulate it. Curating the appropriate visual elements is critical, as the goal of any effective visualization is to allow the viewer to interpret information rapidly.
A graphic narrative may contain a variety of visual elements. For example, color can be used as an indicator to accent data points or create classes of separation, and iconography can be utilized to support user comprehension. It is critical that whichever visual language you choose, it should always minimize the viewer’s time to interpret the data. The choice of visual representation, whether it is an illustration, icons, visual elements, or graphs, is that it is effective and aligns to telling the story accurately.
The goal of a graphic narrative should be to make a subject accessible to the user. It is about delivering clarity without diluting the data’s complexity. Rather, it should be made more digestible through elegant presentation.
Step 4: Completion Checklist
A successful visualization should: a) clearly translate the message, b) reduce cognitive overload through visual language, and c) engage the viewer. In other words, the key for a successful visualization or infographic is to clearly and concisely tell the story.
Here is our final visualization, which integrated the supplied sketches and included a Venn diagram and use of icons and color to communicate the framework for The Networked Readiness Index (NRI) for the WEF 2015 report.
Projects & Insights
Content-Heavy Websites: Designing for Density
How timeless design principles like white space, spacing, and layout help us address
Web Animation: Delightful or Distracting?
Web animation can amuse your users and increase engagement with your site, but used i