Proceedings of the 53rd Hawaii International Conference on System Sciences | 2020

PointerViz - Towards Visualizing Pointers for Novice Programmers

Akhila Sri Manasa Venigalla, Chaitanya S. Lakkundi*, Sridhar Chimalakonda
Intelligent Software & Human Analytics (ISHA) Research Lab
Dept. of Computer Science and Engineering
Indian Institute of Technology
Tirupati, India
{cs18m017, cs18s502*, ch}@iittp.ac.in

Abstract
execution speed, handling complex data structures with
Pointers are considered as one of the key concepts in more efficiency and ease. Pointers allow sharing
learning programming and are extensively used for without copying through pass by reference, which is
implementing several data structures. They lay the advantageous when programmers desire to pass around
foundation for handling dynamic aspects of a program, big arrays. They also enable programmers to resize
increase execution speed and handle data types with data structures whenever required, supporting dynamic
more efficiency. This makes it critical for budding memory allocation. While security seems to be a
programmers to be well versed with using pointers. concern when pointers are used by novice
However, most of the novice programmers find it programmers, pointers provide a greater advantage in
difficult and tricky to understand concepts such as terms of performance by speeding up program
address allocations, pointers referring pointers and execution [11]. Performance being a critical aspect of
data structures containing pointers. Hence, drawing programming, trade-off between security and
the physical structure and flow of pointers is performance can be considered useful. A study
considered to be a common learning practice to gain conducted by Lahtinen et al., states that most of the
better clarity and avoid confusion when learning students face difficulties in understanding pointers and
pointers. But, it is time consuming and tedious to draw references [12]. This reveals that though pointers are
the flow of pointers on paper while programming. To the basic concepts of programming, they are still
help programmers understand these variations in difficult to understand.
pointers, we propose PointerViz as a Google Chrome Visualization is one of the ways that can help
extension that displays the pictorial representation of
learners to gain a better of data structures. Researchers
selected code with pointers. We conducted a
have proposed various forms of code visualizations
preliminary survey with 40 students from various
to improve learning of novice programmers since a
universities and 83% of the users reported positive
couple of decades [13,3]. Continuous improvements
experience with the plugin.
are being made to develop techniques and tools that can
better support visualization. Online Python Tutor
proposed by Philip Guo is one such tool that visualizes
1. Introduction code written after compilation [3]. Visualizing code
snippets written by programmers helps in better
Good programming skills require sound knowledge program comprehension. Visualization can also aid
of data structures. Learners of programming languages programmers who are well aware of data structures and
face various difficulties in terms of understanding their implementation in helping them with trade-offs of
various functions, attributes and data structures [1]. using pointers. Learners of programming are generally
Several tools have been developed to help novices tested on the address references and pointers to assess
learn programming [2,3,4,5,6]. They include games their knowledge of data structures [12], making it
that help students learn computer programming [7], necessary for even novice learners to understand these
environments that support conventional programming concepts.
instructions like Mindstorm [4], Scratch [5], Blockly
[6], Snap! [8] and many other code visualization tools A common practice of learners is to draw down
such as Examplore [9] and Python tutor [3]. the flow of pointers’ data and references with respect to
memory allocations to better understand the code. But
this method demands time, effort and sometimes may
*This author has discontinued from the
institute.
also be incorrect [14]. Hence, there is a strong need to

URI: https://hdl.handle.net/10125/63754
978-0-9981331-3-3 Page 118
(CC BY-NC-ND 4.0)
provide learners with technology that visualizes Comprehension among learners. It helps players in
pointers based on the program or pseudo code they understanding of control flow, program statements,
write, which is the main motivation for our work. data types and function calls by allowing players to
Though there are many existing visualization tools demonstrate their understanding of the above in a given
that help in visualizing code snippets, there is not much program [19]. RoBUG game has been developed to
work done to visualize pointers and their references support and motivate players in learning of effective
before compilation, to the best of our knowledge. debugging. It comprises of four levels that require
Hence we propose PointerViz1 to support learners of player to do certain tasks in each of them, like code
programming language to comprehend pointers better. tracing, using print statements to identify bugs, use
The remainder of this paper is structured as follows. divide-and-conquer strategy to spot the bugs and using
Section 2 discusses the related work followed by breakpoints to analyze variable values [20].
Section 3, which focuses on design methodology and Extensions to GCspy tool have been developed, that
development of PointerViz. Working of PointerViz is track and visualize dynamic memory allocations as
described in Section 4. Section 5 presents user scenario nodes and graphs [21]. BlueJ is an IDE that provides
in the form 4 cases. We present the evaluation and user UML notation of Java code which helps users visualize
survey results in Section 6 and Section 7. Finally, we structure of the application [22]. Users can view source
discuss the limitations in Section 8 and end the paper code of classes present in UML diagrams by clicking
with conclusions and future directions in the Section 9. on them. CoffeeDregs, a dynamic analysis tool, has
been developed to support and visualize debugging
2. Related Work facilities [23]. VisuAlgo has been introduced to
visualize a set of predefined algorithms. It shows the
Researchers have developed various visualization visual execution of an algorithm for a given input [24].
tools to help novice programmers learn programming Jeliot3 has been developed as a programming tool that
quicker have been developed. Scratch [5] is a block- enables users program and visualize step by step
based visualization tool that helps users to program execution of the program in the form of animations. It
easier by supporting drag and drop of blocks than is mainly focused on expression evaluation and is
writing the program. Blockly is also a block-based tool depicted by the movement of messages, method calls,
that provides visualization of programs [6]. Coding values and references in the code [25]. Java Visualizer
concepts are represented as interlocked blocks and illustrates dynamic run-time behavior of program by
Blockly generates syntactically correct code in moving back and forth in program execution2.
programming language of our choice [6]. Tools like JavelinaCode, a web-based IDE, supports synchronized
Examplore provide visualization of API usage visualization of static and dynamic aspects of Java
examples to help users understand various correct ways source code [26]. Pythontutor, proposed by PhilipGuo
of using APIs in programming languages [9]. visualizes the code by displaying the data structures
Progranimate, an e-learning web based tool assists used [3]. Another visualization tool called
users in programming using flow chart representations. PlayVisualizerC (PVC) that dynamically visualizes the
It provides code generation, inspects variables and thus code in terms of memory allocations has been proposed
provides syntax and semantic learning of programmers by Ryosuke et al. in [27]. Visualization tools have been
to the users. This helps users to gain an in-depth sound developed to help students learn programming,
knowledge of the programming language [15]. NetBlox debugging and explore various possible ways of
is another visualization tool that has been developed to writing programs. Games have been developed to
enhance understanding of distributed programming support students in program comprehension, various
[16]. In this tool, messages that are communicated concepts of programming such as function calls,
among systems are represented as blocks with message values, movement of messages and so on. To the best of
payloads. Programmers are provisioned to provide our knowledge, there is no visualization tool or a game
Message Type that defines data present in the message. that can help programmers comprehend concepts of
Games is another direction of research that has pointers and their implementation in the program
been leveraged to make programming interesting and without compilation of. Hence, in this paper, we
easy [17,18,19,20].One of the games developed by propose PointerViz to address this issue. PointerViz
Leutenegger et al. teaches fundamental programming aims to visualize the statements insitu IDE, before
concepts in C++language, with the help of 2D game compilation, rather than visualizing
development [18].Robot ON! is a game developed to
improve program 2
http://www.cs.princeton.edu/˜cos126/java_
visualize/
1
https://github.com/AkhilaSriManasa/
PointerViz

Page 119
 Figure 1. Approach for design of PointerViz

them after compilation of the code unlike existing works might motivate users to view representations and thus
such as pythontutor [3] that visualizes the code after comprehend the concepts better. As the first step of
compilation. Visualizing statements on the go will help design, we formulated regular expressions that portray
novice programmers in identifying and rectifying the various ways in which pointers are defined. The regular
mistakes if any, at the early stages of the code, as a result expressions used to match the statements written in the
reducing the debugging efforts. Also, PointerViz displays code by users, are as follows:
primitive visualization of pointers, which is identical to
the way budding programmers draw on paper, unlike Regular expression [A]:
PVC [27] which displays memory locations and internal /[a-z]+\ \*\ ([a-zA-Z$_][a-zA-Z0-9$_]*)\;/gm;
recognizes examples such as : int *p;
details. This primitive representation can help novice
programmers relate better to their interpretations. Regular expression [B]:
/[a-z]+\ \*\ ([a-zA-Z$_][a-zA-Z0-9$_]*)\ *=\
*null\;/gmi;
recognizes examples such as : int *p = NULL;
3. Design of PointerViz
Regular expression [C]:
/[a-z]+\ \*\ ([a-zA-Z$_][a-zA-Z0-9$_]*)\ *=
PointerViz prototype is currently developed as an \ *\&\ ([a-zA-Z$_][a-zA-Z0-9$_]*)\;/gm;
extension3 to Google Chrome. As a proof of concept, recognizes examples such as : int *p = &a;
we developed PointerViz as a plugin to support an Regular expression [D]:
online compiler and interpreter, ideone.com4, as shown /[a-z]+\ ([a-zA-Z$_][a-zA-Z0-9$_]*)\
*\[\ *([0-9]+)\ *\]\;/g;
in Figure 1. However, our plugin can be extended to recognizes examples such as : int p[10];
support any other
5 online coding playgrounds such Regular expression [E]:
as codepad.org and compileonline.com. In its current /[a-z]+\ ([a-zA-Z$_][a-zA-Z0-9$_]*)\
*\[\ *([0-9]+)\ *\]\;/g;
form, PointerViz can also be added as an extension to recognizes examples such as : int p[9][10];
browsers other than Google Chrome, such as Mozilla
Regular expression [F]:
Firefox. Visualizations are generated using an open /[a-z]+\ *\*\ *([a-zA-Z$_][a-zA-Z0-9$_]*)\
source Javascript framework, vis.js6. Vis.js enables us *=\ *\"([a-zA-Z0-9$_]+)\"\ *;/gm;
recognizes examples such as : char *p="test";
to dynamically visualize graphs within the browser by
facilitating manipulation of and interaction with Regular expression [G]:
[a-z]+\ *([a-zA-Z$_][a-zA-Z0-9$_]*)\ *\[\
dynamic data and also customization of nodes. Vis.js *([0-9]+)\ *\]\ *\=\ *((\{('([[a-z]|[A-Z]|
also helps in handling large amounts of dynamic data, [0-9]+|[$_]])' *\,*)*\})
|(\{(([0-9]+)\ *\,*)*\}));/gm;
making it a suitable choice to generate visualizations in recognizes examples such as : int p[2]={1,2};
coding environments which involve considerably large Regular expression [H]:
amounts of dynamic data. /[a-z]+\ *([a-zA-Z$_][a-zA-Z0-9$_]*)\ *\[\
*([0-9]+)\ *\]\ *\[\ *([0-9]+)\ *\]=\
PointerViz is designed to support novice *((\{('([[a-z]|[A-Z]|[0-9]+|[$_]])'
programmers get a better view of pointer data structures. *\,*)*\})|(\{(([0-9]+)\ *\,*)*\}));/gm;
recognizes examples such as :
It provides interactive visualization to the users. The char p[2][3]={'a','b','1','d','c','2'}
floating representations of links among various nodes
Regular expression [A] points to pointer declarations
3
PointerViz can be installed on Mozilla Firefox as well.
alone, where in the pointers point to a garbage value.
4
https://ideone.com/ Statements in which pointers are assigned NULL values
5
http://codepad.org/ are recognized by Regular expression [B]. Regular
6
https://visjs.org/

Page 120
expression [C] recognizes statements in which the size: 30,
pointers are assigned the address of a variable. Arrays font: { size: 30,
multi: true
of a given size can be obtained from Regular expression },
[D]. Two dimensional arrays of given row and column borderWidth: 2,
shadow:true
sizes are recognized by Regular expression [E]. Pointers },
to strings are recognized by Regular expression [F]. edges: {
width: 3,
One dimensional arrays whose elements are defined are }
recognized by Regular expression [G] and 2D arrays };
whose elements are defined at the time of declaration
are recognized by Regular expression [H].
For every regular expression that has been Visualization is updated regularly at the end of every
formulated, a function is defined to generate the statement. Code is processed in the form of tokens,
corresponding visualization. Every visualization is a set which are fed into each of the pattern recognizing
of nodes with connections between them that are functions. The function which contains matching
represented using edges. Node shapes are defined in regular expression is executed. New patterns that are
functions in a way, such that they convey the semantic not defined previously can easily be added, by defining
meaning of statements written by the user. The new functions the newly defined patterns, making it
difference in address space between nodes is also easy to extend this plugin from a developer’s
represented in by a numeric value between the nodes, perspective.
representing the number of bytes. These nodes and
edges are passed as a dataset to previously stated 4. Working of PointerViz
visualization framework, vis.js to render visualizations.
Functions take parsed tokens as inputs and verify if The main aim of PointerViz is to display the
they match any of the defined regular expressions. They references of pointer data structures as used in the code
return options of shapes, nodes and edges in the form of written by the user. Workflow of PointerViz is a seven
data. The function in script below deals with statements step mechanism, as shown in Figure 2.
of the form defined in Regular expression [A]. • Step 1: User enters a statement in desired
programming language among C or C++ in the
function ptr_type1(code) {
const regex_1 =/[a-z]+\ text space provided by ideone.com, as the current
\*([a-zA-Z$_][a-zA-Z0-9$_]*)\;/gm; prototype is being tested forideone.com.
const m = regex_1.exec(code);
const identifier =m[1];
. • Step 2: Tokens are extracted from these
.
const data = { statements and are considered as individual
nodes: nodes,edges: edges}; statements. Token extraction is done with help of
return [data, options];
}
pointerViz.js script that filters out statements by
semi colons used. Even if users enter various
Definitions for Edges, nodes and shape options are statements in the same line, they can be separated
shown in the script below considering Regular out by considering semi colon symbols.
expression [A] as an example, where nodes are defined • Step 3: Extracted tokens are passed to
to be displayed as circles and edges as arrows. pointerViz.js file, which forms the basis of plugin.
Variables and pointers are defined to be displayed as Functions written in the script process these
circles and arrays are represented as rectangular boxes. tokens and compare them with regular
expressions which are defined apriori.
const identifier = m[1];
const nodes = [
{id:0, label: identifier, • Step 4: The pointerViz.js file generates nodes
group: "0", title: code}, edges based on the matched regular expressions.
{id:2, shape: 'dot',
label: "Garbage"} It then renders shapes corresponding to these
]; regular expressions, as defined in each function.
const edges = [
{from: 0, to: 2, arrows: 'to'}
]; • Step 5: Resulting nodes and edges are passed to
const options = { vis.js framework to produce results by processing
nodes: {
shape: 'circle', them. It provides overlays for the same as
mentioned in the pointerViz.js file.

Page 121
 Figure 2. Stepwise Working of PointerViz

• Step 6: Results are produced in the form of 5. User Scenario

visualizations based on the code entered by user.
Suppose Veda is a novice programmer working on
• Step 7: The results obtained in the previous step C programming language and she wishes to learn the
are displayed to the user in the space provided how pointers refer to various variables in the program.
below the existing text space. Users are provided She then visits ideone.com, an online coding
with facilities to change orientations of the playground, selects C as the language she wishes to
figures and also to view code that resulted in code.
creation of the node by hovering on the first
• Case 1: She starts typing the first statement:
node.
int*p;
For each line entered by the user on the console
Visualization of this statement is displayed. She
provided, PointerViz compares the statement with
then hovers on the node p displayed in the
predefined regular expressions. For a correct match, the
visualizations. The code that resulted in creation
shapes and their relations are displayed. These shapes of node p is displayed above this node as shown
help novice users to differentiate among various types
in Figure 3.
of pointer declarations. The pointers are visualized
using circles with arrows emerging from these circles.
These arrows point to the referenced variables as per
the identified tokens. The shapes used to represent
these data structures contain respective variables that
have been used by users in their code for better
readability. Figure 3. Visualization of code for Case 1

Semi colons are used as delimiting symbols to

separate tokens in monolithic code. As we have • Case 2: She writes another statement in addition
implemented PointerViz for programming languages to the previous statement resulting in the
like C and C++, it identifies next line or statement by following code
semi colon. As new statements are entered, new int*p;
visualizations with respect to those statements are i n t * q = NULL;
generated and displayed to the user. Visualizations of i n t * s = &a ;
previously entered statements are maintained to help
users revisit those structures instead of re-writing the A visualization of the statement is displayed with
same statements. Visualizations are done in First Come s as a circular node and an arrow originating from
First Display pattern i.e., visualizations of latest this node to another circular node a as shown in
statements are displayed at the bottom, similar to push Figure 4. Also, the statement where a pointer is
operations in queue. Users can select and drag nodes in assigned a NULL value is represented with a
the displayed visualizations to alter their orientation. circular node q pointing to another circular node
having the value as NULL. These statements are
visualized and displayed below the previous
statement as shown in Figure 4.

Page 122
 char p [ 2 ] [ 3 ] ;

Veda can view visualization on the page as in

Figure 6. Since, the array is a character array,
each element of the array occupies 1 byte in the
memory and hence, it indicates that one element
occupies the memory location that is equal to
memory location of the preceding element+1.

Figure 6. Visualization of code for Case 4

• Case 5: Veda, then writes a statement

Figure 4. Screenshot of PointerViz showing
representing a pointer to string:
visualization of code for Case 2
char *p = "moksha";
• Case3: Veda adds another statement that The above statement is then displayed to Veda as
declares an empty array of size five. shown in Figure 7, where the pointer variable p
points to the given string and stores the address
intp[5]; of the first character in the string (m in this
example).
Veda can view visualization of the statement by
scrolling down the page as in Figure5. The
difference between memory address of one
element of the array to the next element is
represented with the numeric value of number of
bytes that differ, on a line between the elements.
Since the entered array is an integer array, each
element occupies a memory of 4 bytes and hence,
memory locations of consequent elements differ
by 4 bytes, as indicated between the nodes in
Figure 5.

Figure 7. Visualization of code for Case 5

• Case 6: Veda writes another statement that

defines a character array of size3.
i n t p [ 3 ] = { ' a ' , ' s ' , 'm ' } ;

Visualization of the above statement is displayed

as shown in Figure 8.

Figure 5. Visualization of code for Case 3 • Case 7: Visualization of a two dimensional array
defined at the time of declaration as given below,
is displayed as shown in Figure 9.
• Case 4: When Veda writes a statement with a intp[2][3]={ 1,3,5,7,9,2} ;
two dimensional character array of two rows and
three columns.

Page 123
 Table 1. Questions in survey using a 5-point Likert
Scale.

Q1: How easy was it to use PointerViz interface?

(1=very easy, 5=very difficult)

Q2: PointerViz has visualized pointer data

structures clearly and correctly. (1=strongly
agree, 5=strongly disagree)
Figure 8. Visualization of code for Case6 Q3: PointerViz has helped me in learning
about various ways of usages of pointer data structures.
(1=strongly agree, 5=strongly disagree)

Q4: PointerViz has kept the whole experiment

interesting and informative. (1=strongly agree,
5=strongly disagree)

Q5: I will recommend PointerViz to my peers.

(1=strongly agree, 5=strongly disagree)

82% of participants have agreed that PointerViz has

visualized the statements clearly and correctly. The
ratings in Q3 and Q4 indicate that PointerViz has helped
about 77% of participants learn about various ways of
Figure 9. Visualization of code for Case7 using pointers and that the experiment has been
considerably interesting (80% in Q4). However, they
have also suggested increasing the scope of
6. Evaluation visualization to various definitions of pointers. In Q5,
most of the participants have agreed that they would
To evaluate PointerViz, we have conducted a user recommend PointerViz to their peers (83%).
experience study with 40 volunteers, in the age group
of 18-20 years, from various universities. The 8. Discussion and Limitations
participants were asked to install our PointerViz plugin
as an extension to Google Chrome browser, on their The core idea of this paper is to apply the concept
personal desktops or laptops. They were also provided of visualization to aid users in understanding critical
with a slide-show depicting the procedure to install concepts in programming languages. One of the critical
PointerViz, a sample working video of the plug-in and aspects as identified by researchers is pointers [12].
few sample statements that contain pointers, which PointerViz prototype is a first step towards supporting
served as a basic tutorial. They were then asked to critical programming concepts through visualization. In
write code that involved snippets containing pointers order to do an in-line visualization of code, the current
usingideone.com. The participants were suggested to implementation of the tool uses lexical analysis and
view and verify visualizations displayed based on the parsing at statement level instead of block level. We
code that they have written. A user survey has been have limited the scope of PointerViz to understand
conducted with the help of a five point Likert Scale. A individual statements and visualize the same. We shall
questionnaire as provided in Table 1, in which each hence extend PointerViz to support analysis of
question has to be rated on a scale of 1 to 5, has been complete code considering relations among the
sent to volunteers to assess their experience and statements in code in the future versions. While we
evaluate PointerViz. initially planned to map understanding pointers with
different levels of Bloom’s taxonomy, we limited our
7. Results scope to basic concepts in the current version.
While the idea seems to be simple, we aim to extend
As reported in Figure 10, PointerViz had a good this to support visualization of pointers in cases where
user-friendly interface (83% in Q1). In Q2, about

Page 124
 References
[1] Y. Bosse and M. A. Gerosa, “Why is programming so
difficult to learn?: Patterns of difficulties related to
programming learning mid-stage,” ACM SIGSOFT
Software Engineering Notes, vol. 41, pp. 1–6, 01 2017.
[2] A. Luxton-Reilly, E. McMillan, E. Stevenson,
E. Tempero, and P. Denny, “Ladebug: an online tool to
help novice programmers improve their debugging
skills,” in Proceedings of the 23rd Annual ACM
Conference on Innovation and Technology in Computer
Science Education, pp. 159–164, ACM, 2018.
[3] P. J. Guo, “Online python tutor: embeddable web-based
program visualization for cs education,” in Proceeding of
the 44th ACM technical symposium on Computer science
education, pp. 579–584, ACM, 2013.
[4] S. H. Kim and J. W. Jeon, “Programming lego
mindstorms nxt with visual programming,” in Control,
Figure 10. Results of User Survey Questionnaire Automation and Systems, 2007. ICCAS’07. International
Conference on, pp. 2468–2472, IEEE, 2007.
[5] J. H. Maloney, K. Peppler, Y. Kafai, M. Resnick, and
N. Rusk, “Programming by choice: Urban youth
pointers deal with various programming concepts such as learning programming with scratch,” in Proceedings of
use of pointers in a function, array of pointers, linked lists the 39th SIGCSE Technical Symposium on Computer
and use of pointers in user defined data types such as Science Education, SIGCSE ’08, (New York, NY, USA),
pp. 367–371, ACM, 2008.
structures. Though the current prototype focuses only on
[6] A. Marron, G. Weiss, and G. Wiener, “A decentralized
visualizing code statement wise, based on the feedback approach for programming interactive applications with
we received, PointerViz could help novices get a better javascript and blockly,” in Proceedings of the 2nd edition
understanding of the pointers and references. on Programming systems, languages and applications
based on actors, agents, and decentralized control
abstractions, pp. 59–70, ACM, 2012.
9. Conclusion and Future Work [7] M. Muratet, P. Torguet, J.-P. Jessel, and F. Viallet,
“Towards a serious game to help students learn computer
programming,” International Journal of Computer
In this paper, we have introduced PointerViz to Games Technology, vol. 2009, p. 3, 2009.
visualize pointers, as a prototype extension to Google [8] C. North and B. Shneiderman, “Snap-together
Chrome web browser that augments ideone.com. As visualization: can users construct and operate
pointers are considered to be one of the critical aspects coordinated visualizations?,” International Journal of
Human-Computer Studies, vol. 53, no. 5, pp. 715–739,
of learning programming, our work aims to support 2000.
novice programmers learn better [12,1]. PointerViz [9] E. L. Glassman, T. Zhang, B. Hartmann, and
prototype has visualized code written by users upto a M. Kim, “Visualizing api usage examples at scale,” in
decent level of satisfaction, owing to 82% of Proceedings of the 2018 CHI Conference on Human
participants willing to recommend this plugin to their Factors in Computing Systems, p. 580, ACM, 2018.
peers. PointerViz can easily be extended to support other [10] B. W. Kernighan and D. M. Ritchie, The C programming
language. 2006.
online coding platforms as well. As reported by survey
[11] A. D. Robison and P. F. Dubois, “C++ gets faster for
participants, one most important suggestion is to extend scientific computing,” Computers in Physics, vol. 10,
PointerViz for other usages of pointers such as linked no. 5, pp. 458–462, 1996.
lists and doubly linked lists. We plan to extend the [12] E. Lahtinen, K. Ala-Mutka, and H.-M. Järvinen, “A
plugin to support multiple scenarios of pointers pointing study of the difficulties of novice programmers,” Acm
Sigcse Bulletin, vol. 37, no. 3, pp. 14–18, 2005.
to pointers, array of pointers. We shall also extend the
plugin to include display of timely visualizations of [13] S. Bassil, R. K. Keller, et al., “Software visualization
tools: Survey and analysis.,” in IWPC, pp. 7–17, 2001.
code blocks. We see this work as a first step towards
[14] A. J. Ko, B. A. Myers, and H. H. Aung, “Six learning
improving program comprehension through barriers in end-user programming systems,” in 2004
visualization that could help novice programmers. IEEE Symposium on Visual Languages-Human Centric
Computing, pp. 199–206, IEEE, 2004.
[15] A. Scott, M. Watkins, and D. McPhee, “E-learning for
Acknowledgements novice programmers; a dynamic visualisation and
problem solving tool,” in Information and
We thank all the volunteers for their valuable time Communication Technologies: From Theory to
Applications, 2008. ICTTA 2008. 3rd International
and honest feedback that helped us in evaluating Conference on, pp. 1–6, IEEE, 2008.
PointerViz.

Page 125
[16] B. Broll, A. Le´deczi, P. Volgyesi, J. Sallai, M.Maroti, A. allocators,” in Proceedings of the 5th international
Carrillo, S. L. Weeden-Wright, C. Vanags, J. D. Swartz, symposium on Memory management, pp. 115–125,
and M. Lu, “A visual programming environment for ACM, 2006.
learning distributed programming,” in Proceedings of the [22] M. Ko¨lling, B. Quig, A. Patterson, and J.
2017 ACM SIGCSE Technical Symposium on Computer Rosenberg, “The bluej system and its pedagogy,”
Science Education, pp. 81–86, ACM, 2017. Computer Science Education, vol. 13, no. 4, pp. 249–268,
[17] A. Vahldick, A. J. Mendes, and M. J. Marcelino, “A 2003.
review of games designed to improve introductory [23] C. Huizing, R. Kuiper, C. Luijten, V. Vandalon, et al.,
computer programming competencies,” in Frontiers in “Visualization of object-oriented (java) programs.,” in
Education Conference (FIE), 2014 IEEE, pp. 1–7, IEEE, CSEDU (1), pp. 65–72, 2012.
2014. [24] S. Halim, “Visualgo,” Dostupne´ net/en, 2015.
[18] S. Leutenegger and J. Edgington, “A games first approach z:¡ https://visualgo.
to teaching introductory programming,” in ACM SIGCSE [25] A. Moreno and M. S. Joy, “Jeliot 3 in a demanding
Bulletin, vol. 39, pp. 115–118, ACM, 2007. educational setting,” Electronic Notes in Theoretical
[19] M. A. Miljanovic and J. S. Bradbury, “Robot on!: a Computer Science, vol. 178, pp. 51–59, 2007.
serious game for improving programming comprehension,” [26] J. Yang, Y. Lee, and D. Hicks, “Synchronized static
in Games and Software Engineering (GAS), 2016 and dynamic visualization in a web-based programming
IEEE/ACM 5th International Workshop on, pp. 33–36, environment,” in Program Comprehension (ICPC), 2016
IEEE, 2016. IEEE 24th International Conference on, pp. 1–4, IEEE,
[20] M. A. Miljanovic and J. S. Bradbury, “Robobug: A serious 2016.
game for learning debugging techniques,” in [27] R. Ishizue, K. Sakamoto, H. Washizaki, andY. Fukazawa,
Proceedings of the 2017 ACM Conference on “Pvc: Visualizing c programs on web browsers for
International Computing Education Research, pp. 93– novices,” in Proceedings of the 49th ACM Technical
100, ACM, 2017. Symposium on Computer Science Education, pp.245–
[21] A. M. Cheadle, A. Field, J. Ayres, N. Dunn, R. A. Hayden, 250,ACM,2018.
and J. Nystrom-Persson, “Visualising dynamic memory

Page 126