The Fifth Elephant 2017

“A picture is worth a thousand words. An interface is worth a thousand pictures.” — Ben Shneiderman

We’ve all seen wonderful interactive data visualisations on the web and want to bring similar interaction principles to our business dashboards. But crafting an interactive data visualisation on the web is hard. If you don’t want to use proprietary tools like Tableau or you don’t (yet) have the coding skills with D3.js or R-Shiny or Python, your options are limited.

What if you could write an interactive data visualization in the same easy declarative way that you can write markdown to create HTML pages. In this talk, I explain how using a declarative grammar based approach can dramatically speed up the creation of interactive visualisation. I will also talk about a small tool called Visdown, which is open source and created using the excellent vega data visualisation library. You only need to learn the grammar and principles of interactive graphics, and you can then start your own journey in crafting interactive dashboards.

Outline

Grammar of interactive graphics: The four layers of abstraction

• Data layer: Data types and transformations
• Visual layer: Variable mapping, marks, channels, scales, coordinate system, and layouts
• Annotation layer: Titles, axes, legends, grids, references, and text
• Interaction layer: Navigation, transition, selection, highlighting, filtering, brushing and linking, and sorting

Using a Declarative Grammar based Tool

• The tools landscape: charting-based, grammar-based, and pixel-based
• Making interactive graphics - Graphical, Imperative and Declarative tools
• Creating a static visualization (using Visdown)

Visualizing a multidimensional dataset

• Playing with marks, channels, color, scales, and coordinates
• Adding labeling and annotation
• Adding an interaction layer

Adding interactive data-model manipulation

• Exploring common interaction patterns: Select, explore, reconfigure, encode, filter, and drill-down
• Creating an interactive data visualization

Building your own declarative visualisation tools

• Approach to building Visdown and lessons learnt
• Adopting and building declarative based tools in your domain / workflow

Speaker bio

Amit Kapoor is interested in learning and teaching the craft of telling visual stories with data. He is the founder partner at narrativeVIZ Consulting, where he teaches data-science, data-visualisation and data-stories as tools for improving communication, persuasion, and leadership and conducts workshops on these topics for businesses, nonprofits, and academic institutes. You can find more about him at http://amitkaps.com and tweet him at @amitkaps.

Links

• I have talked extensively on the art and science of Data Visualisation in different contexts (Exploration, Storytelling, Data Science and Art). You can see a selection of my talks at http://amitkaps.com/talks
• Here is one visualisation on value of notes in circulation - http://amitkaps.com/data-portraits

Slides

https://speakerdeck.com/amitkaps/interactive-data-visualisation