On the Development of a Learning Gamification Model
TL;DR
This work develops a game system designed to transform traditional teaching methods of binary conversion often reliant on note memorization and chalkboard explanations into an immersive 3D virtual city experience using WebGL where learners engage with binary concepts through exploration, challenges, and real-time feedback.
Abstract
Smart phones have become important gadgets owned by most teens and adults. On the average, teens spend most of their time on the phone daily thus there is need to put the time spent on the phone to good use. In this work, Structured System analysis and Design Method, SSADM was used to develop a game system designed to transform traditional teaching methods of binary conversion often reliant on note memorization and chalkboard explanations into an immersive 3D virtual city experience using WebGL where learners engage with binary concepts through exploration, challenges, and real-time feedback. Developed using TypeScript, React Three Fiber, and Phaser.js, the platform features a customizable avatar, adaptive difficulty levels, and modular learning districts that support scalability to other computing topics. Key subsystems include tutorials, challenge modules, progress tracking, and accessibility features, all integrated within a user-centric and educationally compliant interface. System testing confirmed its effectiveness across usability, performance, and compatibility metrics. The project demonstrates the potential of game-based learning to enhance engagement, retention, and conceptual understanding in Science, Technology, Engineering and Mathematics, STEM education, and recommends its integration into school curricula and e-learning platforms.