Abstract
Designers are increasingly using online resources for inspiration. How to best support design exploration without compromising creativity? We introduce and study Design Maps, a class of point-cloud visualizations that makes large UI datasets explorable. Design Maps are computed using dimensionality reduction and clustering techniques, which we analyze thoroughly in this paper. We present concepts for integrating Design Maps into design tools, including interactive visualization, local neighborhood exploration, and functionality to integrate existing solutions to the design at hand. These concepts were implemented in a wireframing tool for mobile apps, which was evaluated with actual designers performing realistic tasks. Overall, designers find Design Maps supporting their creativity (avg. CSI score of 74/100) and indicate that the maps producing consistent whitespacing within cloud points are the most informative ones.
Research highlights
- Design Maps are interactive point-cloud visualizations of large-scale UI datasets.
- Designers prefer consistent whitespace within cloud points.
- Designers find Design Maps supporting their creativity and perspective-taking.
Resources
Citation
- Luis A. Leiva, Asutosh Hota, Antti Oulasvirta. Interactive Exploration of Large-scale UI Datasets with Design Maps. Interacting with Computers, 2021.
LaTeX users can use the following BibTeX entry for citation:
@Article{designmaps, author = {Luis A. Leiva and Asutosh Hota and Antti Oulasvirta}, title = {Interactive Exploration of Large-scale UI Datasets with Design Maps}, journal = {Interacting with Computers}, volume = {}, number = {}, year = {2021}, }
Disclaimer
Our software is free for scientific use (dual licensed under MIT and GPL licenses). The software must not be distributed without prior permission of the authors. Please contact us if you are planning to use the software for commercial purposes. The authors are not responsible for any implication derived from the use of this software.