News

3 ways to make data visualisations and interactives work on mobile

Speaking at news:rewired today, Martin Stabe, head of interactive news at The Financial Times, and Colleen McEnaney, graphics editor at The Wall Street Journal, shared some advice for making sure data visualisations work on mobile.

Less is more
  • Make sure all information is available so that the narrative makes sense.

  • The point of the visualisation has to be clearly illustrated. If you start to feel your visualisation is becoming too cluttered, check if you’re adding labels that don’t need to be there or perhaps consider multiple simple charts instead.

  • Make sure the key information stands out. If it’s not easily visible, you’ll lose the reader.

  • Follow the story. If your visualisation doesn’t need extra data info, don’t put time into it just for the sake of it.

  • Sometimes a simple nicely-styled jpeg does the trick, instead of a visualisation, and is not limited by slow internet and older web or mobile browsers.

Think vertically

“Horizontal space is a precious resource,” argued McEnaney. A data journalist has to be conscious of the horizontal display of info. If you’re creating a bar chart with more than four or five categories, go vertical, she advised.

Scrolling is a native movement on mobile, so “it’s ok for [charts] to be taller,’ she added.

Scrolling has even become a new kind of rhetorical device which helps to tell the story, McEnaney explained, such as the story Depth of the problem by the Washington Post.

Last but not least, she noted that for interactive charts the buttons should be at the bottom of the viewport so they are near where the users’ hands are.

Choose responsiveness over interactivity

“I want an interactive with that” is not the right approach, argued Stabe. Interactivity is an extra layer on visualisations that will make them more complex and therefore more time-consuming.

The cost of making it all work properly must be taken into account when considering a data visualisation, he added.

At The Financial Times, he said, “we are now at the point where we try to avoid using interactivity where possible, because it is more important to make something responsive than adding that extra layer of complexity.

“The value lies in the speed of delivery rather than ‘Ooh, I can click on this’.”

Stabe also pointed out the new possibilities that mobile offers. Thanks to geolocation, you can personalise graphs without interactivity, he explained.

“By making an educated guess about the area a person is interested in based on the geolocation of their phone, we can offer them the content they’re looking for.”

Mobile charting tools to get started

McEnaney’s recommendations for tools to experiment with mobile-friendly data visualisations are Quartz’s Chartbuilder, ChartBlocksDatawrapper, Plot.ly, <a=”http://www.charted.co/”>Charted, and Silk.

You might be interested in …