For all of its dullness, statistics remains one of the most reliable sources of interesting factoid available. Do you know for example that Australians drink 1.7 billion litres of beer per year, which averages to 680 bottles of beer for each adult? That’s almost 2 bottles per day. For a scientific article or anything that is inherently argumentative, statistics forms the backbone of your argument, it’s an inherently objective metric that could be used to bolster the point you’re trying to make.
While it is possible to express statistics with words like the example above, statistics is mostly rendered in charts and graphs, a practice that is commonly referred to as data visualization. With the progress of web design in the past several years, it is now possible to render these data and statistics into a more dynamic representation, incorporating interactive features to better suit the needs of the users.
Data visualization in modern web design
Modern data visualization is a far cry from those simple 2D charts of x and y axis we’re used to in high school. It is possible for example, to create a sophisticated 3D visualization model or an interactive chart, in which the amount of data being displayed depends on what the user wants to be displayed. There are too many possibilities to cover but there are still some common ground rules that data visualization abides to, which are:
- Keep in mind the characteristics of the audience
Data is only useful if you know how to interpret that data into something concrete. Purely speaking, data visualization is a way of making those data look more presentable, but sometimes, it also involves the discussion on how to make those data more digestible. For example, a writer for a strictly scientific publication might want to include a way of delving deeper into the data, with interactive buttons that allows them to see the details behind each set of data.
On the other hand, a writer from a general news publication would prefer to present those data in the simplest and clearest way possible and explain exactly just what the readers are supposed to infer from the data being presented. The difference between presenting to a focused group and a general audience is the amount of context. A focused group would prefer to get into the gritty details of the data while the general audience requires a certain amount of hand-holding.
- Incorporating the concept of visual salience
Visual salience is the idea that certain visual characteristics can make objects in the world stand out from others and grab our attention. Garish colors like red or purple for example is certain to catch your attention and in writing, bold letters are used specifically for their boldness. In data visualization, we can use this concept, making use of size, color and bold lines to separate between different sets of data or to underline specific ones to underline their importance.
- Implement storytelling to create a narrative
Whenever you’re displaying a visualization of a historical trend, you could use this as an opportunity to craft a narrative based on the highs and lows of the displayed data. Including proper historical context, like what went on in the background when the data hits an all-time low or what pushed it to hit a particular high, can lend your visualization with a narrative flow, giving historical meaning to what might seem like a collection of random valleys and peaks at first glance.
- Incorporate legends and other additional info straight to the data
People have a nasty habit of including legends and other contextual information off to the side or to the bottom of the chart. This method is problematic because it essentially forces your reader to constantly shuffle their eyes between different parts of the graph just to understand what exactly is going on. For physical texts and static websites of old, it is understandable, as including that much text into the graph risks overwhelming the data. In this modern age though, it is simply unacceptable.
Thanks to the progress web design has made, it is now possible to use a hover effect or a form of collapsible content to display contextual information for data visualization. With this method, you can keep your charts and graphs relatively clean, with additional information available for readers only if they want them. Just make sure that the reader knows that additional information is available by adding a note of some kind.
Simply beautifying the data isn’t enough; data visualization also aims to help readers in understanding just what those data means and what relevance does that data have for the readers. A balance needs to be struck between complexity and clarity so as to keep your readers from being overwhelmed while still providing them with enough information.
Admittedly, it might seem tempting to incorporate exotic shapes and subtle visuals to present some sort of a surreal, exploratory visualization but what’s beautiful might not always be coherent. As always when it comes to functional design, try to put yourself in the shoes of your audience and try to think of ways of making it easier for yourself without sacrificing your aesthetic goals.