Code Bubbles

From Cyborg Anthro Wiki

Overview

Developers spend significant time reading and navigating code fragments spread across multiple locations. The file-based nature of contemporary IDEs makes it prohibitively difficult to create and maintain a simultaneous view of such fragments. Code Bubbles proposes a user interface metaphor for code understanding and maintenance based on collections of lightweight, editable fragments called bubbles, which form concurrently visible working sets.[1]

The essential goal is to make it easier for developers to see many fragments of code, or other information, at once without having to navigate back and forth. Each fragment is shown in a bubble.[2]

Authorship

Developed at Brown University by Andrew Bragdon, Robert Zeleznik, Steven P. Reiss, Suman Karumuri, William Cheung, Joshua Kaplan, Christopher Coleman, and Ferdi Adeputra, with Joseph J. LaViola Jr.[3]

Published twice in 2010. "Code Bubbles: A Working Set-based Interface for Code Understanding and Maintenance," CHI 2010, Atlanta, pages 2503 to 2512.[1] And "Code Bubbles: Rethinking the User Interface Paradigm of Integrated Development Environments," ICSE 2010, Cape Town.[4] A research demonstration appeared at ICSE 2010 volume 2, pages 293 to 296.[5]

Core Problem

Today's integrated development environments are hampered by their dependence on files and file-based editing.[4]

The file is a storage unit that became a display unit. Code that belongs together conceptually, a function and the three functions it calls, is stored in whatever files the language and the project structure put it in, and the editor shows one file at a time. Understanding a call chain therefore requires moving back and forth between locations, and each move discards the previous view.

The papers cite supporting studies: how Java developers actually use Eclipse, how effectively developers investigate source code, and path exploration during code navigation.[3]

The interface

A bubble holds a single fragment, typically a function, and is editable in place. Bubbles sit on a continuous two-dimensional surface rather than in windows.

A bubble is opened via a pop-up search box; opening the definition of something inside a bubble creates another bubble beside it, and related bubbles are automatically grouped; a large working set can include a bubble stack of references; an overview appears in the panning bar; and hovering gives a preview.[3]

A tiling assistant prevents fragments from overlapping, and code reflows automatically to fit the bubble.

Precedents

Working with program fragments rather than files was explored in Reiss's own Desert environment, and appears in IBM's VisualAge and CMU's Sheets hypercode editor, all loosely based on non-file-based languages such as Xerox's Smalltalk and Lisp.[3]

Their claim is that none of those systems provided either a tiling assistant to avoid fragment overlap or a continuous desktop, and that these omissions, together with choices such as not reflowing code automatically, limited their usability.[3]

Results

The CHI paper reports that bubbles significantly improved code understanding time while reducing navigation interactions compared with a widely used IDE, across two controlled tasks.[6]

The ICSE quantitative evaluation found developers could expect to view a sizeable number of functions concurrently with relatively few UI operations, and a qualitative evaluation with 23 professional developers reported a high level of excitement, interest, and perceived benefit.[6]

Afterwards

Microsoft built code bubbles into a shipped product. Debugger Canvas, reported at ICSE 2012 by Robert DeLine, Bragdon, Kael Rowan, Jens Jacobsen, and Reiss, documented industrial experience with the code bubbles approach.[7] It shipped as a Visual Studio 2010 Ultimate Power Tool and was later discontinued.

Reiss continued the work at Brown, publishing on plugging in and into code bubbles in 2012, integrating S6 code search with it in 2013, and demonstrating visualisations of code bubbles the same year.[7]

Relevance

Most software presents information in the units the storage layer uses, and expects the person to reassemble their own unit by navigating. Each navigation costs the working memory the person had accumulated.

Why did this become the default despite measured improvements and enthusiastic evaluations? The answer is the same one Underkoffler gave about g-speak: an interface paradigm that requires everyone to relearn how they work faces a switching cost.

References

  1. ↑ 1.0 1.1 Code Bubbles: A Working Set-based Interface for Code Understanding and Maintenance, CHI '10 Proceedings.
  2. ↑ Code Bubbles, Brown University.
  3. ↑ 3.0 3.1 3.2 3.3 3.4 Code Bubbles: A Working Set-based Interface for Code Understanding and Maintenance, Brown CS.
  4. ↑ 4.0 4.1 Code bubbles: rethinking the user interface paradigm of integrated development environments, ICSE '10 Proceedings.
  5. ↑ A research demonstration of code bubbles, Semantic Scholar.
  6. ↑ 6.0 6.1 Code bubbles: rethinking the user interface paradigm, Semantic Scholar.
  7. ↑ 7.0 7.1 Steven P. Reiss publication list, dblp.
Retrieved from "https://cyborganthropology.com/index.php?title=Code_Bubbles&oldid=7352"