Programming Learning Platform with Visual Aids
Abstract
This paper presents the design and development of a user-centric web-based programming learning platform aimed at novice programmers. The platform addresses common challenges in learning programming by integrating visual learning aids and interactive features. A real-time code visualization tool enables learners to trace code execution line-by-line, helping demystify abstract concepts and debug code logic. The system also incorporates progress tracking dashboards, formative assessments (quizzes and coding exercises), and a digital badge reward system to motivate continuous learning. The platform was implemented as a Single-Page Application using a cloud Backend-as-a-Service (Firebase) to support real-time data synchronization and user management. Development followed an iterative, user-centered approach, including usability testing with target users that informed subsequent refinements. Results indicate that the platform effectively engages beginners by bridging the gap between theoretical knowledge and practical application through interactive visual feedback. This work contributes an innovative e-learning solution that leverages visualization and gamification to enhance the learning experience for novice programmers.
Keywords: E-learning; Gamification; Novice programmers; Programming education; Visual code execution
Full Text:
PDFReferences
Ahadi, A., Lister, R., & Mathieson, L. (2018). Syntax error based quantification of the learning progress of the novice programmer. OPUS - Open Publications of UTS Scholars (University of Technology Sydney), 138, 10–14. https://doi.org/10.1145/3197091.3197121
Andries, F., & Lengkoan, F. (2023). The Importance of Students’ Perception of Online Learning During Pandemic. International Journal of Applied Business and International Management, 8(2), 142–152. https://doi.org/10.32535/ijabim.v8i2.2475
Brown, P. C., Roediger III, H. L., & McDaniel, M. A. (2014). Make it stick: The science of successful learning. The Belknap Press of Harvard University Press.
Garner. (2002). Reducing the Cognitive Load on Novice Programmers. https://files.eric.ed.gov/fulltext/ED477013.pdf
Gong, X., Xu, W., Yu, S., Ma, J., & Qiao, A. (2024). Enhancing computational thinking and spatial reasoning skills in gamification programming learning: A comparative study of tangible, block and paper?and?pencil tools. British Journal of Educational Technology, 56(1). https://doi.org/10.1111/bjet.13482
Guo, P. (2013). Online Python Tutor: Embeddable Web-Based Program Visualization for CS Education. https://pg.ucsd.edu/publications/Online-Python-Tutor-web-based-program-visualization_SIGCSE-2013.pdf
Hamari, J., Koivisto, J., & Sarsa, H. (2014, March 10). Does Gamification Work? -- A Literature Review of Empirical Studies on Gamification - IEEE Conference Publication. Ieee.org. https://ieeexplore.ieee.org/document/6758978
Hudin, S., Adil, A., Raja, P., Pahat, B., & Corresponding Author, M. (2024). Programming Challenges Experience by Primary School Students: A Systematic Literature Review. Programming Challenges Experience by Primary School Students: A Systematic Literature Review, 13(4). https://doi.org/10.6007/IJARPED/v13-i4/23238
III, H. L., & Butler, A. C. (2011). The critical role of retrieval practice in longterm retention. Trends in Cognitive Sciences, 15(1), 20–27. https://doi.org/10.1016/j.tics.2010.09.003
Kalelioglu, F., & Allsop, Y. (2024). International Journal of Computer Science Education in Schools. International Journal of Computer Science Education in Schools, 7(1). https://doi.org/10.21585/ijcses.v7i1
Lackner, K., & Podlipnig, S. (2022). Aiding Novice Programmers’ understanding of program flow by introducing sequential visualisation of graphical output and real-time visual debugging -a case study Bachelor of Science in Media Informatics and Visual Computing. https://static1.squarespace.com/static/60c2161caca2a51211d56f07/t/62c709449ba148099c5c8e39/1657211207612/Aiding_Novice_Programmers%E2%80%99_understanding_of_program_flow_by_introducing_sequential_visualisation_of_graphical_output_and_real-time_visual_debugging-a_case_study+study.pdf
Lahtinen, E., Ala-Mutka, K., & Järvinen, H.-M. (2005, September). (PDF) A study of the difficulties of novice programmers. ResearchGate. https://www.researchgate.net/publication/220808194_A_study_of_the_difficulties_of_novice_programmers
Ou Yang, F.-C., Lai, H.-M., & Wang, Y.-W. (2023). Effect of augmented reality-based virtual educational robotics on programming students’ enjoyment of learning, computational thinking skills, and academic achievement. Computers & Education, 195, 104721. https://doi.org/10.1016/j.compedu.2022.104721
Sabeh, H., Husin, H., Kee, D., Baharudin, A., & Abdullah, R. (2021). A systematic review of the DeLone and McLean model of information systems success in an e-learning context (2010–2020). IEEE Access, PP, 1–1. https://doi.org/10.1109/ACCESS.2021.3084815
Singh, S. (2022). Identifying Learning Challenges faced by Novice/Beginner Computer Programming Students: An Action Research Approach. https://ceur-ws.org/Vol-3330/Paper-09-SEED.pdf
Sorva, J., Karavirta, V., & Malmi, L. (2013). A review of generic program visualization systems for introductory programming education. ACM Trans. Comput. Educ., 13, 4. https://doi.org/10.1145/2490822
Tahir, F., Mitrovic, A., & Sotardi, V. (2022). Investigating the causal relationships between badges and learning outcomes in SQL-Tutor. Research and Practice in Technology Enhanced Learning, 17(1). https://doi.org/10.1186/s41039-022-00180-4
Zainudin, Z. A., & Zulkiply, N. (2023). Gamification in Learning: Students’ Motivation and Cognitive Engagement in Learning Business Using Quizizz. Asian Journal of University Education, 19(4), 823–833. https://doi.org/10.24191/ajue.v19i4.24928
DOI: https://doi.org/10.32535/jicp.v8i1.4002
Refbacks
- There are currently no refbacks.
Copyright (c) 2025 Foong Yuh Chung

This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.
Published by:
AIBPM Publisher
Editorial Office:
JL. Kahuripan No. 9 Hotel Sahid Montana, Malang, Indonesia
Phone:+62 341 366222
Email: journal.jicp@gmail.com
Website:http://ejournal.aibpmjournals.com/index.php/JICP
Supported by: Association of International Business & Professional Management
If you are interested to get the journal subscription you can contact us at admin@aibpm.org.
ISSN 2622-0989 (Print)
ISSN 2621-993X (Online)
DOI:Prefix 10.32535 by CrossREF
Journal of International Conference Proceedings (JICP) INDEXED:
In Process
This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.