The greatest dataviz, that nobody has seen…
A picture is worth more than a thousand words, right? This expression is one of the reasons why data visualizations are often seen as an answer to tell difficult stories, but it’s still hard to understand a complicated story. And when you’re finished with your hard work as a designer, you want people to view and study your data visualization and not recoil from a possible information overload. Information overloads are seen as one of the biggest conversion killers, and we want to prevent our data visualizations from becoming meaningless.
According to Hulick (2011), the process of user onboarding could help users adopt a new product. They could guide users in the conversion and/or learning process by applying existing user onboarding patterns. How can we use the learnings from UX designers who already dealt with these onboarding issues and apply their solutions onto our data visualizations?
One step back.
“Remove to improve” — it’s an expression used in countless professions and can, crazily enough, also be applied to data visualizations. Edward R. Tufte introduced the concept of data-ink ratio in his classic “The Visual Display of Quantitative information” in 1983. The concept talks about removing most of the non-data ink/pixels to improve the data to tell its story. Most people who are serious about data visualization will or have probably come to know this concept. The data-ink ratio can easily be applied to dashboards and other visualizations where you expect the audience to already be interested. But what if you need to convert people and get them engaged towards your story? By applying the data-ink ratio and holding onto it too much, we could lose our users within the onboarding process, because maybe we’ve removed an easy to digest piece of context.
I think there are several reasons why designers should consider onboarding, but I want to highlight three of my main reasons: ambiguity, irreversible growth of data and conversion.
Ambiguous figures
One of the reasons why we should consider onboarding is because of the ambiguity of data visualization. Most data visualizations are telling multiple stories at once. Now you might think; how is that possible, it’s only one figure, right? It has everything to do with the “curse” of knowledge and Steven Franconeri pointed it out during the Openvis Conference 2018: “Knowledge and expertise can literally change what you see.” When I create a more complex visualization about a certain topic, experts about this topic are likely to see this visualization differently than I do. The visualization tells them a more detailed story. It’s like an “Ambiguous Wally” figure: whenever you spot Wally in a “Where’s Wally” figure, the figure looks different because you’re now cursed with the knowledge of Wally’s location.
Onboarding can help a lot by making data visualization less ambiguous.
Growth of data
Besides us humans being responsible for the growing amount of plastic into our oceans, we’re also responsible for the ongoing growth of data. Data is growing, but with help of intelligent software we can unfold these big piles of data and discover the relations within. But we still have to tell the story of the unfolded, complicated data. Most graphs, for example line graphs, bar charts or scatterplots, are well known to most people. Main reason for this is that we have been taught the function of these graphs at primary/high school. The only problem with these kind of graphs is that they’re not always able to tell highly complicated stories efficiently. Maarten Lambrechts (2018) suggests that we should all start acting like William Playfair (great inventor of the bar chart and line graph but also the pie chart 😢). By creating more custom and perhaps weird visualizations we could solve this problem.
Within these custom visualizations we can combine multiple dimensions at once, which provide the possibility for getting better insights out of complex data. But these custom visualizations need some kind of onboarding to reveal their true power.
Conversion
For this it’s maybe nice to have a look at Reif’s Larssens Fairly Unscientific Graph of an Infogasm. As mentioned, it’s unscientific, but it shows Reif’s process of processing information when he looks at an infographic. First, Reif is really excited about all the information he instantly understands…..then he realises he doesn’t…….and then he gradually starts to unfold the infographic like reading a paragraph.
From a conversion point of view, it’s important to realise that people need to understand quickly and easily how the data visualization works and what it could mean to them. According to research conducted by Lindgaard, Fernandes, Dudek, & Brown (2006), people make up their mind about a website in the blink of an eye. I don’t know to what extent this conclusion applies to data visualization, but it tells us something about their attention span. We might grab their attention by gradually telling people a story.
Dataviz meets UX onboarding
The focus of UX onboarding is all about turning first time users into product experts. UX onboarding patterns mainly fulfill 4 different jobs: familiarize, learn, convert & guide. By making use of these patterns into our data visualizations we can help our users become awesome experts of our creations. Since last year, I have seen several onboarding techniques being used in data visualizations: inline cues, tutorials, play throughs and wizards.
Inline cues
Inline cues (or coach marks) are already being used in data visualizations for multiple years and they point out where and how you actually should view the figure (example). These short and focused tips make it a lot easier for users to understand the data visualization. But we need to make sure we create a clear distinction between the hints and the actual visualization and use this pattern with caution so we don’t clutter the data-ink.
Tutorials
Tutorials (or guided tours) are being used to highlight certain functions of an application. In contrast to the inline cues, the user is taken into a dedicated flow to make sure everything is presented in a gradual order. NOSop3, a department of the Dutch broadcasting company, is using Instagram to inform their target audience about the “news”. By telling their story through Instagram posts, they gradually tell the story they want to tell without overwhelming their audience (example).
Playthroughs
One of my favorite onboarding patterns is the “Playthrough”. This technique is being used especially in the gaming industry. With a playthrough, a user is taken into a flow to complete several tasks which already seem to serve as the main product. By finishing these tasks the user learns about the product. I have seen some examples of this onboarding pattern being applied to data visualization, like in the Flourish app from Daan Louter. By almost turning data visualizations into a quiz, people interact and learn about the story. Wasn’t it Benjamin Franklin who said: “Tell me and I forget. Teach me and I remember. Involve me and I learn.”
Wizard
We probably all know the wizard from setting up our router, or turn on our recently purchased phone. The steps needs to be strictly followed in a certain order to make sure that the users sets up the device correctly. Besides the set up, it also serve as a introduction to actually learn more about the product. I haven’t seen the setup part of the wizard applied to data visualizations yet, but the dedicated flow and interactive part is applied on the amazing “District Mobility” project from CleverFranke.
Now what?
We as designers work hard to make data more accessible for people and the work we put into it is too precious to not draw any attention to it. Because of the more complicated data and custom visualizations which we serve to our users, we should think about onboarding. And why not get these insights from a community that has been working on this for a while? Try to empathize with your users and understand that not everyone is as crazy about dataviz as data visualization designers. Therefore, engage with the user and help them to become interested in your data visualization.
A wealth of information creates a poverty of attention — Herbert Simon
I’m excited that more and more examples see the daylight.
Careers at Adyen
We are on the lookout for the next generation of designers, creatives, engineers, and technical people to help us build the infrastructure of global commerce! If you are interested in finding out more, see Careers at Adyen.
