THE MOBILE SERIOUS GAME “EASY HTML”: SCENARIOS AND PERSPECTIVES

The principle of gamification is very simple: it is a matter of using the game or its principles to facilitate learning. In our case, we are talking about mobile serious games (MSG), and more specifically the creation of scenarios to succeed this MSG. We present you the vision of our Easy course pack. This pack consists of several MSGs. Easy html is one of them. Nevertheless, we present some ideas about the scenarios, personalities and emotions that have impacted the development of MSG Easy html. Especially the importance of the 1st scenario which reflects the image of the game vis-à-vis the learner, the location of the trainer who passes the information via MSG and the developer who must ensure the ergonomics of the game and the correct and implicit passage of the educational information. this study gives as result an MSG which treats and explains all the tags of the HMTL language and certifies the learner at the end of the course.


INTRODUCTION
There are significant and significant gaps in learning with traditional methods today. Traditionally, 'classical' training is related to the current learning situation, in which a trainer imparts his knowledge to his students. Whatever the method (Projectbased learning, Problem-based learning, Discovery-based learning, Case-based learning, Cooperative/collaborative learning, Experiential learning).
However, because youth are constantly evolving, learning methods aimed primarily at the connected generation must also move forward. New methods, new technologies and new materials are available to students to ensure the proper reception of educational information.
Among the proposals made to improve learning, we find game learning, called Serious Game. And since the majority of learners have mobile equipment (laptop, smartphone, tablet, etc.), we are talking about Mobile Serious Game (MSG) as an innovative solution in the world of pedagogy and education.
With the progress of artificial intelligence, the design of the games has evolved towards the detection of the emotions and personalities of the learners, which allows changing and adapting the game according to the mood of the learner. What ties it more to the MSG and improves the profitability of the game aims for life the traditional method.
In this article we propose a new MSG Pack (Easy course) which will contain as a start a first MSG named Easy html. As its name suggests, the game consists of explaining an HTML course and proving the effectiveness of this new concept.
In this paper, we present the process of creating scenarios. Section 1 contains a presentation dedicated to Easy course and Easy html, the history of the pack and the role of the detection of a learner's personalities and emotions. As for the 2nd section, it presents the scenarios of Easy html, including the importance of the 1st scenario and the description of the chosen personalities. Finally, section 6 provides a conclusion and some perspectives.

EASY COURSE & EASY HTML
Easy course is a pack of mobile serious games that consist of facilitating learning and making it more fun thanks to MSGs. The pack will contain a set of MSGs that represent different courses in different areas. Among these courses we find the Easy HTML MSG which explains the detailed HTML course, we will detail this part below.
However, the pack consists of creating a family of relative games, which are characterized by commonalities and variable points as quoted on the article (Meftah, C., Retbi, A., Bennani, S., & Idrissi, M. K., 2019.). The famous common point among all MSGs is the learner's attachment to follow his course while having fun. This will avoid the learner's boredom and ensure that the course continues as much as possible.
Easy course will be developed using Unity3d, Unity 3D is a feature rich, and fully integrated development engine that provides out-of-the-box functionality for the creation of interactive 3D content. Using Unity, you can publish to multiple platforms such as PC, Web, IOS, Android and Xbox (Kim,  We will present you the origin of the idea of the creation and development of the pack in the section below.

The idea of creating the pack: Easy course
The idea of creating the Easy course family came after the need presented on article (Meftah, C., Retbi, A., Bennani, S., & Idrissi, M. K., 2018), where we detected that the need to pass educational information via MSG is the same for any course (computer science, mathematics, accounting, etc.). So, why repeat the same processing and the same computer development in loop when the way is the same, either to pass the pedagogical information, or to define the main actors (learner, teacher, course, etc.).
Thus, the use of Software Product Line (SPL) is essential to overcome this redundancy. And the Easy course package and these descendants (MSGs) will respect the production steps (domain analysis, domain implementation).
Let's understand the role of emotion detection in the following paragraph.

The role of emotion detection in a game
Customizing MSG to a learner's characteristics presents a fundamental need to attract attention and engage the learner. Through a personalized MSG, a learner can feel that this game belongs to him, that he takes control of the story (of the course implicitly) and that he is in a position to manage his environment. All information -emotions or other-is collected in a specific way, so that the learner feels free and unattended.
In this paper we will study the Hidden Markov Model (HMM), which uses an image (face recognition) as input, and output will be one of the following emotions: Joy, surprise, anger, hatred, fear or sadness

Emotional State Detection Model:
Hidden Markov models (HMMS) have become the method of choice for modeling stochastic processes and sequences in applications such as speech and handwriting recognition (Rabiner & Juang, 1986, Nag et al., 1985 and computational molecular biology (Krogh et al., 1993, Baldi et al., 1994. Hidden Markov models are also used for natural language modeling (see e.g. (Jelinek, 1985)). (Fine, S., Singer, Y., & Tishby, N., 1998) The HMM model allows you to make inferences about the emotional states as the emotions change, based on the vocal gestures or the facial expressions of the player.
After the acquisition of the data and the extraction of the essential characteristics, a set of training (training set) is given as input to the model, to train it.
In practice, the emotion detection system goes through the following steps: • Facial recognition: the machine captures one image per camera, and then the model detects the color of the person's skin, followed by the detection of the human face. Background is isolated to acquire the relevant section of the input image • Data normalization: eliminating noise and systematizing the face to balance brightness and pixel position.
• Result: The model intelligently processes standardized input data and produces one of the following emotions: Joy, surprise, anger, hatred, fear or sadness. The model consists of six main states, with an additional state: «bland» (without emotion), when there is no emotion on the face of a person. Each transition between the six emotions is forced to go through the "bland" state, assuming that the human face recapitulates a "bland" position before moving on to a new emotion.

Figure 2: HMM State Diagram
The International Archives of the Photogrammetry, Remote Sensing and Spatial Information Sciences, Volume XLIV-4/W3-2020, 2020 5th International Conference on Smart City Applications, 7-8 October 2020, Virtual Safranbolu, Turkey (online) Subsequently, we will detect together the role of personalities in this MSG family.

The role of personality detection in a game
The learner's personality is always in question, the more the game adapts to its own soundness, the more it remains attached and feels at ease with the game. A learner is always looking to have fun, to move around, to face challenges, to create networks of friends to vary the encounters and to broaden your field of action (Notion of clan) … The first step in the detection therefore consisted of listing the different characteristics likely to be deduced during the practice of the activity. This list is necessarily based on a modeling of the course and the game in order to implicitly demand the characteristics of the learner, hence the detection of his or her own soundness and, on the other hand, to identify the tasks corresponding to his or her educational level.
Details on examples of personalities are explained in the "Breakdown of the first scenario" axis.

From Easy course to Easy html
We have already explained what the Easy course pack consists of, and as its name suggests, the Easy html is an MSG that, through its levels, we could follow a full HTML course with a final level quiz and final evaluation to obtain a certification.
The game is simple, and the graphics are basic but attractive. The sole objective is to provide a functional example of vision and modeling.
With Easy html you can easily learn HTML: • You will know how to set up a standard skeleton in HTML5/CSS3.
• You will know how to use the tags.
• You will know how to place the tags in the right place.
• You will know how to integrate the elements into the tags.
• You will be able to validate your HTML code.
Following the development of this MSG, we will offer other courses that will build the Easy html package.

Other course proposals
MSG can represent and replace any educational course in any field. This can range from a course in computer science, mathematics, physics, management, marketing… to: In addition, it is enough to choose the right scenario, which must be attractive and attractive. The scenario will be invented, written and scripted. The mastery of the writing techniques will ensure the good quality of the game which implies the enhancement and the increase of chance that this game will be attractive to the learners.

SCENARIOS OF THE EASY HTML
Easy html is the MSG that we will make available to bachelor's students and university students in order to learn HTML, to familiarize them with its structure and to be able to use its markup system with ease.
To do this, it is essential to focus on the scenarios and develop the learner's attachment system as much as possible. On the other hand, the first scenario is very helpful for the learner. It is usually the first scenario (80%), the second scenario (10%), and the story of the scenarios (10%) that assume the responsibility for this attachment. We will present the importance of the first scenario on the next part.

Importance of the first scenario
The history of the game, the attractive text, the archetypal stories and others…, are all factors that support the attachment and follow-up of a learner. But also is the first scenario. Logically speaking, the first scenario is the picture of the whole game. Through this scenario, the learner takes a favorable or unfavorable idea of the game, hence the influence to continue learning or to abandon learning.
With the 1st scenario the learner discovers the background of the game; the learner must be in front of a simple scenario, which answers the following elements in 2 or 3 displays: • Therefore, the MSG will collect information about the learner, with the simple aim of adapting the following scenarios to his personality, emotions, skills, etc. and all its characteristics.
We will now see the distribution of the first scenario on 4 personalities; this means that the learner will have one of them as the dominant personality in the first scenario. The following scenario will be adapted to his personality and takes into account his preferences.

Distribution of the first scenario
Most of video games use the Bartle taxonomy of player types (by Richard Bartle), to classify the players' personality, it breaks up the way people play games into 4 categories: Achievers, Explorers, Socializers, and Killers (Fuß, C., Steuer, T., Noll, K., & Miede, A., 2014).

Personality 1: Achievers
Their goal is to accumulate points, status, loot, collect badges and any other concrete measurements of succeeding in a game, to show their friends how they are progressing. It's all about winning and being at the top of the "leaderboard". They tend to follow the games rules.
These players are motivated by competence and mastery. They seek to progress within a system by completing tasks or prove themselves by tackling difficult challenges (Lopez, C. E., & Tucker, C. S., 2019).

Personality 2: Explorers
Their goal is to discover the boundaries and creating unique maps of the game, they enjoy having unique knowledge of the game's ecosystem that no one has. They look for surprises and hidden features like Easter eggs (Easter egg is a hidden video game feature or surprise. Easter eggs are usually unlocked by using certain techniques to complete in-game tasks, entering specific button combinations or acquiring access to secret game or game file areas. ), they can spend hours searching secret items (unlock new levels, new areas, and loot to unlock ...) (www.techopedia.com).

Personality 3: Socializers
Their goal is to make new connections, collaborate in order to achieve things that they couldn't on their own, and they spend a lot of time chatting with their in-game friends.
Socializers are interested in people, and what they have to say. The game is merely a backdrop, a common ground where things happen to players. Inter-player relationships are important: empathizing with people, sympathizing, joking, entertaining, listening; even merely observing people play can be rewardingseeing them grow as individuals, maturing over time (Kim, B., 2015).

Personality 4: Killers
They enjoy creating chaos, their goal is similar to the achievers, winning, but they don't tend to follow the game rules, they are happy when they are winning and everyone else is losing.
Killer personality uses the virtual construct to cause distress on other players, and gain satisfaction from inflicting anxiety and pain on others (Xu, Y., 2011).
Killers try to dominate other players by "acting on the people" in the environment. This type of player is not interested in completing assignments well or scoring high points but instead aims to achieve scores that are sufficient to dominate and beat others. Killers explore the game to learn new ways to harm other players. They tend to communicate with others only to humiliate them (Kocadere, S. A., & Çağlar, Ş., 2018).
Let's now move on to the presentation of the game's real interfaces: Easy HTML.

Realization of the first scenario: ergonomics and attraction
According to our first vision of the game's ergonomics, we imagined the game's interfaces as follows:    We presented some first level catches with Unity. The steps are as follows: 1. Install and import the "Terrain Tool" into Unity: Window -> Package Man-ager -> Terrain Tool. 2. Create the terrain structure of the level using the Terrain Tools. 3. Add details to the terrain to give it more realistic look (add texture, rocks, grass, forest ...). 4. Find free assets to use in the Unity assets store or create your own. 5. Create objects (e.g.: the castle...) you need to use your assets 6. Arrange your object in the terrain After applying these steps, and towards the end of importing the required components, a C# coding phase will be highlighted to manipulate the avatar and automate its movement. This must respect the design and ensure the proper passage of educational information.

CONCLUSION
Modern thinking starts from the moment we think about improving our educational methods to encourage learners to improve their academic and academic curricula. Thus, the MSGs showed good results on the learners and encouraged them to learn intelligently and effectively. As a result, the production of the new MSGs will present a remarkable gain for learners, trainers, university managers and everyone who wants to take advantage of this solution to raise their educational and intellectual level. this study gives as result an MSG which treats and explains all the tags of the HMTL language and certifies the learner at the end of the course.
Our study will focus on ensuring the passage of the HTML course via MSG, this will conclude a passage of all the HTML tags by level, step by step, and obtaining the certificate of mastery of the language towards the end of the course. The certificate will contain the score obtained by following all the levels and may replace the mark of the learner's module.