Storythinking: An Honest and Effective Approach to Data Visualization

At the intersection of design and development - data visualization is a discipline that requires particular attention, both from the client during planning and from the development team during implementation.

As a frontend developer with a particular passion for data visualization, you can imagine my excitement when a realization popped into my head: what is frontend development but the visualization of data!

Data visualization is no longer a niche. It is an industry standard.

And it applies to more than just charts and graphs. It applies to user interfaces, to web design, to applications.

A strong visualization of information has the power to communicate a concept in a simplified, space-efficient manner. Properly designed, it can immediately catch the eye of the user and simultaneously present them with critical information.

At the intersection of design and development - data visualization is a discipline that requires particular attention, both from the client during planning and from the development team during implementation.

At Netguru, we are aware of such intricacies when it comes to data visualization and the responsibility that comes with their honest creation. In a separate article, I described one particular approach to the no-longer-niche idea of visualizing data: Storythinking.

In essence, ‘Storythinking’ is the combination of ‘compelling storytelling’ and ‘critical thinking’. It is about applying a balanced approach to data visualization that touches both on the production process (how to communicate a compelling story with data) and the audience (how to read visualizations with a critical eye). The ‘storythinking’ approach is a unique way to look at the balance of making a visualization stand out, but in an honest manner.

An Honest Representation

A well designed visualization can have a huge impact on users.

It can be used, for example, to simplify complex topics, or to tell a compelling data-driven story. However, like other stories (daily news for example), it also has the potential to be ‘spinned’ to share a particular biased perspective. Decisions such as the selection of the data you choose to visualize, the colors you choose, the scales, the animations, etc., each have an effect on the end user.

Applying this approach ensures that the product is an honest representation. Questioning the visuals we are producing during design and development ensures that we do not release manipulative visualizations that only tell one side of the story. As developers, we ensure that we are responsible not only for our code, but for what our code produces for the end user.

Efficient in terms of time and code

But not only is storythinking an honest approach to frontend development; it is also an efficient one!

Thinking through the potential user interpretations of a webpage or of a chart before starting to code saves time on future iterations. By implementing only the elements of a visualization that provide unique meaning ensures that developer time and effort are targeted only to where they truly add value

Each additional feature has the potential to clutter the code base and the UI, so particular care should be given to ensure that each component of the visualization truly provides unique information. For example, if a scatterplot has colors, it should not have colors just to be colorful, but the differences in colors should map to a particular variable.

Furthermore, a visual that aims at producing a balanced representation of data is more sustainable than a visual that aims at showing one particular side of the story, because in the former changing the data should not require a change of the code of the chart, whereas in the latter (if the visual has been manipulated to communicate a particular story) changing the data would change the story.

A Team Approach – A Better Product

But it’s not enough for just the client or just the developer to take this approach - for the best results, both pieces are necessary.

By regularly consulting with Netguru developers on the design and implementation of a map, one large US client was able to not only optimize the visualization, but ensure that the data was being validly represented to the end user.

While the client has initially suggested that the map only show a selection of markers in order to speed up the app, after discussions with the development team, it was clear that there were better alternatives.

Instead of thousands of markers (which was slowing the app), or only showing a selection of markers (which would not show an honest representation of the entire dataset), the group opted for implementing clusters that would zoom in to a particular region when clicked. The app speed was dramatically improved and no biased selection of a subset of points to represent was necessary.

The client knew what needed to be communicated and the development team could share the alternatives of how that story can be mapped to the screen in a valid manner. Engaging both parties in ‘storythinking’ when developing a visualization has the potential to produce clean visualizations that are effective, meaningful, comprehensible - and most importantly, honest.