Notes on Data Visualizations by Des Traynor


This was a highly visual presentation (as you'd expect), and so there's only so much I could capture in notes. I suggest you check out Des Traynor's blog: http://blog.intercom.io

Data Visualization
Des Traynor
  • hard to make visualizations better than text
  • especially hard to make them work good on mobile, desktop, etc.
  • Be clear first and clever second. If you have to throw one of those out, throw out clever. — Jason Fried
  • Lots of examples of bad graphics:
    • unemployment rate: sloping lines in the reverse direction of the data
    • gas prices: different units of time (year vs week)
    • gulf oil spill: 
  • Who’s the level?
    • CEO level: high level
    • Analysts: trends
    • Operations/logistics: Is anything going wrong? traffic going in the right direction?
  • What department?
    • Sales: leads, conversions
    • Marketing: impressions
    • Customer support: satisfaction rating, number of issues
  • These two (level and domain) together tell you what needs to be presented
  • Six Things to Communicate
    • A single figure: a bank balance, server status
    • Single figure with context: number plus sparkline
    • Analysis of a period: a good line chart
      • Never imply precision you don’t have. e.g. for four months of data, use a bar chart, not a line chart. 
    • A common error in visualization: to force the processing on the user. If we want to look at the delta between sales and target, don’t show the numbers for each, show the delta.
      • awesome example of using cycle charts to display user retention over time by cohort analysis
    • Breakdown Over Time
  • Lying with grouping
  • Lying with rotation
  • Bar charts aren’t sexy, but they rely on an innate skill: following a line
  • When picking visualizations, use innate skills
    • determining height
  • Tufte principles:
    • Chart junk: minimize anything that does change when the data changes
    • Data Ink ratio: how much of your ink is showing something useful?
    • Smallest effective difference: the least you can do to highlight
  • Ryan Singer: HTML has a strong tag, but no weak tag. As a result, we forget to think about what we need less of.
    • Remember to quiet down your less important parts
  • Visuals should say something: some narrative or point.
  • Visuals should all be created in HTML
    • Highcharts is a Javascript library is excellent and worth the money
    • Flotr2 is new, but popular
    • D3 is immense
    • Rickshaw
  • References:
Post a Comment