Name any of the most highly regarded data visualizations offered in the last half decade and there’s no doubt the most stunning examples involved intricate design and elaborate storytelling.
Take The New Yorker’s wonderful Inequality and New York’s Subway interactive graphic as an example:
You can toggle through each subway line and hover over each stop to see the neighborhood’s median household income and compare it to the incomes along the other stops on that line.
I can’t think of a better way to visualize inequality within the city than relaying it through the transportation system that millions of New Yorkers use every day. By connecting it to their everyday lives, the data visualization induces an emotional reaction in a way that simply listing the income statistics never could.
Call up this same data visualization on your phone and you’ll understand the dilemma now faced by many designers. You have to tilt the phone to switch to landscape mode, and then use your fingers to zoom in to accurately click on any of the subway stops. You can’t hover to see the data pop up, you need to click on each station to see a data readout that doesn’t disappear until you click on the next station.
As brilliant a data visualization as “Inequality and New York’s Subway” is, it cannot be appreciated as much in a world where mobile audiences are quickly approaching the 50% threshold on news sites. Designers today risk alienating a substantial number of visitors if they create data visualizations without mobile users in mind.
Crafting visual campaigns for a mobile audience isn’t easy, but here are some strategies to keep in mind when creating content:
Know your audience’s preferences
We recently surveyed consumers about their device preferences for content. What we heard from these 664 survey respondents is that they prefer to consume content on mobile devices that’s presented simply – straight text or snackable micro content like these simple yet informative facts on rainfall in the Carolinas:
Content with large images or lots of interactivity (including infographics and slideshows) go over better on desktops:
Source: Visually survey conducted online from July – August 2015 via SurveyMonkey to 664 U.S. consumers who like to read, watch, and look at content online.
While mobile traffic is approaching 50% for a lot of publishers, that’s not true for everyone. Look at your analytics to see where your traffic originates and deliver content based on your mobile traffic. Responsive design – making sure images are sized properly for viewing device and ensuring speedy load times – must be a priority or you could alienate the audience you work so hard to get to your site.
Preview content on mobile
This may seem like common sense, but you would be surprised how many content pieces are published without being previewed on multiple devices. Consider conducting a visual Q&A in your development environment or use the preview functionality in your content management system. This is a natural extension of the long-existing best practice to test web designs on all major browsers before publishing.
Use as little text as possible
Data visualizations often use text to describe various aspects of what’s being shown, but on a phone that text is rendered tiny, forcing the user to zoom in, which is a signal of bad design. Your goal should be that the data visualization is easy to understand in the version automatically rendered on the screen.
Rework existing content
To design content like infographics for mobile, you don’t need to double your efforts to create new content. Rework the infographic so that it works for mobile.
For example, distill the key points into headlines, eliminating the need for callouts, blurbs, and supporting text paragraphs, and reuse the graphic assets. Or turn each key point into multiple short infographics. For instance, check out how this large infographic on the education and training of women was broken into a smaller graphic for Twitter (Full disclosure: I am the CEO of Visually, the company that produced this infographic).
by AgentIllustrateur. From Visually.
Education and Training of Women [a @Visually produced #infographic for @un_women] http://t.co/e1Fcm5MQIY pic.twitter.com/d6PyfwOM8T — Visually (@Visually) September 30, 2015
RECOMMENDED FOR YOU: How to Write Content That Engages Mobile Readers
Optimize for social media
Social platforms like Facebook and Twitter bend over backward to ensure their mobile experience is ideal for users. (This is why Facebook’s mobile revenue now makes up an astonishing 76% of total revenue.) Chances are that if your content looks good in the Facebook news feed or Twitter timeline on desktop, it’ll also look good on mobile. As an example, this infographic doesn’t render well in Facebook, which means that mobile users are going to have to do a lot of zooming and scrolling to take it all in:
If you take the same design and crop it into a series of individual images, your content will be much easier for everyone to engage:
RECOMMENDED FOR YOU: 11 Ways to Dominate the Social Scene with Killer Content
Produce videos under 30 seconds
It’s been widely accepted within the marketing community that online videos should run for less than five minutes. Go much shorter for mobile audiences. Just as readers don’t like consuming long-form articles and books on their phones, they don’t want to spend several minutes watching a data visualization video. There’s a reason that Twitter only allows 30-second videos and Instagram confines video run time to 15 seconds. When you also consider the time it takes to load a video in an area with bad data coverage, you have even more incentive to keep videos short.
Conclusion
Does this mean you stop really ambitious data storytelling because it isn’t easily consumed on mobile? No. But you must recognize that at least 50% of your audience may be on mobile so you shouldn’t devote 100% of your energy toward developing desktop-friendly data visualization products. In some ways, designing for mobile is a good exercise in trimming the fat. It forces you to consider what’s really necessary and discard everything else. Given how many data visualizations suffer from being too busy, conciseness can be a virtue, and nothing teaches succinctness and economy quite like mobile design.
Need more ideas on how to create killer visual content? Download our latest collection of amazing brand examples: Get Inspired: 75 (More) Content Marketing Examples
Cover image by SplitShire
Comments