October 26, 2017

Data Visualization Edition: A New Wiki, Font Graphs, & How to Fix a Toilet

Lee Steely

VM Weekly Roundup #thisweekineverything

Welcome to our industry news roundup, where the rubber meets the roadmap.

“Google, what is data visualization?”

Google Partner Creates how-to-fix-a-toilet.com

Why are we linking to how-to-fix-a-toilet.com? Because it’s a great example of the way creative data visualization on the web can tell a story in ways graphs and statistics just can’t convey alone. This one is a collaboration between visualization editor Xaquin G.V. and Google, and we love how it illustrates how many of our day-to-day questions have been outsourced to search queries.

10 Second Tip: With the rise of marketing automation software, intelligent algorithms, and mass data aggregation like we’ve never seen before, the ability to interpret data and and present it in approachable, compelling formats is a skill in high demand. Part of the poignancy of this “data essay” lies in its ability to combine a first-person personal narration with data, design, and clever animations to tell a story bigger than any of its parts. It’s an inspirational example of how much you can do when content and design work their magic in tandem.

Test Drive: What statistics fascinate you about your industry? What’s the underlying story that they tell? What are the questions your customers are asking Google that your website might be able to answer?

New Wiki for Data Visualization

The Data Viz Project

It’s a boon for graphic designers and anyone who cares about presenting data in interesting ways: The Data Viz Project has over 150 types of data visualizations in its database, along with helpful info on terminology, history, and examples of each type. The collection started as wall hangings in the creators’ infographics firm in Copenhagen, meant to remind them of all the different ways similar data can be presented, and inspire. Now, they’ve expanded it and thrown it up on the web so we can all get some inspiration.

10 Second Tip: For B2B in particular, presenting significant data in a way that isn’t dry or boring can make or break a sales proposition. This collection shows there’s always another way if you’re willing to experiment. It’s also a great example of how color scheme can work to make content more engaging and cohesive in web design.

Test Drive: Keep this one in your bookmarks for the next time you need a better way to convey some numbers, or as a resource that can help make sense of any confusing graphs you may come across in the future.

Font Visualizations

This Font Makes Graphics Out of Numbers In Seconds

Sometimes, you don’t want to embed a whole chart or dataset, even though you need to convey the most important takeaway. And in a paragraph of text, numbers and data descriptions can be skimmed past and lose impact. One solution is to use sparklines. These are tiny, bare-bones graphs without axes or coordinates that can be inserted into text just like a font. You’re likely most used to seeing them in financial publications to indicate the rise and fall of stock prices, but they can be useful any time you want to show a rate of change over time without pulling a reader away from a block of text–or just as a fun way to highlight your data. Previously the only way to do this on the web was through CSS, but now you can download Spark as a font file and bypass the custom coding step.

10 Second Tip: If you think simple sparkline graphs are neat, check out Edward Tufte, who originated sparkline theory in his book Beautiful Evidence. He’s a great resource on data visualization in general.

Test Drive: We love the idea of using sparkline graphs in headline copy.