Toward Principles for the Design of Navigation Affordances in Code Editors

Abstract

Design principles are a key tool for creators of interactive systems; however, a cohesive set of principles has yet to emerge for the design of code editors. In this paper, we conducted a between-subjects empirical study comparing the navigation behaviors of 32 professional LabVIEW programmers using two different code-editor interfaces: the ubiquitous tabbed editor and the experimental Patchworks editor. Our analysis focused on how the programmers arranged and navigated among open information patches (i.e., code modules and program output). Key findings of our study included that Patchworks users made significantly fewer click actions per navigation, juxtaposed patches side by side significantly more, and exhibited significantly fewer navigation mistakes than tabbed-editor users. Based on these findings and more, we propose five general principles for the design of effective navigation affordances in code editors.

QualDash: Adaptable Generation of Visualisation Dashboards for Healthcare Quality Improvement

“…In response, we considered two layout alternatives: a tabbed view and a grid view [22]. Empirical evidence shows that juxtaposed patches on a grid layout significantly reduce navigation mistakes [18]. Additionally, input from co-design showed an expectation by stakeholders to be able to obtain an overview of all metrics on the same screen at the entry point of their analysis.…”

QualDash: Adaptable Generation of Visualisation Dashboards for Healthcare Quality Improvement

“…In response, we considered two layout alternatives: a tabbed view and a grid view [23]. Empirical evidence shows that juxtaposed patches on a grid layout significantly reduce navigation mistakes [19]. Additionally, input from co-design showed an expectation by stakeholders to be able to obtain an overview of all metrics on the same screen at the entry point of their analysis.…”