Taste of Design 5: Tufte and Bostock

Michael Senkow
5 min readNov 9, 2018

A big aspect of design are the mentors and people to look up to. Their work is inspiring and shape the movement of design.

I couldn’t decide between Tufte or Bostock for a first one as they’re both incredibly connected to the current state of good Data-Visualization. Tufte is more old-school and known for his writing and teachings on good Data-Viz practices whereas Bostock is in my opinion, if not the best person to look to for coded data-viz, at least a good starting point to branch off of.

Tufte

His books generally touch on more open-ended concepts. He gives great examples of classic data-visualization that are held up as prime examples of how to mix complex imagery and stories. Without getting into all the details, there are two core lessons I always get from him.

Don’t Lie

Are graphics being used needlessly? Is the relationship of entities to show data accurate?

If you’re using base lines do they match up? Or are you comparing two different data-sets on the same baseline that really shouldn’t have the same baseline?

Graphic from the Visual Display of Quantitative Information
Graphic from the Visual Display of Quantitative Information
Will be fixed soon but example in WpA

Here for example. Where’s the baseline? Where’s the comparison? We might as well just be showing the number as the bar basically tells nothing and if anything gives the false impression they’re equal when really they’re off by a little. A better solution may be to limit the X-axis of the display to only be 90% to 100% and show the relationship there.

Another potential future project

Here too. Its not lying….but in a brief glance a user could get a false assumption that the base line length of each group is the same, when on the right its out of….2 hours? And the left its out of….15? Either way, leaving it where we might as well just show numbers.

Reduce Ink

Generally, is there a way to reduce the amount of clutter on the screen? On one hand we want upper and lower limits, error margins, displays of averages etc. etc. But if they can be shown minimally, not distracting from the primary information, its for the best. Happily the era of major gradients, 3D pie charts, etc. is mostly dead but now we’re in a bit of a more specific fight, where its finding ways to display as much information clearly and minimally as possible.

Graphic from the Visual Display of Quantitative Information
Graphic from the Visual Display of Quantitative Information

This chart from MyAnalytics for example is doing a pretty decent job but could probably be improved by removing the vertical lines or tick marks, potentially using more of a background coloration to display the hours instead. This is where Tufte gets slightly frustrating in that there’s not set rules but more general concepts with no specific answer.

Bostock

Where Tufte is rooted in more static visualizations and academic research around that, Bostock is more the modern tech era voice. Even the prior guy, Tufte predicted in 2014 he’d be one of the most important people in Data-visualization.

He had work at the Stanford data-vis lab that led to the creation of Protovis and then D3.js which, generally any of the awesome/incredible data-visualizations you see on the internet anymore have a connection to.

https://d3js.org/

His time at the New York times produced some of the more intriguing examples of connected/interactive data-visualizations I’ve seen anywhere.

https://www.nytimes.com/by/mike-bostock some of the examples

Pathway to the whitehouse

His pathway to the Whitehouse for example is an amazing piece of UX when you look into the details. Under the pure visual aspects, there’s a voronoi matrix of interaction patterns so that no matter where you are on the chart, the distance between a visually apparent item and the interactive area to see the tooltip/callout is as minimal as possible.

https://www.youtube.com/watch?v=90NsjKvz9Ns&index=4&t=785s&list=PLTOauSQ88RdeJsAxN_B-kwIdSR1AJVOxq Explains a bit more on it.

Rent or Buy?

Overall his philosophy builds upon what Tufte lays out. We can reduce ink but we can also bring back usability and interactivity through connecting graphics and providing smart extra layers of ink that aren’t normally seen.

The simple versions of this in our product are things like tooltips where we don’t show every piece of information all the time but hide some until its useful.

Further Reading

--

--