Integrated Visualization Editing via Parameterized Declarative Templates

Interactive Data VisualizationPrototyping & User TestingSoftware Engineers & DevelopersUI/UX Designers

Title of the Paper

Integrated Visualization Editing via Parameterized Declarative Templates

Paper Information

  • Research Domain: Information Visualization, User Interface Design, Multi-modal Interaction Systems
  • Keywords: Information Visualization, Declarative Generator, Templates, User Interface, Ivy, System

Research Background and Problem

  • Problems and Challenges: Creating visualization interfaces typically involves three main modalities: textual specification (flexible but slow), panel-based construction (exploratory but hard to customize), and chart selection (simple but restrictive). These modalities have their respective advantages and disadvantages but often exist independently in current systems, preventing users from freely switching between them.
  • Significance: Single-modality interfaces often limit user flexibility or exploratory capabilities. For instance, textual systems may be unfriendly to novices, while chart selection may not suit experts. The limitations of existing interfaces force users to switch tools during analysis or rely on temporary solutions that are difficult to reuse.
  • Research Motivation and Related Work: The authors aim to integrate multiple modalities to provide users with a visualization editing tool that is both easy to use and supports strong flexibility and exploration. Additionally, the authors focus on extending declarative visualization generators to enhance their reusability and organizational capabilities.

Solution

  • Method or Solution: A mechanism called "Parameterized Declarative Templates" is proposed. This mechanism is based on JSON declarative visualization generators and extends the declarative syntax with simple programming elements (variables, conditions).
  • Innovations:
    1. Introducing a cross-language template mechanism that allows users to flexibly reuse chart definitions through parameterized operations.
    2. Combining textual editing and graphical construction in a multi-modal interface that supports real-time synchronization and intuitive design.
    3. Enabling users to quickly create complex charts through templates while supporting rapid exploration and organizational reuse.
  • Implementation Steps and Key Technologies:
    • Defining a template language: Extending JSON to include variable definitions and conditional controls, enhancing the functionality of declarative generators.
    • Developing a prototype system (Ivy): Implementing an editor that supports multi-language templates, combining textual and GUI interfaces.
    • Adding interactive features: Implementing "modality switching," panel construction, related template recommendations, and rapid comparison of variations ("fan out").

Research Results

  • Specific Results:
    • Systematically simplified Vega-Lite and Google Sheets charts into compact template collections, achieving compression ratios of 3.5x and 1.8x, respectively.
    • The prototype system Ivy supports four languages (Vega, Vega-Lite, Atom, and a simple table language) and provides functionalities such as template creation, parameter selection, and view exploration.
    • Experimental studies demonstrate that compared to single-modality tools, the system significantly enhances flexibility (G3) and reusability (G4) while maintaining ease of use (G1) and exploratory capabilities (G2).
  • Comparison with Existing Solutions:
    • Ivy surpasses traditional chart selection and panel construction interfaces, enabling users to easily switch modalities.
    • The template abstraction mechanism significantly reduces chart code redundancy and improves organizational efficiency.
    • Compared to fully textual systems, Ivy's graphical interface lowers the learning curve while retaining the expressive power of textual systems.
  • Experimental Results:
    • User experiments showed that all participants were able to complete complex tasks, including data exploration, chart creation, and template construction, with some guidance.
    • Ivy's usability scores ranged from "average" to "excellent," indicating user recognition of the advantages of multi-modal interaction.
  • Limitations and Future Directions:
    • Some users reported difficulties in learning the system, particularly when switching between textual and GUI operations.
    • The authors suggest embedding the system into existing tools (e.g., Shiny and Jupyter) to enhance practicality and portability.
    • Future work could focus on expanding the range of supported languages and increasing the diversity of internal template parameter types (e.g., binding data fields to color schemes).

Quick Actions

Share

Share this page

ios_share

https://hci.top/en/papers/chi/47707/2021

AdRecommended

Learn AI Coding at CodeNow

open_in_newOpen DOI Link
DOI: https://doi.org/10.1145/3411764.3445356
At a Glance

Paper Snapshot

fact_check
dataset
Source
CHI
calendar_month
Year
2021
emoji_events
Award
No award tagged
group
Authors
2 authors
sell
Subtopics
Interactive Data Visualization, Prototyping & User Testing
work
Professions
Software Engineers & Developers, UI/UX Designers
article
Content Status
Full text indexed
hub
Related Papers
10 related papers