Techniques for Flexible Responsive Visualization Design

@article{Hoffswell2020TechniquesFF,
  title={Techniques for Flexible Responsive Visualization Design},
  author={Jane Hoffswell and Wilmot Li and Zhicheng Liu},
  journal={Proceedings of the 2020 CHI Conference on Human Factors in Computing Systems},
  year={2020}
}
Responsive visualizations adapt to effectively present information based on the device context. Such adaptations are essential for news content that is increasingly consumed on mobile devices. However, existing tools provide little support for responsive visualization design. We analyze a corpus of 231 responsive news visualizations and discuss formative interviews with five journalists about responsive visualization design. These interviews motivate four central design guidelines: enable… 

Figures from this paper

Effects of screen-responsive visualization on data comprehension
TLDR
A visual interface with a coordinated multiple view layout for the large display and two alternative designs of the same interface – a space-saving boundary visualization layout and an overview layout – for the mobile condition are developed, providing new guidelines for screen-responsive visualization interfaces.
Cicero: A Declarative Grammar for Responsive Visualization
TLDR
Cicero is presented, a declarative grammar for concisely specifying responsive visualization transformations which paves the way for more intelligent responsive visualization authoring tools.
Mobile Data Visualization Techniques Group 4 HCI Winter School
TLDR
This review aims to reflect on what has been discovered to date on mobile visualization, and look into some interesting researches about extended reality that could bring more flow experiences and interactions on mobile devices.
An Automated Approach to Reasoning About Task-Oriented Insights in Responsive Visualization
TLDR
An automated approach to approximating the loss of support for task-oriented visualization insights (identification, comparison, and trend) in responsive transformation of a source visualization is proposed.
Fixation and Creativity in Data Visualization Design: Experiences and Perspectives of Practitioners
TLDR
This work conducts semi-structured interviews with 15 data visualization practitioners, focusing on a specific aspect of creativity known as design fixation, when designers adhere blindly or prematurely to a set of ideas that limit creative outcomes.
MobileVisFixer: Tailoring Web Visualizations for Mobile Phones Leveraging an Explainable Reinforcement Learning Framework
TLDR
The proposed MobileVisFixer automates a mobile-friendly visualization re-design process with a novel reinforcement learning framework, and uses a greedy heuristic based on Policy Gradient methods to find solutions to this difficult, multi-criteria optimization problem in reasonable time.
Design Judgment in Data Visualization Practice
TLDR
This study conducted semistructured interviews with data visualization practitioners during which they were asked to describe the practical and situated aspects of their design processes and identified aspects of data visualization practice that require further investigation beyond notions of rational, model- or principle-directed decision-making processes.
VizSnippets: Compressing Visualization Bundles Into Representative Previews for Browsing Visualization Collections
TLDR
A framework for snippet design is proposed that addresses eight key challenges and a computational pipeline is presented to compress the visual and textual content of bundles into representative previews that is adaptive to a provided pixel budget and provides high information density with multiple images and carefully chosen keywords.
FitVid: Towards Development of Responsive and Fluid Video Content Adaptation
TLDR
A computational pipeline is developed that automatically adapts learning video content to a smaller screen by segmenting and resizing the in-video elements and provides both the pipeline-generated content adaptation and user-controlled direct manipulation of the in the video elements to fit their own needs.
Guideline-Based Evaluation and Design Opportunities for Mobile Video-based Learning
TLDR
This work examines mobile learning adequacy of content and presents a prototype that supports a guideline-based design of video learning content to inform engineers and design tool makers on the challenges of editing mobile video-based learning content for accessible and adaptive design across devices.
...
1
2
3
...

References

SHOWING 1-10 OF 96 REFERENCES
Lyra: An Interactive Visualization Design Environment
TLDR
Lyra enables users to rapidly develop customized visualizations, covering a design space comparable to existing programming‐based tools, and is evaluated for its expressivity and accessibility.
Data Illustrator: Augmenting Vector Design Tools with Lazy Data Binding for Expressive Visualization Authoring
TLDR
Data Illustrator is proposed, a novel visualization framework that extends interaction techniques in modern vector design tools for direct manipulation of visualization configurations and parameters and demonstrates the expressive power of the approach through a variety of examples.
Critical Reflections on Visualization Authoring Systems
TLDR
This paper surfaces knowledge that would have been daunting within the constituent papers of these three systems, Lyra, Data Illustrator, and Charticulator, to compare and contrast their limitations and trade-offs between expressivity and learnability.
Voyager: Exploratory Analysis via Faceted Browsing of Visualization Recommendations
TLDR
It is found that Voyager facilitates exploration of previously unseen data and leads to increased data variable coverage, and the need to balance rapid exploration and targeted question-answering for visualization tools is distill.
Responsive Visualisation
TLDR
This paper looks at how the principles of responsive web design can be applied to five commonly used web-based data visualisations: line chart, bar chart, parallel coordinates, scatterplot, and choropleth map.
Vistribute: Distributing Interactive Visualizations in Dynamic Multi-Device Setups
TLDR
Vistribute, a framework for the automatic distribution of visualizations and UI components across multiple heterogeneous devices, is presented and it is found that all distributions provided comparable quality, hence validating the framework.
Authoring Narrative Visualizations with Ellipsis
TLDR
A model of storytelling abstractions that includes state‐based scene structure, dynamic annotations and decoupled coordination of multiple visualization components is introduced and instantiate in Ellipsis: a system that combines a domain‐specific language for storytelling with a graphical interface for story authoring.
D 3 : Data-Driven Documents
TLDR
This work shows how representational transparency improves expressiveness and better integrates with developer tools than prior approaches, while offering comparable notational efficiency and retaining powerful declarative components.
D³ Data-Driven Documents
TLDR
This work shows how representational transparency improves expressiveness and better integrates with developer tools than prior approaches, while offering comparable notational efficiency and retaining powerful declarative components.
ViSizer: A Visualization Resizing Framework
TLDR
This work introduces ViSizer, a perception-based framework for automatically resizing a visualization to fit any display, using an energy function based on a perception model (feature congestion) to determine the optimal deformation for every local region.
...
1
2
3
4
5
...