CSTutor: A Sketch-Based Tool for Visualizing Data Structures

  • Authors:

  • Sarah Buchanan;Joseph J. Laviola, Jr.

  • Affiliations:

  • University of Central Florida;University of Central Florida

  • Venue:
  • ACM Transactions on Computing Education (TOCE)
  • Year:
  • 2014

Quantified Score

Hi-index 0.00

Visualization

Abstract

We present CSTutor, a sketch-based interface designed to help students understand data structures, specifically Linked Lists, Binary Search Trees, AVL Trees, and Heaps. CSTutor creates an environment that seamlessly combines a user’s sketched diagram and code. In each of these data structure modes, the user can naturally sketch a data structure on the canvas just as they would on a white board. CSTutor analyzes the user’s diagrams in real time, and automatically generates code in a separate code view to reflect any changes the user has made. Additionally, the code can also be edited and any new code changes will animate the data structure drawn on the canvas. The connection between the data structure drawn on the canvas and the code implementation is intended to bridge the gap between the conceptual diagram of a data structure and the actual implementation. We also present the results of two semester-long studies using CSTutor in a CS1 course. The results indicate that students preferred CSTutor and were more engaged using it than a standard whiteboard lecture; however, results were mixed in quiz and exam performance.