e-ISBN : 978-629-98755-2-9 SIG : e-Learning@CS

https://appspenang.uitm.edu.my/sigcs/
Publication Date : 18 – Sep - 2024

GAMIFICATION DESIGN FOR ONLINE LEARNING OF

INTRODUCTORY PROGRAMMING: A COMPARATIVE ANALYSIS

*Mahfudzah Othman1, Aznoora Osman2, Siti Zulaiha Ahmad3 and Natrah Abdullah4
*[email protected], [email protected], [email protected], [email protected]
1,2,3
College of Computing, Informatics and Mathematics,
Universiti Teknologi MARA Cawangan Perlis, Malaysia
4
College of Computing, Informatics and Mathematics,
Universiti Teknologi MARA Shah Alam, Selangor, Malaysia

*Corresponding author

ABSTRACT
This paper discusses the gamification design recommended for an online learning platform specifically for the
introductory programming course. Initially, during literature search, more than 50 existing studies were
manually selected through various literature databases. It then led to the selection of ten studies that utilised
gamification design principles in online learning platforms to learn introductory programming in higher learning
institutions based on the pre-determined themes during the extraction and filtration phase. A further detailed
criteria of the comparative analysis during the review and analysis phase were then applied which resulted in the
findings of the gamification framework, gamification principles, and gamification elements suitable for the
gamified online learning environment of the introductory programming course.

Keywords: gamification, design principles, introductory programming, online learning

Introduction
In facilitating the teaching and learning of introductory programming, over these years, many studies
have utilised online learning platforms. For example, a study done by Karnalim and Ayub (2017) have
resulted in a development of an online learning system named PythonTutor to support the teaching and
learning of an introductory programming course. The system was embedded with the visualisation
technique claimed to have positive impacts towards students’ understanding in programming, especially
at their early stages. Moreover, Carbonaro (2018) has utilised a web-based peer code review and
assessment to promote students’ engagement and participation in the coding experience, while also
providing feedback to their peers. The web-based programming assistance system enhances students'
programming skills, engagement, and time management abilities. Through this approach, students are
involved not only as learners but also as reviewers.

Additionally, gamification in online learning environments to learn introductory programming

has also gained interest among researchers and academicians. For instance, a study done by Khaleel et
al. (2019) has used the Mechanics-Dynamics-Aesthetics (MDA) Framework as the design guidelines
in the development of the gamification-based learning website to learn Java programming. According

129
e-ISBN : 978-629-98755-2-9 SIG : e-Learning@CS
https://appspenang.uitm.edu.my/sigcs/
Publication Date : 18 – Sep - 2024

to the study, the structure of the gamification application encompasses several key components:
mechanics, which are the tools of gamification integrated with programming content to enhance student
effectiveness and make the programming course more engaging; dynamics, which involve how users
interact with these mechanics; and aesthetics, which pertain to the emotional responses elicited by the
application's design. The use of the MDA Framework facilitated the inclusion of various gamification
elements in the online learning system, including levels, a scoring system, badges, and a leaderboard,
all aimed at creating a compelling user interface.

Nevertheless, designing a gamified online learning posed challenges for many instructional
designers (Hunicke et al., 2004; Deterding et al., 2011). One needs to consider the game mechanics
and how to dynamically instruct them to successfully deliver a gameful experience and invoking
aesthetics emotions (Hunicke et al., 2004; Khaleel et al., 2019). Hence, understanding the framework,
principles and elements of gamification can help to design gamified online learning that are more
interactive, engaging and motivating for the introductory programming course. Therefore, this paper
seeks to identify and extract the suitable gamification framework, principles and elements to be
employed in a gamified online learning environment for an introductory programming course through
a comparative analysis. The structure of this paper starts with the explanation of the methodology for
the comparative analysis, followed by the findings and conclusions.

Methodology
This study employed the qualitative approach using the comparative analysis technique adopted from
Ahmad and Abdul Mutalib (2015) which involves three main phases, i) literature search, ii) elicitation
and filtration, and iii) review and analysis.

The following is the description of each of the phases involved in conducting the comparative
analysis:
a) Literature search
In the first phase, an extensive literature search was conducted through various literature
databases such as Scopus, Web of Science (WoS), IEEE and Google Scholar. This was to search for
articles that are related to the implementation of gamification in online learning platforms, specifically
in learning introductory programming. The search for the articles is being done throughout the year
2018 until 2023. Several keywords have been used, such as “introductory programming”, “online
learning”, “gamification for education”, “gamification principles”, and “gamification elements”.

130
e-ISBN : 978-629-98755-2-9 SIG : e-Learning@CS
https://appspenang.uitm.edu.my/sigcs/
Publication Date : 18 – Sep - 2024

b) Elicitation and filtration

Through manual selection, initially, more than 50 articles were selected. To further select the
most suitable articles for this study, certain themes have been pre-determined where all selected studies
must i) be related to the online learning for introductory programming courses in higher learning
institutions, ii) discussed the gamification framework they have referred to, iii) discussed the
gamification principles that they have employed in the online learning platform, and iv) discussed the
gamification elements used in the study.

Therefore, based on the pre-determined themes, only ten articles have been deemed suitable for
further review and analysis. All ten selected articles have extensively discussed the implementation of
gamification in online learning platforms to support the teaching and learning of introductory
programming in higher learning institutions, which eventually helped to establish the direction of this
study.

c) Review and analysis

All ten articles were further reviewed and analysed in terms of these criteria, i) gamification
framework, ii) gamification principles, and iii) gamification elements. The following section will
discuss in detail the review and analysis results.

Findings
As mentioned previously, all ten existing studies were selected based on the pre-determined themes.
Table 1 shows the studies selected for the review and analysis process.

Table 1: The selected existing studies

Author Studies
Imran (2023) A Gamified Learning Environment Model
Nadja (2022) A Personalized Gamification Design Model (PeGAM)
Poonsawad et al. (2022) Problem-based Interactive Digital Story Learning Model
Alsubhi et al. (2021) Engagement Framework for E-learning Gamification
Kamunya et al. (2020) An Adaptive Gamification Model of E-learning
Winanti et al. (2020) Gamification Framework for Programming Course in Higher Education
Alshammari (2019) Gamification Design Model for E-learning
Khaleel et al. (2019) Gamification-based Learning Framework for a Programming Course
Padirayon (2019) Gamification Application Architecture and Elements
Piteira et al. (2018) Conceptual Framework of Gamification on Online Courses

131
e-ISBN : 978-629-98755-2-9 SIG : e-Learning@CS
https://appspenang.uitm.edu.my/sigcs/
Publication Date : 18 – Sep - 2024

Through the review and analysis process, detailed criteria were extracted to determine the
gamification design principles that are suitable for the online learning of introductory programming.
As a result, Table 2 shows the findings of the comparative analysis conducted. As mentioned previously,
the criteria extracted from the existing studies are the gamification framework, gamification principles
and gamification elements.

Table 2: Comparative analysis of gamification implementation in online learning

for introductory programming
Author Gamification Gamification Gamification
Framework Principles Elements
Imran (2023) MDA Framework Progression, Points, badges,
achievement, rules and levels, leaderboard,
challenges, progress bar
storyline/narrative
Nadja (2022) Adaptive user centred Progression, rules and Badges,
gamification challenges, leaderboard,
framework feedback/achievement, progress bar, virtual
sensation goods
Poonsawad et al. (2022) MDA Framework Progression, rules and Points, badges,
challenges, levels, leaderboard,
feedback/achievement progress bar
storyline/narrative,
sensation
Alsubhi et al. (2021) MDA Framework Progression, Points, badges,
achievement, rules and levels, leaderboard,
challenges, sensation progress bar, timer
Kamunya et al. (2020) MDA Framework Rules and challenges, Badges,
rewards/status, leaderboard,
achievement, progress bar, virtual
competition, altruism goods
Winanti et al. (2020) Gamification framework Progression, Points, badges,
for K-6 education achievement, rules and levels, leaderboard
challenges, sensation
Alshammari (2019) MDA Framework Rules and challenges, Points, badges,
rewards/status, levels, leaderboard,
achievement, timer
progression
Khaleel et al. (2019) MDA Framework Progression, Points, badges,
achievement, rules and levels, leaderboard,
challenges, progress bar
competition, altruism,
sensation
Padirayon (2019) MDA Framework Progression, Points, badges,
achievement, rules and levels, leaderboard,
challenges, sensation progress bar
Piteira et al. (2018) Principles of Gamified Progression, Points, badges,
Educational Design achievement, rules and levels, leaderboard,
challenges, narrative, progress bar
sensation

132
e-ISBN : 978-629-98755-2-9 SIG : e-Learning@CS
https://appspenang.uitm.edu.my/sigcs/
Publication Date : 18 – Sep - 2024

Based on the findings depicted in Table 2, it has been found that the MDA Framework has been
the most selected gamification framework among the existing studies, where seven out of ten studies
have been referring to the MDA Framework. The MDA Framework, which stands for game Mechanics,
Dynamics and Aesthetics was first introduced by Hunicke et al. (2004) to be used in the educational
technology environment. The flexibility and adaptability of the three distinct layers of the MDA
Framework have contributed to the widely applied gamification framework in the online learning
environment for the introductory programming course as mentioned by Khaleel et al. (2019), Alsubhi
et al. (2021) and Imran (2023). Additionally, the MDA Framework also focuses on the student’s
experiences and emotions which influences enjoyment, engagement and motivation (Alshammari,
2019; Poonsawad et al., 2022).

Meanwhile, Table 2 has also revealed that the most applied gamification principles for the
online learning environment of learning introductory programming are achievement, rules and
challenges, and progression. In most of the existing studies, the achievement principle represents the
successful completion of a course, a lesson, or a challenge in a gamified online learning system
(Padirayon, 2019; Alshammari, 2019; Nadja, 2022). In addition, the rules and challenges principles
required a defined goal setting, telling learners what and how to achieve in a narrative or storyline.
Other than that, challenges also serve as elements that instruct learners on the system’s required actions,
such as course obstacles that must be unlocked before progressing to the next level (Khaleel et al., 2019;
Kamunya et al., 2020; Alsubhi et al., 2021; Imran, 2023). Moreover, the progression principle
represented as ropes of engagement to keep users motivated and interested. Unlocking levels and
interactive progress bars are typically used to represent a learner’s progress (Piteira et al., 2018; Khaleel
et al., 2019; Winanti et al., 2020; Poonsawad et al., 2022).

Furthermore, the gamification principles identified previously have also influenced the
selection of the gamification elements among the existing studies. In most cases, as shown in Table 2,
the gamification principles selected for the online learning of introductory programming often required
the utilisation of gamification elements such as accumulating points, badges and acquiring ranks in the
leaderboards that represent the achievement principle. Additionally, unlocking levels and progress bars
also represent progression of accomplishing rules and challenges, which then led to invoking learners’
sensation and motivation to stay engage with the online learning (Piteira et al., 2018; Khaleel et al.,
2019; Winanti et al., 2020; Poonsawad et al., 2022. Nadja, 2022; Imran, 2023).

Therefore, based on the findings of the comparative analysis, a comprehensive gamification

design can be conceptualised to provide guidance to the development of a gamified online learning

133
e-ISBN : 978-629-98755-2-9 SIG : e-Learning@CS
https://appspenang.uitm.edu.my/sigcs/
Publication Date : 18 – Sep - 2024

system for the introductory programming. Figure 1 shows the assimilation of the extracted gamification
principles and elements and how it can be integrated within the three layers of the MDA Framework.

Figure 1: Integration of the recommended gamification design for a gamified online learning
environment of introductory programming

Conclusion
Gamification design in online learning environments has been widely researched and implemented over
the years. Nevertheless, in learning introductory programming via online platform, it is crucial to
determine the suitable gamification design that would help learners to stay engaged with online learning,
whilst improving their motivation. To achieve this, a comparative analysis among ten existing studies
was conducted to identify and extract the suitable gamification framework, principles and elements for
a gamified online learning environment of the introductory programming course. The findings have
shown that the MDA Framework was most effective to be implemented in the online learning
environment because of its flexibility and adaptability with its three distinct layers of gamification
design; the game mechanics, dynamics and aesthetics. Meanwhile, the most suitable gamification
principles identified are the achievement, rules and challenges, and progression, with gamification
elements of points, badges, levels, leaderboards and progress bars. Each principle provides mechanisms
to represent learners’ accomplishments through narrative in challenges, and learners’ progression in
unlocking levels and proceeding in acquiring higher ranks. Additionally, the game elements represent
the game mechanics that provide interactive elements for accumulating points and badges, virtual
presentation of progress bars, unlocking levels and accomplishing ranks in the leaderboards. In
conclusion, as a result of these findings, a conceptual gamification design has been developed, which

134
e-ISBN : 978-629-98755-2-9 SIG : e-Learning@CS
https://appspenang.uitm.edu.my/sigcs/
Publication Date : 18 – Sep - 2024

in hope to lead the development of a more effective gamified online learning system for introductory
programming.

References:
Ahmad, S. Z., & Abdul Mutalib, A. (2015). Exploring Computer Assisted Learning for Low Achieving
Children: A Comparative Analysis Study. Jurnal Teknologi (Sciences & Engineering) 77:29, 1–
7.

Alshammari, M. T. (2019). Design and Learning Effectiveness Evaluation of Gamification in e-

Learning Systems, International Journal of Advanced Computer Science and Applications
(IJACSA), 10(9), 2019. http://dx.doi.org/10.14569/IJACSA.2019.0100926.

Alsubhi, M. A., Ashaari, N. S. & Wook, T.S.M.T. (2021). Design and evaluation of an engagement
framework for e-learning gamification, International Journal of Advanced Computer Science and
Applications (IJACSA), 12(9), http://dx.doi.org/10.14569/IJACSA.2021.0120947.

Carbonaro, A. (2019). Good practices to influence engagement and learning outcomes on traditional
introductory programming course. Interactive Learning Environments, 27(7), 919–926.

Deterding, S., Dixon, D., Khaled, R. & Nacke, L. (2014). From game design elements to gamefulness,
Proc. 15th Int. Acad. MindTrek Conf. Envisioning Futur. Media Environ. - MindTrek ’11, March
2014, p.9.

Hunicke, R., LeBlanc, M. & Zubek, R. (2004). MDA: A Formal Approach to Game Design and Game
Research. Northwestern University.

Imran, H. (2023). An Empirical Investigation of the Different Levels of Gamification in an Introductory

Programming Course. Journal of Educational Computing Research, 61(4), 847-874.
https://doi.org/10.1177/07356331221144074.

Kamunya, S., Mirirti, E., Oboko, R. & Maina, E. (2020). An Adaptive Model for E-Learning, 2020 IST-
Africa Conference (IST-Africa), pp. 1-10.

Karnalim, O. & Ayub, M. (2017). The Effectiveness of a Program Visualization Tool on Introductory
Programming: A Case Study with PythonTutor. CommIT (Communication & Information
Technology) Journal, 11(2), 67–76.

Khaleel, F.L., Ashaari, N.S. & Wook, T.S.M.T. (2019). An empirical study on gamification for learning
programming language website, J. Teknol., vol. 81, no. 2, pp. 151–162, 2019.

Nadja, Z. (2022). PEGAM – a Personalized Gamification design Model for programming language e-
courses. Doctoral thesis, RWTH Aachen University, Germany. DOI:
10.13140/RG.2.2.30798.74567.

Padirayon, L. M. (2019). The Designed Gamification Application Architecture and Elements for a C#
Programming Course. Proceedings of the 2019 4th International Conference on Multimedia
Systems and Signal Processing - ICMSSP 2019. doi:10.1145/3330393.3330414.

135
e-ISBN : 978-629-98755-2-9 SIG : e-Learning@CS
https://appspenang.uitm.edu.my/sigcs/
Publication Date : 18 – Sep - 2024

Piteira, M., Costa, C. J., & Aparicio, M. (2018). Computer Programming Learning: How to Apply
Gamification on Online Courses?. Journal of Information Systems Engineering and
Management, 3(2), 11. https://doi.org/10.20897/jisem.201811.

Poonsawad, A., Srisomphan, J., & Sanrach, C. (2022). Synthesis of Problem-Based Interactive Digital
Storytelling Learning Model Under Gamification Environment Promotes Students’ Problem-
Solving Skills. International Journal of Emerging Technologies in Learning (iJET), 17(05), pp.
103–119. https://doi.org/10.3991/ijet.v17i05.28181

Winanti, Abbas, B.S., Suparta, W., Heryadi, Y. & Gaol, F. L. (2020). Gamification Framework for
Programming Course in Higher Education, Journal of Game, Game Art and Gamification, Vol.
05, No. 02.

136