Automatically Arranging Charts with Vistribute

Supporting analysts in placing visualizations across multiple devices.


By Tom Horak (Technische Universität Dresden), Andreas Mathisen (Aarhus University), Clemens N. Klokmose (Aarhus University), Raimund Dachselt (Technische Universität Dresden), and Niklas Elmqvist (University of Maryland)

We nowadays surround ourselves with a multitude of different devices: smartphones and tablets, laptops and desktops, projectors and large displays. However, most of the time, people only work on a single device at a time. This is a missed opportunity, as using multiple devices in parallel can improve efficiency. For instance, journalists refer to multiple documents when writing their stories, doctors compare several X-rays and test results when deciding on a treatment plan, or — as is the case in our work — data analysts look at many different visualizations in order to extract insights from data. In these situations, more screen space is always beneficial. This can be addressed by using, e.g., a large display alongside a laptop in a meeting room, a combination of a smartphone and a tablet in a coffee shop, or simply multiple screens on your desk.

A broad spectrum of different device ensembles can be faced during a working day, e.g., a desktop with two displays, a combination of laptop and a larger display, or mobile devices alongside a laptop.

While we have the ingredients for realizing such systems, one challenge remains: the different visualizations must be placed on the devices in a meaningful and useful way. This is especially important for visualizations, as charts often complement each other, e.g., by providing an alternative perspective onto a subset of the data, by allowing comparison across multiple subsets, or by supporting filter conditions. In other words, there are multiple aspects that need to be considered when placing visualizations in any interface.

Guiding the Layout Process with Vistribute

In our CHI 2019 paper, we propose the Vistribute framework for performing this layout process automatically. The framework consists of three parts: We first explore all the different aspects relevant in such systems, such as visualizations, devices, and users. Based on these, we then present rules of thumb that guide the layout process to find a useful assignment of visualizations to devices. Finally, we also present a prototype that automates this step so that the user does not have to create the layout manually. This is also what makes our system different from existing ones, which all require the user to provide some sort of input beforehand.

Based on a given set of visualizations, the Vistribute framework allows to derive a layout for all kinds of device ensembles.

Are There Rules for Layout?

Our rules of thumb can be split into three groups. The first group governs which visualizations should be placed next to each other. This can be done based on their visual similarity (similar views promote comparison), the data they show (such as different views of the same subset), or if interactions are synchronized between them. A second set of rules focuses on how visualizations should be placed in the interface. For instance, some visualizations require more screen space than others, and some devices have bigger screens than others. In other words, the goal is to match visualizations with devices that can fulfill their requirements best. Finally, the last rule allows analysts to fine-tune the interface according to their personal needs.

Each of our heuristics (aka rules of thumb) focus on a different aspect relevant for the layout.

One part of our Vistribute framework is an open-source implementation that implements the layout rules into a working algorithm. Basically, analysts can work on an online platform where they are able to create and configure visualizations as well as take advantage of the automatic distribution feature. With this prototype, we also conducted a small-scale study, where we compared layouts created manually by participants to our automatic ones. Here, we found that there is a high diversity in the manual layouts, but participants considered similar aspects as modeled in our layout rules. Further, they rated manual layouts better than the automatic ones, but only slightly. Taking into consideration that participants find layout an exhausting task and spent on average 8 (!) minutes on this, providing automatic layout is highly beneficial, even if not perfect.

You can see these details also in our video:

Towards Effortless Multi-Device Environments

We believe that our work can only be the first step towards effortless multi-device environments. Vistribute allows us now to study how analysts actually work in multi-device environments when they don’t have to manage the layouts manually. This can lead to a refinement of the layout rules, and possibly to point where we can provide a more formal description of the layout problem. We could also incorporate artificial intelligence (AI) methods to further improve the quality of the distributions. Another approach would be to generate additional visualizations that are helpful for the user’s current goals.

Whatever destination we will eventually reach on this journey, the Vistribute framework is one more step towards making better use of all the digital devices that surround us.

More Information

We will present our Vistribute paper at the ACM CHI 2019 conference (Glasgow, Scotland, UK) on Tuesday, May 7 at 14:00 in the session titled Displays, Devices, and Interaction for Visualization.

You can find additional details here:

Publication:

  • Tom Horak, Andreas Mathisen, Clemens Nylandsted Klokmose, Raimund Dachselt, Niklas Elmqvist. Vistribute: Distributing Interactive Visualizations in Dynamic Multi-Device Setups. In Proceedings of the ACM Conference on Human Factors in Computing Systems, to appear, 2019.

5

5 claps