Affordances of Sketched Notations for Multimodal UI Design and Development Tools

TL;DR

This paper analyzes the design space of sketched UI notations for multimodal design tools, comparing fixed and flexible approaches, and highlights the importance of AI methods for human-centered interpretability.

Contribution

It introduces a framework for evaluating UI sketch notations using Cognitive Dimensions and compares fixed versus flexible sketching systems.

Findings

Flexible notation supports greater creative expression.

Flexible notation reduces cognitive effort.

Element-based recognition approaches are limited for flexible sketches.

Abstract

Multimodal UI design and development tools that interpret sketches or natural language descriptions of UIs inherently have notations: the inputs they can understand. In AI-based systems, notations are implicitly defined by the data used to train these systems. In order to create usable and intuitive notations for interactive design systems, we must regard, design, and evaluate these training datasets as notation specifications. To better understand the design space of notational possibilities for future design tools, we use the Cognitive Dimensions of Notations framework to analyze two possible notations for UI sketching. The first notation is the sketching rules for an existing UI sketch dataset, and the second notation is the set of sketches generated by participants in this study, where individuals sketched UIs without imposed representational rules. We imagine two systems, FixedSketch and FlexiSketch, built with each notation respectively, in order to understand the differential affordances of, and potential design requirements for, systems. We find that participants' sketches were composed of element-level notations that are ambiguous in isolation but are interpretable in context within whole designs. For many cognitive dimensions, the FlexiSketch notation supports greater intuitive creative expression and affords lower cognitive effort than the FixedSketch notation, but cannot be supported with prevailing, element-based approaches to UI sketch recognition. We argue that for future multimodal design tools to be truly human-centered, they must adopt contemporary AI methods, including transformer-based and human-in-the-loop, reinforcement learning techniques to understand users' context-rich expressive notations and corrections.