Skip to content
Elise DeitrickFebruary 27, 20194 min read

Python Tutor comes to Codio as a ‘Code Visualizer’

Code Visualization tools like Python Tutor can help students better understand complex programming concepts like parameters, constructors, and recursion.

Code visualizer in Codio

For many computer science educators, Python Tutor is a familiar name. Philip Guo’s wonderful resource has been around for almost a decade. During that time, “over five million people in over 180 countries have used Python Tutor to visualize over 75 million pieces of code.”

Create Free Instructor Account

What does Python Tutor do?

Python Tutor is designed to help coding students learn exactly what happens as a computer runs each line of code. This process of code visualization allows coders to see, in real-time, the output of their code. Live Python visualization has been demonstrated to speed up the Python coding learning process and vastly improve coding class performance .

Because Python Tutor exists online, anyone can learn to write code right in their web browser. The Python code visualization tool is designed specifically for classroom learning. The best tutor for Python is the coding instructor and student trial and error!

Why a Code Visualization Tool? Why Python Tutor?

Previous research has shown that students who interacted more with an earlier version of Python Tutor outside class had statistically significantly higher midterm exam grades. Additionally, the use of the Python code visualizer outside class was correlated with the students’ performance on unannounced quizzes.[1]

A professor at UC Davis wrote, “I have students who are currently retaking the class in the summer session, since they dropped out in spring, when they were struggling. I can see from their reaction in class that this tool has literally been an eye-opener for them - it’s making a huge difference!”[2]

One student posted, “This tool is particularly helpful when debugging recursive functions. I used it for the recursive unit at cs101 and it was a lifesaver.” Other students wrote that it was “exactly what I need to solve knotty python questions without cheating” and “exactly what I need to untangle lists and arrays.”[3]

Program and Python code visualizations “can help beginners develop a viable understanding of the notional machine…[and have] the potential to help students avoid and overcome misconceptions about tricky programming concepts such as parameters, constructors, or recursion.” [4]

But, Do Students Actually Use Python Code Visualization Tools?

Yes! Sirkiä and Sorva’s 2015 ICER paper reports “Most students used the [Python visualizer] throughout the course. Beginners used them somewhat more actively than non-beginners... Significantly, the students did not only use the [program visualizations] that were directly tied to a graded assignment.”[5]

And the students aren’t just clicking through this Python online tutor mindlessly. When moving through the steps of the Python code visualization “there are steps … where many students slow down. This suggests that a good number of students are paying attention and giving more consideration to certain animation steps than to routine ones. Informally, we observe that such collective slowdowns seem to happen in reasonable places, that is, at steps that are complex and/or pedagogically relevant.”[6]

What makes Codio’s Python Tutor implementation different?

Our implementation of Python Visualizer is designed to improve your student’s learning efficiency. it’s also designed to make course development and content authoring easier and more seamless for you, too!

Key Features of Codio’s Python Visualizer:

  • Natively embedded for easy content authoring

  • Turn off editing and pair it with an assessment

  • Make the code editable for students to use as a debugger tool

  • Pair with Codio’s audio element to create impactful demonstrations that you can scale (great for online learning programs)!

  • Python Visualizer exists in its own resizable window, which means you and your students can see everything at once.

To learn more about Codio’s Python Visualizer, schedule a call with a Codio team member who can walk you through the experience and give you tips on enhancing your materials with Codio’s platform and resources.

Create Free Instructor Account


Click here for instructions on enabling how Visualizer to open automatically. 

visualizer open

Below: Codio's Python Visualizer is enabled.

Python visualizer in Codio for python code visualization

Click here for instructions on how to create links in Guides so that students can easily open and close Codio's Visualizer.

create guides

Guide Your Learners with a Code Visualization Tool

Using Codio’s Visualizer allows educators to use Python Tutor effectively for step-by-step coding practice. Real-time breakdown of how code works can help learners understand what they are doing and why they are doing it.

 

Resources:

[1] Alvarado, C., Morrison, B. B., Ericson, B., Guzdial, M., Miller, B., & Ranum, D. L. (2012). Performance and use evaluation of an electronic book for introductory Python programming.

[2] Guo, P. J. (2013, March). 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.

[3] Ibid. (pp. 4-5)

[4] Sirkiä, T., & Sorva, J. (2015, July). How Do Students Use Program Visualizations within an Interactive Ebook?. In Proceedings of the eleventh annual International Conference on International Computing Education Research (p. 179). ACM.

[5] Ibid. (pp. 185-186)

[6] Ibid. (p. 185)

avatar

Elise Deitrick

Elise is Codio's VP of Product & Partnerships. She believes in making quality educational experiences available to everyone. With a BS in Computer Science and a PhD in STEM Education, she has spent the last several years teaching robotics, computer science and engineering. Elise now uses that experience and expertise to shape Codio's product and content.