OPT+Graph: Detection of Graph Data Structure on Program Visualization Tool to Support Learning

Abstract

This paper presents OPT+Graph, a web-based program visualization tool to support learning programming graph data structure in C. This tool is developed based on pythontutor.com (OPT). The main contribution is visualization graph data structure on program visualization tool. An evaluation visualization used four main stages with the online quiz. However the third stage is a core of evaluation. The third stage has two sub-stage that is simulation 1 and simulation 2. In the simulation 1, the respondents using original OPT tool then OPT+Graph tool; and the simulation 2, they using OPT+Graph tool then original OPT tool. In the last stage, they completed the online quiz without any tools. It is key for validate an evaluation visualization. Finally, we have found in this work: 1) detection technique of graph data structure for visualization based on representation of adjacency matrix, array of edges, and array of adjacency list in C source code; 2) in the simulation 1, there were about 52,38% from 11 of 21 respondents have effective and efficient results using OPT+Graph tool, and about 66,67% from 14 of 21 respondents successfully solve the problem effectively and efficiently in the simulation 2; and 3) OPT+Graph is free and open source software, available at github.com/habibieeddien/optplusgraph.