Mixing Linters with GUIs: A Color Palette Design Probe

TL;DR

This paper addresses the limitations of text-based visualization linters by introducing PaletteLint, a GUI-integrated end-user linter for color palettes embedded in the Color Buddy design tool. By modeling palettes with a domain-specific language and providing visual explanations, user-defined lints, and multiple fix strategies, the approach demonstrates how linters can meaningfully operate within graphical design workflows. Through a formative interview study and theory-driven analysis, the authors articulate a ladder of linting capabilities and extract design guidelines for future visualization linters. The work highlights how GUI integration, contextual usage, and interactive fixes can reduce cognitive load, improve accessibility, and support designerly intent, offering a concrete path toward more effective visualization linters across domains.

Abstract

Visualization linters are end-user facing evaluators that automatically identify potential chart issues. These spell-checker like systems offer a blend of interpretability and customization that is not found in other forms of automated assistance. However, existing linters do not model context and have primarily targeted users who do not need assistance, resulting in obvious -- even annoying -- advice. We investigate these issues within the domain of color palette design, which serves as a microcosm of visualization design concerns. We contribute a GUI-based color palette linter as a design probe that covers perception, accessibility, context, and other design criteria, and use it to explore visual explanations, integrated fixes, and user defined linting rules. Through a formative interview study and theory-driven analysis, we find that linters can be meaningfully integrated into graphical contexts thereby addressing many of their core issues. We discuss implications for integrating linters into visualization tools, developing improved assertion languages, and supporting end-user tunable advice -- all laying the groundwork for more effective visualization linters in any context.

Figures (11)

• Figure 1: Past visualization linters provide varying levels of support for different functionalities central to the user experience of linting.
• Figure 2: The lints included in our design probe. Some guidelines come from multiple sources, but we prefer surveys for referential simplicity. Lints with common structures are merged and represented as (a | b).
• Figure 3: Example lints in PaletteLint's SQL-like summary text. (A) checks if text objects meet contrast standards for text legibility. (B) compares CVD simulated color pairs using a $dE_{2000}$ heuristic ViewSonicDeGuide that palettes should be glanceably different. (C) uses values from Gramazio's d3-jnd gramazio2016colorgorical to test colors for distinctness as a function of size. (D) checks for even distribution via Bujack et al.'s bujack18GoodBadUgly notion of local speed (i.e., sequential differences).
• Figure 4: Our model of color palettes and the lints that evaluate them.
• Figure 5: PaletteLint's abstract syntax. Each lint consists of a (potentially) nested single boolean expression, $e$. Palette values (e.g., background and colors) are accessed during evaluation as variables. $\theta$ denotes function parameters or arguments, such as contrast algorithm in \ref{['fig:lint-explainer']}.