Deliverable 3.2 FLIP2G Learning Environment

59
This project has been funded with the support of the Erasmus+ programme of the European Union © Copyright by the FLIP2G Consortium . Deliverable 3.2 FLIP2G Learning Environment Author(s): Lena Werthmann (Nurogames) Editor(s): Nurogames Responsible Organisation: Nurogames Version-Status: V1 Final Submission date: 07/07/2020 Dissemination level: PU

Transcript of Deliverable 3.2 FLIP2G Learning Environment

This project has been funded with the support of the Erasmus+ programme of the European Union © Copyright by the FLIP2G Consortium

.

Deliverable 3.2

FLIP2G Learning Environment

Author(s): Lena Werthmann (Nurogames)

Editor(s): Nurogames

Responsible Organisation: Nurogames

Version-Status: V1 Final

Submission date: 07/07/2020

Dissemination level: PU

D3.2 FLIP2G Learning Environment

Page 2 of 59

Deliverable factsheet Project Number: 601190-EPP-1-2018-1-DK-EPPKA2-KA

Project Acronym: FLIP2G

Project Title: Enhancing education and training through data-driven

adaptable games in flipped classrooms (FLIP2G)

Title of Deliverable: D3.2 – FLIP2G Learning Environment

Work package: WP3 – Course environment design and learning analytics

Due date according to contract: 30/06/2020

Editor(s): Nurogames

Contributor(s): All Partners

Reviewer(s): Roberto Lopez (Artelnics)

Approved by: All Partners

Abstract: This report documents the work done towards the FLIP2G

Learning Environment, as described in T3.2. It contains work

completed in M13 to M18, namely testing, development of the

software, bug removal, adaption in the user experience and in

arts, UI and aesthetics.

Keyword List: Serious Games, Gamification, Game based learning, Training and

Education

D3.2 FLIP2G Learning Environment

Page 3 of 59

Consortium Role Name Short Name Country

1. Coordinator, PBL Aalborg University AAU Denmark

2. Games developer Nurogames GmbH Nurogames Germany

3. PBL, academic partner University of Macedonia UOM Greece

4. Data analytics ARTIFICIAL INTELLIGENCE TECHNIQUES, SL Artelnics Spain

5. Academic partner Northumbria University Northumbria UK

6. Flipped classrooms EKPAIDEFTIRIA E. MANTOULIDI S.A. Mantoulides Greece

7. Secondary education Revheim skole, Stavanger Kommune Revheim Norway

D3.2 FLIP2G Learning Environment

Page 4 of 59

Revision History

Version Date Revised by Reason

V0.1 03/06/20 Lena Werthmann ToC

V0.2 09/06/20 Lena Werthmann Text body updates

V0.3 23/06/20 Lena Werthmann Text body updates

V0.4 30/06/20 Lena Werthmann Addition of partner suggestions

V1 07/07/20 Lena Werthmann Finalization

Statement of originality: This deliverable contains original unpublished work except where clearly indicated otherwise. Acknowledgement of previously published material and of the work of others has been made through appropriate citation, quotation or both.

Disclaimer This project has been funded with support from the European Commission. This deliverable reflects the views only of the author, and the Commission cannot be held responsible for any use which may be made of the information contained therein.

D3.2 FLIP2G Learning Environment

Page 5 of 59

Table of Contents

DELIVERABLE FACTSHEET ............................................................................................................. 2

CONSORTIUM .............................................................................................................................. 3

TABLE OF CONTENTS .................................................................................................................... 5

LIST OF ABBREVIATIONS ............................................................................................................... 7

LIST OF FIGURES ........................................................................................................................... 8

EXECUTIVE SUMMARY ............................................................................................................... 10

1 INTRODUCTION .................................................................................................................. 11

1.1 SUMMARY .......................................................................................................................................... 11 1.2 AUDIENCE .......................................................................................................................................... 11 1.3 STRUCTURE ......................................................................................................................................... 11

2 GAME DESIGN .................................................................................................................... 12

2.1 PREPARATION FOR GAME DESIGN ............................................................................................................ 12 2.1.1 Target Group Survey .................................................................................................................... 12 2.1.2 Timing and proposed usage of the Game..................................................................................... 13 2.1.3 Learning activities used by the partners ....................................................................................... 13 2.2.4 Benefits of Gamification .................................................................................................................. 14 2.2.5 Integration of the FLIP2G educational model ................................................................................... 15

2.2 GAMIFICATION REPORT ......................................................................................................................... 16 2.2.1 Content of the Report .................................................................................................................. 16

2.2.1.1 Target Group ............................................................................................................................................... 16 2.2.1.2 Narrative ..................................................................................................................................................... 17 2.2.1.3 Interfaces ..................................................................................................................................................... 17 2.2.1.4 Game Designs ............................................................................................................................................. 17

Number Quiz ............................................................................................................................................................. 18 Multiple Choice Quiz ................................................................................................................................................ 18 Multiple Response Quiz ............................................................................................................................................ 19 Reading Comprehension / Analysis .......................................................................................................................... 19 Algebra ....................................................................................................................................................................... 21 True/False Statements ............................................................................................................................................... 22 Crossword Puzzle ...................................................................................................................................................... 22 Other Content............................................................................................................................................................. 23

2.2.1.5 Audiovisuality............................................................................................................................................. 24 2.2.2 Decision of development priority ................................................................................................. 24

2.3 QUIZ GAME ........................................................................................................................................ 25 2.3.1 Core Game .............................................................................................................................. 26

2.3.1.1 Scoring ........................................................................................................................................................ 26 2.4 TEAMWORK GAME ............................................................................................................................... 26

3.2.1. Core Game .............................................................................................................................. 28 3.2.1.1 Scoring ................................................................................................................................................................ 28

D3.2 FLIP2G Learning Environment

Page 6 of 59

3 WEBTOOL FOR TEACHERS ................................................................................................... 29

3.1 UI / UX DESIGN .................................................................................................................................. 30 3.2 FUNCTIONALITIES ................................................................................................................................. 32

3.2.1 Dashboard ................................................................................................................................... 32 3.2.2 Courses Page ............................................................................................................................... 33 3.2.3 Quiz Page .................................................................................................................................... 34 3.2.4 Questions .................................................................................................................................... 35 3.2.5 Account Management ................................................................................................................. 36 3.2.6 Student Tags ............................................................................................................................... 37 3.2.7 Course Material ............................................................................................................................... 38

4 USE CASE: TUTORIAL ON COURSE CREATION ....................................................................... 39

4.1 CREATION OF STUDENT ACCOUNTS........................................................................................................... 39 4.2 CREATION OF QUIZ TEMPLATES ............................................................................................................... 40

4.2.1 Create Questions ......................................................................................................................... 40 4.2.2 Upload Course Material ............................................................................................................... 42 4.2.3 Create Quiz Template .................................................................................................................. 42

4.3 CREATION OF A COURSE ......................................................................................................................... 43 4.3.1 Add Students ............................................................................................................................... 44 4.3.2 Add Sessions ................................................................................................................................ 45 4.3.3 Add Quizzes ..................................................................................................................................... 46

4.4 PLAYING THROUGH THE GAME ................................................................................................................. 47 4.4.1 Play though Quiz Game ................................................................................................................... 48

Read Course Material ..................................................................................................................................................... 49 Finishing the Quiz .......................................................................................................................................................... 50

4.4.2 Play through Teamwork Game ........................................................................................................ 50

5 FULFILMENT OF REQUIREMENTS ......................................................................................... 53

5.1 TEACHER REQUIREMENTS ....................................................................................................................... 53 5.2 STUDENT REQUIREMENTS ...................................................................................................................... 55 5.3 TECHNICAL REQUIREMENTS .................................................................................................................... 55

6 TECHNICAL BACKGROUND AND HARDWARE REQUIREMENTS .............................................. 57

6.1 TECHNICAL SPECIFICATIONS OF THE GAME .................................................................................................. 57 6.2 TECHNICAL SPECIFICATIONS OF THE TEACHER TOOL ....................................................................................... 57 6.3 BACKEND ........................................................................................................................................... 57

7 CONCLUSION ...................................................................................................................... 59

D3.2 FLIP2G Learning Environment

Page 7 of 59

List of Abbreviations

The following table presents the acronyms used in the deliverable in alphabetical order.

Abbreviation Description

UI User Interface

UX User Experience

Pc Personal Computer

FC Flipped Classroom

LA Learning Analytics

PBL Problem-based learning

VLE Virtual Learning Environment

LMS Learning Management System

D3.2 FLIP2G Learning Environment

Page 8 of 59

List of Figures

FIGURE 1 - INITIAL STUDENT INTERFACE DESIGN .............................................................................................. 17 FIGURE 2 - INITIAL DESIGN FOR THE NUMBER QUIZ............................................................................................ 18 FIGURE 3 - INITIAL DESIGN FOR THE MULTIPLE CHOICE QUIZ ............................................................................ 18 FIGURE 4 - INITIAL DESIGN FOR THE MULTIPLE RESPONSE QUIZ ........................................................................ 19 FIGURE 5 - TIMELINE FOR THE READING ANALYSIS GAME .................................................................................. 20 FIGURE 6 - GAMEPLAY LOOP FOR TRUE/FALSE GAME........................................................................................ 22 FIGURE 7 - THE FIRST VISUAL DESIGN FOR THE GAME ......................................................................................... 24 FIGURE 8 - SCREENSHOT OF STUDENT QUIZ ....................................................................................................... 25 FIGURE 9 - VIEW OF PLAYER 1 SCREEN IN THE MULTIPLAYER GAME .................................................................. 27 FIGURE 10 - VIEW OF PLAYER 2 SCREEN IN THE MULTIPLAYER GAME ................................................................. 27 FIGURE 11 - DATA MODEL FOR FLIP2G ............................................................................................................. 29 FIGURE 12 - WIREFRAMES FOR TEACHER TOOL .................................................................................................. 31 FIGURE 13 - DASHBOARD IN THE TEACHER TOOL ............................................................................................... 32 FIGURE 14 - FLIP2G TEACHER INTERFACE - COURSE MENU ............................................................................... 33 FIGURE 15 - EDIT A COURSE IN THE TEACHER TOOL ........................................................................................... 34 FIGURE 16 - QUIZ PAGE IN THE TEACHER TOOL .................................................................................................. 34 FIGURE 17 - ADD NEW QUESTIONS TO THE QUIZ ................................................................................................. 35 FIGURE 18 - QUESTION DATABASE .................................................................................................................... 35 FIGURE 19 - TEACHER ACCOUNT ....................................................................................................................... 36 FIGURE 20 - STUDENT ACCOUNTS...................................................................................................................... 36 FIGURE 21 - STUDENT TAGS .............................................................................................................................. 37 FIGURE 22 - COURSE MATERIAL UPLOAD ........................................................................................................... 38 FIGURE 23 - STUDENT FORM.............................................................................................................................. 39 FIGURE 24 - FILLED OUT STUDENT FORM ........................................................................................................... 39 FIGURE 25 - ADD STUDENT FORM ...................................................................................................................... 39 FIGURE 26 - FILLED OUT FORM .......................................................................................................................... 40 FIGURE 27 - LIST OF GRADE7_2020 ................................................................................................................... 40 FIGURE 28 - FORM TO CREATE NEW QUESTIONS ................................................................................................. 41 FIGURE 29 - THE NEWLY CREATED QUESTIONS ................................................................................................... 41 FIGURE 30 - MATERIAL FORM ........................................................................................................................... 42 FIGURE 31 - FILLED OUT COURSE MATERIAL FORM ........................................................................................... 42 FIGURE 32 - ADD NEW QUIZ FORM .................................................................................................................... 42 FIGURE 33 - EDIT QUIZ VIEW ............................................................................................................................. 43 FIGURE 34 - NEWLY ADDED QUESTIONS TO THE QUIZ ........................................................................................ 43 FIGURE 35 - ADD A COURSE ............................................................................................................................... 43 FIGURE 36 - EDIT COURSE PAGE ......................................................................................................................... 44 FIGURE 37 - STUDENTS ADDED TO COURSE ....................................................................................................... 44 FIGURE 38 - ADDITIONAL TAGS ......................................................................................................................... 45 FIGURE 39 - NEWLY CREATED SESSIONS ............................................................................................................ 46 FIGURE 40 - QUIZ SELECTION IN SESSION .......................................................................................................... 46 FIGURE 41 - LANDING PAGE (WIP) .................................................................................................................... 47 FIGURE 42 - MENU SCREEN................................................................................................................................ 48 FIGURE 43 - CURRENT LOOK OF THE GAME (WIP) .............................................................................................. 48 FIGURE 44 - COURSE MATERIAL (MOCK UP) ..................................................................................................... 49

D3.2 FLIP2G Learning Environment

Page 9 of 59

FIGURE 45 - LOSING SCREEN ............................................................................................................................. 50 FIGURE 46 - GAME FORM IN THE COURSE SCREEN WITH MULTIPLAYER ENABLED ............................................... 50 FIGURE 47 - MULTIPLAYER QUESTION SCREEN (WIP) ....................................................................................... 51 FIGURE 48 - MULTIPLAYER ANSWER SCREEN (WIP) .......................................................................................... 51 FIGURE 49 - DATA MODEL OF FLIP2G BACKEND ............................................................................................... 58

D3.2 FLIP2G Learning Environment

Page 10 of 59

Executive Summary

This report displays the work done towards the completion of T3.3 and documents the current state

of the prototype, which is part of this deliverable.

The prototype contains a teacher tool from where teachers can manage their games and students,

additionally, a game prototype with two games was developed. The first game is an iteration of a

Multiple Choice Quiz as a single player mode, in contrast, the second game contains multiplayer

functionalities to work along with the Flip2G model developed in this project.

Additionally, this report shows the work done towards the design, art, UI/UX development and

iteration of the game design, which has greatly evolved over the course of the task.

D3.2 FLIP2G Learning Environment

Page 11 of 59

1 Introduction

1.1 Summary

This report presents the FLIP2G Learning environment and the main activities done were towards its

design and implementation, namely:

● The finalization of the game platform design via a game design document and adapting it

based on the partner feedback, which was mainly gathered through multiple surveys

● The design and creation of the art and UI assets

● The development of a web application tool for teachers to create and manage games and

students

● The development of a quiz game for student assessment and training

● The development of a second game with quiz and group work elements

1.2 Audience

The intended audience for this report is the Flip2G Consortium, the European Commission and the

general public interested in serious educational games and learning theories.

1.3 Structure

The structure of the document is as follows:

▪ Section 2 contains the Game Design and related preparations as well as research

▪ Section 3 contains the documentation of the teacher tool webpage development

▪ Section 4 contains a use case and a tutorial

▪ Section 5 contains the documentation and analysis of the requirements

▪ Section 6 contains the technical background of the software

▪ Section 7 contains the conclusion

D3.2 FLIP2G Learning Environment

Page 12 of 59

2 Game Design

The game design was the preliminary step on which the design of the teacher tool and any other

content (e.g. the backend) is based. Therefore, the initial goal was to create a game design based on

the research on serious games and gamification, the developed user requirements and further data

that will be discussed in the following chapters.

2.1 Preparation for Game Design

Additionally to the user requirements defined in D1.2, surveys were created and filled out by the

educational partners as a part of the preparation for the development of the game.

2.1.1 Target Group Survey

A target group survey was created and filled out by the educational partners. Based on this survey,

multiple tables were created:

Partner Subjects Taught Age Class Size Academical BG

NU Digital Business 18-25 10 to 50 Business Students

Linear Programming

Mathematics

UOM Project Mgmt 18-30 20-60 Applied Informatics

Open Data

E-Government

AAU OOP with Java 18-25 60-70 Undergratudates (CS)

Android Programming

Revheim Social Sciences 12 to 16 20-30 High Schoolers

English

Mandoulides Mathematics 9 to 15 20-30 Middle Schoolers

Physics

History

Geography

Informatics

D3.2 FLIP2G Learning Environment

Page 13 of 59

This survey already showed a great diversity in the students that would eventually use the game. This

can turn out to be an issue in development, as, for example, 9-year olds require different teaching

methods and gamification measurements than 30-year-old students. Additionally, the diversity of

subjects taught meant that the game would be shifted more towards a gamification platform and less

a fully developed game with a certain scenario.

The different class sizes were also acknowledged, however, this only had minor influences on the

game design (e.g. the deliberate avoidance of sound as a game mechanic).

2.1.2 Timing and proposed usage of the Game

The same survey also included questions on the timing and amount of lessons for each partner. The

answers are collected in the following table:

Partner Session Length (h) Sessions Total hours

NU 3 6 18

UOM 1 - 2 13 19,5

AAU 1 10 10

Revheim 1 40 40

Mandoulides 1 - 2 40 60

Average 1,6 21,8 29,5

Again, a huge diversity can be seen between the different partners. This means that for the game

design, an overarching scenario needs to be relatively flat, as, storytelling wise, a story that is engaging

for 10 hours might not be interesting enough for 60, while a story designed for 60 hours cannot be

delivered in 10.

2.1.3 Learning activities used by the partners

It was also asked which learning activities were already employed by partners in their lessons to find

out how to seamlessly tie in the game platform to the existing activities. The following activities are

regularly used by one or multiple partners:

• Group Discussions

• Reading Assignments

• Internet Research

D3.2 FLIP2G Learning Environment

Page 14 of 59

• Quizzes (Multiple Choice; True False; Open)

• Programming Exercises

• Q&A Rounds

• Powerpoint presentations

• Demonstrations

• Frontal Teaching

• Videos

• Class Discussions

• Riddles

• D&D

• Online / Browser Games

While some of those activities could be easily transferred to digital means, others (like class

discussions) do not benefit much from a digitization. Still others are already using digital means

(Powerpoint slides, internet research, programming exercises) and it does not make sense to recreate

or redesign already working learn-flows.

However, some of the activities mentioned are already gamified. Especially the quizzes are a recurring

topic. Due to the dynamic nature of a quiz with user-created content, they were a main factor while

creating the game designs.

2.2.4 Benefits of Gamification

Additionally, partners were asked what the benefits were that the game should provide additionally

to the already defined user requirements as opposed to traditional learning activities mentioned in

the former chapter. Answers to that were:

• Higher Engagement Rate

• Integration of assignments and gamification

• Better understanding of the content/material

• Higher motivation

Furthermore, our previous analysis into gamification (cf. D2.1) showed that gamification was a useful

tool to support self-directed learning in the FC.

D3.2 FLIP2G Learning Environment

Page 15 of 59

The use of badges, progress bars and levels allowed students to track their progression and visualize

their learning goals.

2.2.5 Integration of the FLIP2G educational model

The discussions with the partners also aimed at building the game design in such a way that it would

support the FLIP2G FC model. This model was developed in D2.2 and uses a circular model to approach

the FC model as a cyclic process. This process comprises four steps:

- Concept exploration (understand)

- Meaning making (remember)

- Demonstration and application (analyze)

- Experiential engagement (apply)

The game design therefore had to take into consideration the specific requirements of the FLIP2G

model. The following elements in particular were discussed:

- The game and content material should be accessible and playable both in the pre-class

phase and in-class phases.

- Students in the pre-class phase should be able to access the learning material, track their

progression, and take some practice game quizzes. This also aligns with the problem

formulation and problem analysis phases of the Aalborg PBL model.

- The in-class game should allow for engagement in playful learning to consolidate the

learning experience of the previous phase. The games in the in-class time should also allow

for a collective gaming experience. This aligns with the problem-solving phase of the Aalborg

PBL model.

- The platform and gamified progress mode should be engaging to encourage students to

continue exploration of the learning process post-class, aligning with the reflection phase of

the Aalborg PBL model.

The final elements of the FLIP2G model was the articulation of the FC cycle and LA process.

The FLIP2G model establishes three levels for the integration of LA. The first level regards the learning

activities design, which remains in the end of the teachers: It was therefore discussed that the gaming

platform interface for the educators should be intuitive and followed the text-based plug-in approach

The first two steps correspond to the pre-class activities The third step correspond to in-class activities The last step correspond to post-class activities and/or the beginning of a new cycle

D3.2 FLIP2G Learning Environment

Page 16 of 59

popularized by VLEs such as Moodle. The second and third level comprise data generation and data

analysis: The data is generated through engagement of the students in the game, and then processed

through the Learning Analytics system developed by Artelnics.

Therefore, even if the focus remained on gamification, our approach took into consideration a more

complex approach to the FC than a standard VLE gamification system. Our approach aims at

supporting students through a FC learning process every step of the way and adds to the gamified

activities a LA components that can allow them a finer observation of their learning process and better

opportunities for Self-Directed Learning.

2.2 Gamification Report

Initially, to apply the findings made in D1.1 and D1.2 as well as the preparations documented in Ch2.1,

a game design document was created. This document served as a basis for all future developments

and strategy.

It was decided to write a report containing multiple game ideas, which would then be proposed to the

partners. The reasoning for that was that one game would not cover the whole target group as well

as the different teaching structures used by the partners.

2.2.1 Content of the Report

The following chapters will reflect the content of the report. Some of the contents designed in the

report were not implemented in the final prototype, but serve as an inspiration and outlook to a future

state of the project.

2.2.1.1 Target Group

Based on the surveys created, the target groups were defined as:

• Teachers

Teachers in the testing phase have a background in digitization and are accustomed to use

LMS.

• Middle and high school students aged 9 to 16

• Undergraduate and graduate students aged 18 to 30

D3.2 FLIP2G Learning Environment

Page 17 of 59

2.2.1.2 Narrative

The storytelling of the games will feature around an agent/spy cyber aesthetic of 90s cartoons and

Hollywood movies. The narrative itself will be very loose due to the modular nature of the game.

The players are government agents who need to break into the supervillain’s lair. While each agent

works on his own, for some tasks they need to cooperate to continue, while on other tasks they need

to work against each other. Ultimately, they all need to work together to defeat the supervillain.

In each game, they meet multiple foes, tasks and quests, which have to finish in order to continue.

2.2.1.3 Interfaces

This part of the report featured the initial designs of some of the initial student and teacher interface

designs. As the functions of the platform were not clear at this point, the aim of the designs was to

establish a visual language:

Figure 1 - Initial Student Interface Design

The attempt was to create a playful style that would still resonate to the older target audiences.

2.2.1.4 Game Designs

Initially, seven different game designs were created.

Those games were:

D3.2 FLIP2G Learning Environment

Page 18 of 59

Number Quiz

The Number Quiz is a quiz designed to

work well with any type of numbers or

percentages, e.g. historical dates,

mathematical numbers, logical chains

and more.

This quiz also features the possibility to

use estimates or guesses by students and

give points regarding to how close they

are to the correct number or percentage.

The controls for this game are limited to typing in the estimate or guess with the keyboard and clicking

with a mouse (or pressing enter) to send. The player will then get immediate feedback about how

correct his answer is.

The teacher needs to prepare questions and quizzes. Especially creating the questions might take

some more time, as he needs to give one (or multiple) correct answers, but also an answer range that

is acceptable, where students get less points depending on how close they are to the correct answer.

In cases guesses/estimates are not

wanted, the answer range that the

teacher needs to enter is 0.

Multiple Choice Quiz

The Multiple Choice Quiz is based on

standard assessment quizzes, with an

attempt to make it more interesting

through adding an enemy who asks those

questions.

The player encounters a boss making an

incorrect statement or asking a question.

Figure 2 - Initial design for the Number Quiz

Figure 3 - Initial Design for the Multiple Choice Quiz

D3.2 FLIP2G Learning Environment

Page 19 of 59

He/she then needs to give the correct answer to that which drains the Boss’ HP if he/she selected the

right one. If the player selected the correct question, the player character will attack the Boss.

The controls for the game are very simplistic; the player can just click on the correct answer.

Preparation for this game for the teacher is also only a moderate amount of work. He needs to create

and enter questions and put them together for a quiz. The core idea here is that the work for the

teacher will be lower the more questions and quizzes he or she has created in the past.

Multiple Response Quiz

The Multiple Response Quiz has a core mechanic very similar to the multiple choice quiz - however,

its design is very different.

The player plays an armed vehicle on the

right side of the screen and can move with

the arrow buttons or the WASD buttons

on the keyboard. He can also shoot in a

specific direction by clicking on the screen

somewhere.

On the screen, there are enemies, which

come from the right side and try to touch

the player. Each enemy makes a statement that is either correct or incorrect, and the player attempts

to shoot all incorrect statements.

If an enemy with a correct statement touches the vehicle, the player will gain some score. If an enemy

with an incorrect statement touches the vehicle, it will explode and drain the score of the player.

The teacher needs to prepare correct and wrong statements for this game, similar as the preparation

for the multiple-choice game.

Reading Comprehension / Analysis

The Reading Comprehension game was added to provide the students a possibility to interact with

content from the course.

Figure 4 - Initial Design for the Multiple Response Quiz

D3.2 FLIP2G Learning Environment

Page 20 of 59

Players read course material provided by the teacher. They then have two tasks, both limited by a

timer:

1) The player needs to make up one multiple choice question and four answers – three

incorrect, one correct answer – based on the provided material

2) If there is time left, she/he needs to summarize the text in a certain amount of characters

After the timer runs out or all students have fulfilled this task, each student gets two random questions

written by other students, which they need to answer. Instead, he/she can also opt to report the

question if it is not related to the course material or the correct answer is wrong.

After a player has finished answering the questions, it is possible for him/her to vote for summaries.

For that, two summaries will be displayed on his/her screen and the player gets the option to select

the better one by clicking. If other players are still answering questions or the timer is still running,

two more summaries will be provided. This part is repeated, until there are no more summaries left

to compare or the timer runs out. The student with the most votings in the summary will gain extra

score.

This is how a timeline from the student’s perspective can look like:

Figure 5 - Timeline for the Reading Analysis game

The teacher needs to prepare multiple things for this game:

• Timer for question creation

• Timer to answer questions

D3.2 FLIP2G Learning Environment

Page 21 of 59

• Course Material

Additionally, during class, the teacher needs to review any reported questions. He can either decide

to take a question out and/or give a score penalty to the reporting or reported player.

Algebra

The design of the Algebra game is inspired popular indie game titles like Bomb Corp. or Keep talking

and nobody explodes.

The core idea is that students are randomly matched in a class to solve a mathematical or logical

puzzle.

Each player gets, for example, an unsolved formula as well as one piece of information about it

displayed on his or her device.

Multiple players get the same formula and need to form a group. Together, they will have enough

information on their devices to solve the formula.

One of the players has the option to type in the answer. When he enters it, the other players need to

confirm that in order to finish the game.

The preparation for this game is quite complex. The teacher needs to create the completed formulas

and the game algorithm will then replace certain numbers with placeholder letters, depending on the

amount of students that are in one group.

As the algebra game did not receive encouraging feedback by the partners, it was not further

designed.

D3.2 FLIP2G Learning Environment

Page 22 of 59

True/False Statements

This is a quiz that allows the player to choose whether a

statement is true or false.

Each player gets a statement that can either be true or

wrong. Additionally, he gets a randomly generated three-

letter code.

Another student gets a similar statement, whereas both

statements have to exclude each other. Therefore, one of

those statements is true and the other one is false.

The pairs need to physically find each other based on their

prompts. They need to discuss and can, for example, select

a presenter who organizes the class (In courses with

younger students this task can be done by the teacher).

When a pair found each other, they need to enter a code displayed on the other player’s device to

confirm that they are partners.

Together, they need to decide which of the statements is true and which one is false. If both of them

enter the same answer, they will get an improved score.

Crossword Puzzle

After the initial version of the game design document was sent to review for the partners, the

suggestion to integrate a crossword puzzle came up.

The student gets a screen displayed containing an empty crossword grid and the accompanying clues.

She/he needs to fill out the grid as fast as possible.

Whenever the hard timer runs out, the game ends.

When the student fills out the crossword completely before the hard timer runs out, he gets a pop up

and can decide whether to continue or to finish. If he finishes before the bonus timer runs out, he is

awarded with extra points depending on how much time is left.

Figure 6 - Gameplay Loop for True/False

Game

D3.2 FLIP2G Learning Environment

Page 23 of 59

The teacher needs to prepare all words and hints. The game will then be dynamically generated based

on how it fits.

Other Content

Additional content was covered in the game design document, some of which were added to the

current prototype:

• Boss Fight

A boss fight is intended as a final, collaborative game for all students in the end of the

course. It would feature the same game mechanics as previously described, but updated

visuals and a higher output in points, to give students a higher motivation to attend the final

class.

• Leaderboard

A leaderboard was heavily discussed among the partners, as the disadvantage of having one

would be a loss of anonymity and the publication of students that do not fare very well or

are failing. Therefore, it was decided to not have a public leaderboard in the prototype –

However, the designs and ideas can still be found in the game report

• Minigames

Minigames were an early idea to support students who might need some help, while still

giving them a small disadvantage. They can be played at some points in most proposed

games and take 5 seconds each (They could therefore also, correctly, be described as

“Microgames”). Upon success, the player gets a small hint or other help. Sometimes,

minigames can also be used as a punishment in game.

• Course Material

The course material is an option for the teacher to actually teach content through the game.

Course material is heavily tied to the games and teacher can upload it for students to review

it before starting the game (or before certain parts of the game).

D3.2 FLIP2G Learning Environment

Page 24 of 59

2.2.1.5 Audiovisuality

Figure 7 - The first visual design for the game

The game is developed in 2D. It will feature a simplified cartoon style reminiscent of 90s cartoons and

hint at film noir crime stories.

Each game might feature a slightly distinct style, but overall a coherent image should be formed.

To avoid a sound overload, there is no sound.

Player devices will feature visual and, if possible, haptic feedback.

2.2.2 Decision of development priority

Afterwards, the partners were asked to review the report and rate each game by whether it would be

used in class during the testing period. This was the outcome of the ratings:

Game AAU NU UOM Revheim Mantoulides Total

Number / Percentage Quiz

1 1

2

True/ False Statements 1

1

1 3

D3.2 FLIP2G Learning Environment

Page 25 of 59

Algebra 1

1

Multiple Choice Quiz 1 1 1

1 4

Multiple Response Quiz

1 1 1 1 4

Reading Comprehension /

Analysis 1 1

2

Comprehension Bomb 1 1

2

It was decided to create the Multiple Choice Quiz first as it would be easier to develop than the (tied)

Multiple Response Quiz. As it was decided between Artelnics and Nurogames that the backend would

be created by Nurogames, less resources could be used for the development of multiple games. It was

therefore decided to create the Multiple Choice Quiz as well as a newly designed multiplayer game

(not in the gamification report) which could use similar backend data structures as the Multiple Choice

Quiz.

2.3 Quiz Game

Figure 8 - Screenshot of Student Quiz

D3.2 FLIP2G Learning Environment

Page 26 of 59

The quiz game is one of the two games that the student can play. It features a simple multiple-choice

game designed to fit into the Flip2G model and is heavily based on the Multiple Choice Quiz presented

in a former chapter.

Whenever the teacher activates a session, the accompanying game will be activated as well. Students

can then choose it from a list of all active sessions they are added to and play it through.

2.3.1 Core Game

Students encounter a boss enemy with their character on screen. Their goal is to defeat the boss

enemy, who spreads wrong statements, by correcting him and choosing the right answer from a

selection of options.

When the player is correct, the player character will attack the boss and drain his HP.

2.3.1.1 Scoring

Task Points Total Points

Answering right 2500 / Amount questions 2500

All questions on first try

(Bonus)

1000 1000

Boss defeat 1500 1500

Max Points 5000

2.4 Teamwork Game

This is a game working very similar to the Quiz game, but over multiple devices where one or more

devices display the questions in random order and the answers are displayed on a different device. It

is also based on the Multiple Choice Game designed in the Game Design document. The reason for

that is that the similarity of the single player and multiplayer game in the backend lowers the resources

needed for development. Course material can also be used in this game.

On both devices, a different student user should be logged in. This game ensures teamwork and

promotes discussion among the students to work within the Flip2G framework.

D3.2 FLIP2G Learning Environment

Page 27 of 59

Figure 9 - View of player 1 screen in the Multiplayer Game

Figure 10 - View of player 2 screen in the Multiplayer game

D3.2 FLIP2G Learning Environment

Page 28 of 59

3.2.1. Core Game

Players will randomly be teamed up through the game if the teacher starts this game and they selected

it in their menu. Teams will usually be in groups of two, however, due to some factors (e.g., an uneven

number of players; Or players that joined later in the session) one team might consist of more players.

On the device of student A, a batch of answers to a random question is displayed.

On the device of student B, all questions can be clicked through in the order intended by the teacher.

Initially, while only one answer batch can be seen on device A, all questions can be seen on device B -

The students then, in teamwork, need to find out which question belongs to the displayed answer

batch. For this, they will get some visual cues on screen.

If they selected the right answer, both students will get points according to this, and if a wrong answer

is selected, no points are given.

Afterwards, the next batch of answers is displayed on device A. This is repeated until all questions are

answered.

3.2.1.1 Scoring

Task Points Total Points

Answering right 5000 / Amount of questions 5000

Max Points 5000

D3.2 FLIP2G Learning Environment

Page 29 of 59

3 Webtool for teachers

Teachers are able to access the teacher tool through their own devices. They can use it to manage

courses, classes, games, students and specific sessions.

The initial data structure of the webtool looked as following, and only minor iterations (mostly based

on design choices) were done during the development phase:

Figure 11 - Data Model for Flip2G

The teacher can create and manage courses and add students to this course. In a course, he/she can

set sessions. Each session displays either a class or a timeframe in between classes, which can be used

for homework.

D3.2 FLIP2G Learning Environment

Page 30 of 59

In a session, the teacher can add multiple games. He/she can then start a session on the proposed

date and deactivate it when she/he is finished with class (or, for example, the submission period for

the homework is over).

Each game is based on a game template, priorly designed by the teacher. Game templates contain

questions and other content as well as variables, for example a timer. Game templates can be

repurposed and copied to ensure optimal utilization.

3.1 UI / UX Design

The design of the teacher tool is heavily based on programs that the teachers are used to, like a

learning management system or Microsoft office. It also incorporates the Flip2G branding and logo.

Initially, wireframes were created to include all functions in a user-friendly layout. The wireframes

were optimized to work on a computer (as opposed to a mobile device), which was later adapted into

the UI design. The reason for that is that the amount of data displayed on screen would greatly suffer

under mobile optimization, as mobile screens are too small for this purpose and to display the data

needed by the patient.

The initial wireframes looked like this:

D3.2 FLIP2G Learning Environment

Page 31 of 59

Figure 12 - Wireframes for teacher tool

D3.2 FLIP2G Learning Environment

Page 32 of 59

Based on these wireframes and Flip2G branding, the designs that can be seen in the following

chapters were created.

3.2 Functionalities

3.2.1 Dashboard

Figure 13 - Dashboard in the teacher tool

The dashboard is the home page displayed to the teacher whenever he/she opens the web app. It

contains current data, and any feature of the website is easily reachable from here.

The top row in the dashboard is called “News”. News contain all classes which have sessions coming

up soon. It gives the teacher the option to start the session with one click, or edit it for future purposes.

Below that, there is a row with tags that might interest the teacher. They can be clicked to reach the

respective tag menu. Tags can be used for multiple purposes and will be explained in a following

chapter.

D3.2 FLIP2G Learning Environment

Page 33 of 59

3.2.2 Courses Page

Figure 14 - Flip2G Teacher Interface - Course Menu

The Course menu is directly reachable from the menu bar on the left or through the dashboard in the

News section.

Here, the teacher can see all courses, which he/she currently leads and create new ones. She/he also

sees the number of students, which student tags she/he assigned to the courses and future as well as

past sessions.

He can edit the courses to add more students, sessions or change the name of the course:

D3.2 FLIP2G Learning Environment

Page 34 of 59

Figure 15 - Edit a Course in the teacher tool

It is possible to add students either by a tag, by their id or by their name.

3.2.3 Quiz Page

Figure 16 - Quiz Page in the teacher tool

D3.2 FLIP2G Learning Environment

Page 35 of 59

The Quiz page displays all available quizzes, as well as the option to create a new quiz. Templates are

global, which means that all teachers can use all templates.

When the teacher opts to edit a quiz, he/she will reach the next page:

Figure 17 - Add new Questions to the quiz

Here, he/she can add existing questions, previously uploaded training materials and a title for the quiz.

3.2.4 Questions

Questions, which can be added to quiz templates as described in Ch. 2.1.3, can be entered into the

database over the question page.

Figure 18 - Question Database

D3.2 FLIP2G Learning Environment

Page 36 of 59

3.2.5 Account Management

The teacher can manage his own account under the account tab:

Figure 19 - Teacher Account

He/she can also create new student accounts and change the password or other student data - As

currently there is no password recovery function implemented, this will be the main way to change

the password if the student forgot it.

Figure 20 - Student Accounts

D3.2 FLIP2G Learning Environment

Page 37 of 59

3.2.6 Student Tags

Figure 21 - Student Tags

Student tags can be managed over the Tag tab. Here, the teacher can visualize all existing tags and see

which students are attached to tags.

Student Tags in general can be created by the teachers. They were chosen as the test groups are both

school classes as well as university courses, so a dynamic system needed to be created.

D3.2 FLIP2G Learning Environment

Page 38 of 59

3.2.7 Course Material

Figure 22 - Course Material upload

An additional page where the upload of course material is possible exists. Any file formats are

supported as long as the student device has a program to open it.

Course material can replace questions in the single player game and can be linked at any part in the

games. They can also be used individually, which means a student can access them from outside the

game to study, and, for example, print them.

D3.2 FLIP2G Learning Environment

Page 39 of 59

4 Use Case: Tutorial on Course Creation

To have the students play a game, teachers initially need to create a course. The whole process from

course creation to integration of the games will be discussed in this chapter.

4.1 Creation of Student Accounts

Firstly, a teacher needs to create students, which he/she can later add to sessions. If the student

accounts were already created by another teacher, this step can be left out (Or, in some cases,

additional tags need to be added).

To create a new student user, the teacher needs to access the Students

tab on the left side of the screen. In the new window, the option to add

a student is found in the top row.

The teacher then needs to add the Mail, the first (and, optionally, middle)

name of the student and his last name.

Additionally, he/she can add tags to a student. Those tags are

automatically created when written into the form and can serve different

purposes. For our purpose, the student Alex Kim Flip will be created.

Alex is a middle school student visiting 7th grade. Alex is also volunteering

for a few sports activities and afternoon courses, which is reflected in his

tags. Those can later be used to easily add him to activities.

Alex types a password n by him/herself. As this is not always possible,

the teacher can also set a password, e.g. the ID of the student.

Afterwards, the teacher clicks on Submit.

The filled out and sent form can be seen in Fig.17. The teacher can

change any data of the student. However, this is unadvisable without the

student knowledge. Especially the e-mail and the password are used for

the log in of the student, which means that any change (without notifying

the student) will lead to the student not being able to log in.

Figure 25 - Add student form

Figure 23 - Student Form

Figure 24 - Filled out student

form

D3.2 FLIP2G Learning Environment

Page 40 of 59

Creating a student is repeated until all pupils of class 7 are created.

This can be reviewed by accessing the Student Tags tab and then searching for the tag grade7_2020

either through the search bar or by simply scrolling through the alphabetically sorted list:

Figure 27 - List of grade7_2020

4.2 Creation of Quiz Templates

A core element of courses are quizzes. Therefore, before creating a course, quiz templates need to be

created. Elements in the quizzes can be course materials and questions – Therefore, before a quiz is

created, those elements need to be uploaded.

4.2.1 Create Questions

To create questions, the teacher needs to access the Questions tab. Here she/he can see a list of all

tagged existing questions (including questions created by other teachers) and the form to create new

questions:

Figure 26 - Filled out form

D3.2 FLIP2G Learning Environment

Page 41 of 59

Figure 28 - Form to create new questions

For the Use Case, we are going to add a few questions regarding 7th grade history content. Each

question can have up to eight answers, of which one or multiple can be selected as correct.

Additionally, each question is going to be marked with the tag history_quiz_grade7 so it is easy to find

and sort later. Since all questions relate to the discovery of America and they might be reused by other

teachers, the tags American History and History are also added. We then can look at the existing

questions by searching for the history_quiz_grade7 Tag:

Figure 29 - The newly created questions

So far, this is satisfying, so the next step is to upload the according course material.

D3.2 FLIP2G Learning Environment

Page 42 of 59

4.2.2 Upload Course Material

To upload course material, the Materials tab needs to be accessed.

There, a list of the existing materials can be seen. The materials can

also be displayed by clicking on the Show button.

Course materials use the tags with which questions can be accessed.

Therefore, for the history quiz, we are going to add two materials:

One image of Columbus and one .pdf file with content regarding the

discovery of America. We are going to tag them with the same tags

as the questions, but will add the tags Image for the picture. After

filling out the form, it looks like Fig. 22:

Figure 31 - Filled out Course Material Form

Since now the questions and course material exists, the next step is to create the actual quiz template.

4.2.3 Create Quiz Template

To create a Quiz template, the Quizzes tab needs to be accessed.

Here, available quizzes can be seen, and new quizzes can be created

via the “Add new Quiz” form, which is visualized in Fig. 23.

After creating a quiz and clicking on the editing icon, the user will be

led to another page where he/she can edit the newly created quiz.

Figure 30 - Material Form

Figure 32 - Add new Quiz Form

D3.2 FLIP2G Learning Environment

Page 43 of 59

Initially, the edit page will be empty. When clicking on the arrow in the type bar, one of the three

options Tag, Question and Course Material can be selected. As we saved all the content we need under

the tag history_quiz_grade7, we should select tag as type:

Figure 33 - Edit Quiz view

Afterwards, the desired tag can be selected and, by clicking on the + sign on the right side, added to

the existing questions. Afterwards, the screen looks like this:

Figure 34 - Newly added Questions to the Quiz

Additional questions and course materials can be added. When clicking on the link, the teacher will

reach the desired content directly.

4.3 Creation of a Course

The next step is to create a course. For the use case, we will create the course

History for the 7th grade pupils.

For that, we first need to access the Courses tab and enter a name for the

course. Then, the button Add Course needs to be clicked and the new, empty

course is created.

This new course can then be accessed by clicking on the Show more/Edit

button. A new page is reached, and it contains a form looking like this: Figure 35 - Add a course

D3.2 FLIP2G Learning Environment

Page 44 of 59

Figure 36 - Edit course page

4.3.1 Add Students

As a next step, students need to be added. They can either be added via a tag, or via name. The tag

grade7_2020 is selected and added via the plus sign. The page will then reload to show the added

students:

Figure 37 - Students Added to Course

Additionally, students, that for example failed the course in the prior year, can also be added via their

name or via additional tags. Since a few students failed the history course in 2019, they need to attend

this course. To ensure that, the tag history_2019_failed will be added to the course as well:

D3.2 FLIP2G Learning Environment

Page 45 of 59

Figure 38 - Additional tags

4.3.2 Add Sessions

The next step is to add sessions. This course will take place over 3 weeks and have two sessions each

week, so 6 sessions in total are added through the Add Session button and the dates are changed

accordingly:

D3.2 FLIP2G Learning Environment

Page 46 of 59

Figure 39 - Newly created Sessions

4.3.3 Add Quizzes

To now add a quiz for the first session, the edit icon needs to be clicked and the correct quiz selected:

As this session will use the quiz as a single player

game since it is intended as a homework, the

Multiplayer Button does not need to be marked.

After adding the game to the session, a “Start

Session” button appears. This button only appears

on the date a session is supposed to take place and

can be reached through this menu or the

Dashboard.

Once a session is started, players can access the

game. If the session is stopped after a player started

a game, but before finishing it, he/she can still finish

the game and reach a high score.

Since this game is intended to be played at home,

the teacher will not deactivate the session until the

Figure 40 - Quiz Selection in Session

D3.2 FLIP2G Learning Environment

Page 47 of 59

next lesson. An active session will always show up on the dashboard, regardless of the date it was

scheduled. A once deactivated session cannot be reactivated.

4.4 Playing through the game

Figure 41 - Landing Page (WIP)

To play through the game, the player initially needs to log in through the landing page. Here, she/he can type in his mail address and his password and also change the password if he/she forgot it.

Afterwards, the player will be forwarded to the menu screen where he can choose a single player (“Solo Mission”) or a multiplayer game (“Team Mission”). The quizzes displayed for the player selection are all quizzes that are unlocked by a teacher for the player.

To continue, we will log in with Alex’ account, select the History 7th Grade Quiz in the Solo Mission tab and click on Go!

D3.2 FLIP2G Learning Environment

Page 48 of 59

Figure 42 - Menu screen

4.4.1 Play though Quiz Game

Afterwards, the game screen will open with the first question. Here, it is planned to upgrade the game

in the support phase to add the narrative as requested by the partners.

The player can answer the questions

provided and, if he/she answers

correctly, the player character will

attack the boss enemy with the wrench.

If the answer is incorrect, the player will

get visual feedback about that.

Afterwards, the game progresses – But

the next content that shows up is the

course material added by the teacher.

Figure 43 - Current look of the game (WIP)

D3.2 FLIP2G Learning Environment

Page 49 of 59

Read Course Material

Figure 44 - Course Material (Mock Up)

Course material will be displayed in a pop up, narratively explained by the player character (the spy)

receiving important data from his employer / contractor. The player can click the “Show data” button

to open the course material in a new tab or in another program installed on the student device.

When the student has opened the course material, the “x” button on the top right corner of the popup

will be activated. The student can the close the material and head to the next question.

D3.2 FLIP2G Learning Environment

Page 50 of 59

Finishing the Quiz

Alex, in our case, has not answered all questions correctly. After finishing the game, the losing screen will be provided:

Figure 45 - Losing Screen

Alex can either replay the game or return to the main menu. Additionally, the final score is displayed in the bottom left corner and saved to the backend.

4.4.2 Play through Teamwork Game

The teamwork game is similar to the single player game. After the teacher has followed the same steps provided in the use case Ch. 4.3.3., he needs to click the button at the multiplayer game to enable it.

As an example, we will use the same test quiz for the multiplayer game. In general, multiplayer games can use the same structure, however, they should be designed differently. For example, students need to match the questions themselves, therefore, it should be obvious from the questions which the correlating answers are (as the answers are randomly displayed).

Alex logs into the multiplayer game through the menu as seen in Fig. 43 and then gets matched to another student, Donna. On Alex’ screen, this can be seen:

Figure 46 - Game Form in the

course screen with Multiplayer

enabled

D3.2 FLIP2G Learning Environment

Page 51 of 59

Figure 47 - Multiplayer Question Screen (WIP)

Donna, on her screen, will see the answers to one of the questions. However, both players don’t get any indication to which question the answer fits and need to find it out by thinking logically and communicating strategically.

Figure 48 - Multiplayer Answer Screen (WIP)

D3.2 FLIP2G Learning Environment

Page 52 of 59

As al those answers relate to Shakespeare plays, they correctly deduct that the question belonging to the answers is question No.1, What Shakespearan play features Ophelia? They can the select an answer and continue, similarly to the single player quiz game.

The course material is accessed similarly to the single player quiz game.

In this game, players cannot win or lose. They simply receive the amount of points based on the amount of correct answers.

D3.2 FLIP2G Learning Environment

Page 53 of 59

5 Fulfilment of Requirements

This chapter will deal with the requirements defined in D1.2 and discuss whether they were fulfilled,

to which degree they were fulfilled, and which parts are not developed and for what reason.

Any use of [Yes] in brackets indicates that the function exists but is described in D.3.3 and developed

by Artelnics.

5.1 Teacher Requirements

No.

Requirement Fulfilled?

TR01 Change the content of the game Yes

TR02 Adapt difficulty Yes

TR03 Perform TR01 and TR02 live Yes

Teachers can change the content of the game, create quizzes in different difficulties and mark them

as such through the tags. They can all do that without any recognizable delay.

No.

Requirement Fulfilled?

TR04 Give hints to students No

TR05 Enable and disable help for students No

TR06 Write and receive messages to single students No

Reasoning for not fulfilling any kind of social requirement (In the following chapters, any chat or social

media functionalities from the student side will also be market as not fulfilled) is the fact that most

students already use a social communication platform and the allocation of resources to more crucial

tasks. Most of the time, the teacher will be in the same room as the students and communicate with

them verbally, which can replace a chat function; However, this solution is missing the desired

anonymity.

D3.2 FLIP2G Learning Environment

Page 54 of 59

No.

Requirement Fulfilled?

TR07

Upload different types of data (videos, images, sounds) Yes

Upload of any file is supported. The student requires a program that can display this data. As the

student has a browser anyway, all standard file types (images, pdf, texts) are supported. For videos or

audio files (or any other file format), additional software is required.

No.

Requirement Fulfilled?

TR11

Uncomplicated UI & UX Yes

TR13 Interface Tutorial Yes

TR14 Tooltips for on-screen items and buttons No

TR16 Search function Yes

Tooltip support is not provided. It was decided to support the testers by teaching them the usage of

the tool in an online session and being available for any questions or help during the whole testing

phase. Additionally, the teachers can use this report to search for general functions in the web

interface.

No.

Requirement Fulfilled?

TR19

Track, check, observe student engagement and progression [Yes]

TR22 Push up notifications Yes

The analytical functionalities are more in-depth described in D3.3 and were designed and developed

by Artelnics.

No.

Requirement Fulfilled?

TR24 Group students Yes

D3.2 FLIP2G Learning Environment

Page 55 of 59

TR25 Create new groups Yes

Students are currently matched in random groups for the multiplayer game.

Most of the additional requirements were, as expected, not fulfilled. However, it was possible to

integrate predefined modules and the export of course related data (learning materials). Additionally,

the interface of the teacher tool was designed to resemble that of common LMS.

5.2 Student Requirements

No.

Requirement Fulfilled?

SR01 Link their in-game process and learning progress [Yes]

SR03 Customization & Personalization options No

SR04 Save data Yes

SR07 Chat between peers No

The student requirements as defined in D1.2 were partly fulfilled. As already mentioned in the former

chapter, a chat functionality is not envisioned. Therefore, any customization or personalization

options don’t make any sense in the current prototype as students cannot interact with each other on

the game platform outside of the multiplayer game.

None of the optional requirements for the students were fulfilled, with the exception of an analytics

visualization developed as part of D3.3. The reason for that is an unexpected delay in the development

process and multiple unforeseen issues along the way.

5.3 Technical Requirements

Technical requirements are any requirements needed for the envisioned game to run, but which are

not directly interacted with by the users (either the teachers or the students).

No.

Requirement Fulfilled?

TeR01 Web-based solution for teachers Yes

D3.2 FLIP2G Learning Environment

Page 56 of 59

TeR02 Web-based solution for students Yes

TeR05 Save & Compare data Yes

TeR06 Find outliers [Yes]

TeR07 SQL server Yes

All defined technical requirements were fulfilled.

The optional technical requirements were partly fulfilled. While leader boards were not implemented,

students can access their high scores for a certain match and upgrade it.

An automatic delete function was not yet implemented as it is not necessary for the testing period.

D3.2 FLIP2G Learning Environment

Page 57 of 59

6 Technical Background and Hardware requirements

It was decided that the game should work in a browser to ensure that most devices can access it. The

game itself is optimized for desktop and laptop computers but can theoretically be played on mobile.

The game was developed in Unity 3D and is partly running in 2D and partly in 3D.

6.1 Technical specifications of the game

The game itself runs in a browser, both on the teacher and the student side.

As Unity 3D was used for development, no additional tools are needed for playing the game as any

browser can open web-based games.

The hardware specifications needed to play this game are not very high. While it is technically possible

to play the game on mobile devices, it is optimized for desktop use and highly recommended to use a

desktop pc.

As some of the partner schools who will test the game will use Chromebooks, the game was

extensively tested on Chromebooks.

Students need an internet connection to play either game.

6.2 Technical specifications of the teacher tool

The teacher tool was created in HTML5 and will work on any up-to-date browser. It is optimized for

desktop pcs but can also be used on mobile. However, there might be some formatting issues.

It can ideally be used with a HD screen, as a lot of data needs to be displayed. It is also intended to

access the analytics tool developed in D3.3 through the teacher tool.

Teachers need an internet connection for the website to function properly.

6.3 Backend

The Backend connects the game and the teacher tool, stores data in the databases and also connect

the analytics data to the game.

D3.2 FLIP2G Learning Environment

Page 58 of 59

For the database, MySQL 5.7 was used. The API was designed and developed as part of this project,

based on Symfony 5.1. and written in PHP 7.2.

The initial data model for the Backend looked like this:

Figure 49 - Data Model of Flip2G Backend

While there were some iterations made during the development, it is still useful to have an overview

over the general functionalities of the backend.

D3.2 FLIP2G Learning Environment

Page 59 of 59

7 Conclusion

The development done towards the prototype delivered with this report has required preparation in

form of requirements and surveys as well as the analysis of other serious games. The target group,

class sizes and semester times were provided by each test partner and used as a basis to develop the

game.

Initially, 7 games were designed, of which one was developed and a second one was created based on

the designs to incorporate multiplayer functionalities.

Additionally, a teacher tool was designed and developed based on the requirements and the needs of

the teachers. The tool enables the teacher to create student accounts, quizzes, questions and courses

as well as upload course material and manage the sessions/lectures.

Of the requirements, the majority were fulfilled, excluding any kind of chat functionality between

students and teachers or students and students. Those functions were excluded due to development

and timing management.

Additionally, the technical specifications of the game are defined. The game was created in Unity 3D,

and runs in 2D. It can be played on desktop PCs that can display WebGL.

The teacher tool was created in HTML5 and has the same technical requirements to the user

hardware.

Finally, the backend was created in MySQL and written in PHP.