The Effect of Richer Visualizations on Code Comprehension

  title={The Effect of Richer Visualizations on Code Comprehension},
  author={Dimitar Asenov and Otmar Hilliges and Peter M{\"u}ller},
  journal={Proceedings of the 2016 CHI Conference on Human Factors in Computing Systems},
Researchers often introduce visual tools to programming environments in order to facilitate program comprehension, reduce navigation times, and help developers answer difficult questions. Syntax highlighting is the main visual lens through which developers perceive their code, and yet its effects and the effects of richer code presentations on code comprehension have not been evaluated systematically. We present a rigorous user study comparing mainstream syntax highlighting to two visually… Expand
Doppio: Tracking UI Flows and Code Changes for App Development
Doppio, a tool that automatically tracks and visualizes UI flows and their changes based on source code, is developed, which is able to generate quality visual documentation and helped participants understand unfamiliar source code and track changes. Expand
ARCC: assistant for repetitive code comprehension
The tool, implemented as an Eclipse plugin, assists developers in leveraging knowledge of a program to understand other programs containing a subset of the semantics in the former, using an extensible knowledge base of recurrent semantic code snippets. Expand
The Example Guru: Suggesting Examples to Novice Programmers in an Artifact-Based Context
This work aims to encourage novices in artifact-based programming contexts to explore new API methods and skills, as examples are effective for learning and highly available. Expand
A Safe and User-Friendly Graphical Programming Model for Parallel Stream Processing
A graphical programming model for parallel stream processing applications, which improves the overview by visualizing high level dataflow together with explicit and concise annotations for concurrency-related dependency information and proposes seamless integration with the safe parallel programming language Rust. Expand
On the design of text editors
The goal of this article is to characterize these implicit choices of default and implicit choices in text editors and to illustrate what are some alternatives without prescribing one or the other. Expand


Addressing misconceptions about code with always-on programming visualizations
Theseus, an IDE extension that visualizes run-time behavior within a JavaScript code editor, finds that users quickly adopted strategies that are unique to always-on, real-time visualizations, and used the additional information to guide their navigation through their code. Expand
Code bubbles: a working set-based interface for code understanding and maintenance
A novel user interface metaphor for code understanding based on collections of lightweight, editable fragments called bubbles, which form concurrently visible working sets which significantly improved code understanding time, while reducing navigation interactions over a widely-used IDE, for two controlled tasks. Expand
Envision: A fast and flexible visual code editor with fluid interactions (Overview)
Envision is introduced, a visual structured code editor that addresses challenges using an architecture that supports flexible, customizable visualizations, keyboard-centric controls for fluid interaction, and optimizations to ensure good performance for large projects. Expand
The Effectiveness of Control Structure Diagrams in Source Code Comprehension Activities
Recently, the first two in a series of planned comprehension experiments were performed to measure the effect of the control structure diagram (CSD) on program comprehensibility. Upper- andExpand
Enabling program comprehension through a visual object-focused development environment
Gaucho, a visual object-focused environment that allows developers to write programs by creating and manipulating lightweight and intuitive depictions of object-oriented constructs, is built, and preliminary results suggest that alternative-visual-IDEs may be superior to traditional IDEs as program comprehension aids. Expand
Barista: An implementation framework for enabling new tools, interaction techniques and views in code editors
Barista is an implementation framework that enables the creation of user interfaces by simplifying the implementation of editors that represent code internally as an abstract syntax tree and maintain a corresponding, fully structured visual representation on-screen. Expand
The patchworks code editor: toward faster navigation with less code arranging and fewer navigation mistakes
This paper proposes a novel code editor, Patchworks, that leverages two new interface idioms - the patch grid and the ribbon - to help programmers navigate more quickly, make fewer navigation errors, and spend less time arranging their code. Expand
Code canvas: zooming towards better development environments
  • R. DeLine, Kael Rowan
  • Computer Science
  • 2010 ACM/IEEE 32nd International Conference on Software Engineering
  • 2010
By uniting the content of a project and information about it onto a single surface, Code Canvas is designed to leverage spatial memory to keep developers oriented and to make it easy to synthesize information. Expand
An Experiment on the Effects of Program Code Highlighting on Visual Search for Local Patterns
The results of an experiment where three coloring schemes were used by intermediate programmers in visual search tasks for local patterns in Java programs showed that the control scheme, black text on white background, resulted in the same overall search performance as the other coloring schemes. Expand
Usability Analysis of Visual Programming Environments: A 'Cognitive Dimensions' Framework
This paper applies the cognitive dimensions framework to two commercially-available dataflow languages and concludes that it is effective and insightful; other HCI-based evaluation techniques focus on different aspects and would make good complements. Expand