Visual Realism in 3D Serious Games for Learning: A

Case Study

Voravika Wattanasoontorn

, Milan Magdics

1,2

and Mateu Sbert

Institute of Informatics and Applications, University of Girona, Girona, Spain

Department of Control Engineering and Information Technology,

Budapest University of Technology and Economics, Budapest, Hungary

Abstract. Serious gaming has been proven to be an enjoyable tool to transfer

particular knowledge or skills to target players. In educational context, serious

games offer a powerful and effective approach to teaching, learning and skill

development for all ages. Realism is one of the considerable factors which moti-

vates players to accomplish their goals in a serious game. In this paper we present

the elements and the process of visual realism design for 3D serious gaming,

extended with a case study in LISSA (LIfe Support Simulation Application), a

serious game designed to teach and learn cardiopulmonary resuscitation (CPR).

LISSA exploits video game technology to link computer-based case simulations

with e-learning functionalities in a single framework. An evaluation of visual re-

alism with regard to photorealism and camera viewpoint is presented.

1 Introduction

A serious game is deﬁned as a game with speciﬁc intention such as education, training,

treatment, skill enhancement, widely used in many areas including military, health care,

business management, or social science. Digital based serious games started appearing

in the early 1970s for educational purpose [1]. Up to this date, a series of signiﬁcant

improvements to real-time hardware and software techniques realized new possibilities

for computer generated images, animations and graphics for gaming.

With regard to Dale

s cone of learning, learning by simulating the real experience

is an active learning process through which the learner could obtain 90% of what they

participate within the simulation [2]. To simulate the real experience, the level of real-

ism is always considered. Researchers in many areas consider game design, with regard

to aesthetic context, as a key element in developing successful games [3] [4]. Game

players tend to value good graphics, animation and sound. These factors provide sen-

sory proof of the reality of a game, supporting and enhancing the impact of the whole

game experience. Rhyne et al. [5] suggests that the higher the level of reality or fan-

tasy is, the more entertaining a game becomes. And in doing so, graphics and scenario

play the key roles. A realistic scenario keeps the player intrigued, thereby, increasing

their satisfaction. Sound effects also help to establish the ambience or atmosphere of

a game by increasing realism. Developing and deploying a serious game, with regard

to the realism, have to take into account both the cutting edge technology and players

perception.

Wattanasoontorn V., Magdics M. and Sbert M..

Visual Realism in 3D Serious Games for Learning: A Case Study.

DOI: 10.5220/0004599400240033

In Proceedings of the 2nd International Workshop on Interaction Design in Educational Environments (IDEE-2013), pages 24-33

ISBN: 978-989-8565-65-5

 2013 SCITEPRESS (Science and Technology Publications, Lda.)

In this paper, we present a case study of visual realism design in our 3D serious

game for cardiopulmonary resuscitation (CPR) learning, LISSA (LIfe Support Simu-

lation Application). LISSA provides a 3D computer simulation of emergency scenar-

ios where a patient needs CPR application. A comparison of different visual elements,

namely photo-realism against non photo-realism and different camera viewpoints are

evaluated.

2 Background

Realism in computer-simulated environments is considered as a “Virtual Reality” (VR),

a term referring to the simulation of physical presence in places in the real world, as

well as in imaginary worlds. Most current serious games for learning provide primarily

visual experiences. In this section, we ﬁrst explain the basic steps to create 3D virtual

objects including modelling, texturing and lighting. Next, the literature review on the

degree of realism related to player perception is presented. Finally, visual realism for

serious games is explained.

2.1 3D Production for Gaming

In practice, several techniques are used in creating 3D graphics. The traditional process

of creating 3D graphics for games can be divided into ﬁve basic phases (see Figure 1)

which are modelling, texturing, lighting, animation and rendering, described in more

details in the following.

Fig. 1. Example of; (a) Modeling, (b) Texturing, (c) Lighting and (d) Rendered image.

Geometric modelling is the process of forming the shape of an object. Basically,

a 3D model is formed of points called vertices connected by polygons that deﬁne its

shape. Polygons may contain arbitrary number of vertices, however, the most common

method is to build triangle meshes. The overall integrity of the model and its suitabil-

ity to use in animations depend on the structure of the polygons. Games are real-time

rendering systems, producing dozens of frames in each second. Thus, 3D models par-

ticularly suited for games must contain a reasonably small number of polygons, also

known as low poly model. The number of polygons and objects which can appear in a

scene and can still be rendered at an acceptable performance, has to be carefully calcu-

lated and tested in order to maintain the smoothness while playing.

The second step of 3D production is texturing or texture mapping, a method to

apply (map) the texture of surfaces to the 3D geometry produced by the previous phase.

Every vertex in a polygon is assigned a texture coordinate (which in the 2D case is also

known as a UV coordinate, the axes of the 2D texture) either via explicit assignment or

by procedural deﬁnition. Image sampling locations are then interpolated across the face

of a polygon to produce a visual result that seems to have more richness in colors than

could otherwise be achieved with a limited number of polygons. Computer graphics

techniques detailed above have been designed to make objects appear to contain more

polygons than they actually do.

The third phase is lighting or illumination, which is usually created by a game en-

gine. Upon rendering a scene, a number of different lighting techniques will be used

to make the rendering look more realistic. For this matter, a number of different types

of light sources exist to provide customization for the shading of objects. For exam-

ple ambient lighting, directional lighting, point lighting, spotlight lighting, area lighting

and volumetric lighting. Since the lighting calculation for games is processor-intensive,

some of the lighting components such as area lights are not available at runtime pro-

cessing but may be applied using off-line created light-maps during the texturing step.

Fourth is animation which refers to the temporal description of an object, i.e., how it

moves and deforms over time. Popular methods include key-framing, inverse kinemat-

ics, motion capture and physical simulations, these techniques are often used in com-

bination. Game engines also facilitate some turnkey solutions for animation such as

animation retargeting, data-driven controllers (with motion capture system) etc. which

reduce some repetitive animation tasks.

Finally, rendering is the process to convert the complete model of the 3D virtual

world into a 2D image either by simulating light transport to get photo-realistic images,

or by applying some kind of non-photorealistic style such as cartoon-shade or painting

style. Obviously for games, the rendering step has to be performed at real-time rates.

2.2 Visual Realism in Games

Many researchers concur that player perception can be inﬂuenced by visual realism [7],

[6]. Visual realism is distinguished by the term ”Visual Fidelity” which refers to the de-

gree to which visual features in the virtual environment conform to visual features in the

real environment [8], [9]. In order to convince the player that the virtual environment

is real, the scene presented should faithfully model the expected actual environment. A

highly accurate, fully modelled, interactive environment is thus seen as “virtually real”.

Visual realism has ﬁve basic building blocks: geometry (or form), surface, illumination,

animation (including physics) and viewpoint, each component can be created from re-

alistic to abstract. For example, geometry is formed by points, lines, curves, or surfaces

in the modelling step as described in Section 2.1. To model an object for games, the

form can have real proportions or distorted depending on the game concept.

Despite its importance, the role of viewpoint and perspective is one of the least

studied elements of realism and therefore, we give more focus on this topic in our work.

Rob Pepperell discusses in [10] the problem of how to depict the relative indistinctness

of peripheral vision as compared with central vision, and the appearance of our bodies

in our ﬁeld of view. He argues that ﬁrst person view — intended to simulate viewing

the scene through our own eyes — may be less realistic due to the lack of ability to see

our body, comparing to other, outer viewpoints.

Since a game is an interactive virtual environment, careful deﬁnition of level of

realism and the interactive qualities of the virtual environment are required. Interface

or interaction ﬁdelity refers to the degree to which the simulator technology (visual and

motor) is perceived by a human participant to simulate the operational equipment and

the actual real world task situation. In the following, we present our case study of the

visual production of LISSA and the experiment on user perception focusing on visual

realism.

3 Life Support Simulation Application (LISSA)

LISSA is a serious game designed to teach and learn CPR in complete compliance with

The European Resuscitation Council (ERC) CPR guidelines, 2010 [11]. LISSA has

been designed as an e-learning environment with all the actions turning around a CPR

scenario that reproduces with 3D realism an emergency situation that requires CPR

procedures. LISSA supports two types of users, instructors and learners. Instructors

prepare the CPR scenario and present it to the learner as a test or problem. The learner

solves the problem applying the CPR procedures in a game mode. LISSA evaluates the

actions and assigns a ﬁnal score. All of the learner’s actions are registered in a central

data base allowing instructors to consult them in order to track the learning process.

Instructors then can use this information to recommend new scenarios and problems.

3.1 Visual Realism within LISSA

The visual realism of LISSA is considered during all production process from mod-

elling to rendering with respect to the ﬁve elements of visual realism presented in Sec-

tion 2.2. Starting with the modelling, a low polygon model with real proportions is

speciﬁed. The proportions deﬁned in character modelling of LISSA are the ones of an

average person, generally seven and a half heads tall (including the head) which is the

proportion of humanoid form. A true proportion is required in order to maintain the real

kinetic and human factors during the emergency scenario.

In order to run as smooth as possible, minimizing the geometry, decreasing the

number of polygons and texture distortion of all 3D models are needed. Within LISSA,

the number of polygons are ﬁrst limited by the game engine we used, Unity3D, allow-

ing up to 60,000 polygons per object. Polygons of LISSA objects are between 5,000

to 30,000 depending on their structure. To ensure real-time interaction and preserve

visual realism we created scenes where the number of polygons for a single scene, in-

cluding characters, equipments and environment, was between 40,000 and 200,000. To

minimize the number of polygons, modelers needed to maintain the visual realism as

similar as a high-polygon model. The reduction of polygons was performed until the

modeler found a reasonable compromise between visual quality and performance for

real-time interactive use where usability is more important than visual perfection.

Figure 2 (a) and (b) present examples of a low polygon and a high polygon model,

respectively, representing the same character within LISSA; the same texture, depicted

in Figure 2 (c), was applied to both models. We can see that the results as presented

in Figure 2 (d) and (e) look completely identical even though the number of polygons

are very different (3,996 for the low polygon model and 251,120 for the high polygon

Fig. 2. Difference between low-polygon model and high polygon model.

model). In addition, some techniques were used in order to control the number of poly-

gons in a rendered scene such as if an object is normally viewed only from a few sides

or if the object is mostly ﬂat, then it can be approximated by a textured polygon rather

than by a full geometrical model. Furthermore, some unimportant and hidden objects

were identiﬁed, simpliﬁed and completely eliminated.

To overcome the limitations of per-vertex surfaces, which require a high-level of

tessellation to achieve smooth look, we use a set of bit-mapped images (multi-texturing)

which contains color information and is usually projected onto the triangles of a mesh.

When creating a character model, the high polygon model is ﬁrst scrubbed in order to

keep the details of folds and wrinkles on clothes then the topology is changed by turning

the sculpted object into a low poly mesh. The details within the high poly model are

unwrapped and turned to a realistic texture. Most of the texture maps used within LISSA

are JPG format which can be lossy compressed. On the other hand to represent the

transparent objects we use TIF format since alpha channel is supported in this format.

Figure 3 shows an example of multi-texturing for a character in our game.

Fig. 3. Example of texture map of a character in the LISSA game.

To illuminate the scenes and the objects we used the basic lighting functionalities of

Unity3D game engine [12] such as directional lights and spot lights. Textures we used

were also embedded (“baked”) with indirect illumination such as ambient occlusion,

caustic (refractive, reﬂective) effects, and also post-processed (adjust saturation and

contrast). These baked textures present how light appears to reﬂect from the model’s

Fig. 4. Example of high precision animation while two objects have touched.

surface. In this way different off-line computed illumination effects such as shading

and shadows can appear on texture maps, see Figure 3 for an example.

Since LISSA is deﬁned as a serious game for learning, the posture and movement

of characters have to be in the correct way. During the animation process, the main step

that needs to be considered carefully is when two animated components have touched

or collided as overlapping has to be avoided. For example as in Figure 4, when the

helper

s hands are touching or holding a part of the patient

s body, the hands of the

helper have to be positioned properly and with high precision in order to avoid unre-

alistic intersections. Another consideration is that an adaptive learning system such as

LISSA should allow instructors to select the main actors in the game. When the char-

acters are changed, some characteristics such as height, body size are also changing,

while the position of touching needs to be exactly the same.

Finally, the render viewpoint needs to be considered. To maintain LISSA visual real-

ism, 1st and 3rd person viewpoints are considered. The comparison of player perception

has been evaluated, results are presented in Section 4.2.

4 Evaluation

In order to optimize the visual realism of LISSA, a visual perception survey has been

done. The objectives of the survey are; i) comparison between photorealistic (PR) and

non-photorealistic (NPR) rendering; ii) comparison between 1st and 3rd person view-

point and iii) user perception survey on LISSA

s visual realism with predetermined

rendering style (PR) and viewpoint (3rd person). Before doing the survey, the NPR

style applied in the test was pre-selected by LISSA’s developer team. Figure 5 shows

examples of NPR rendering for pre-selection. The selection is based on the preference

of team members. Finally, Figure 5 (h) has been chosen to compare with PR scene.

4.1 Method

The evaluation was based on a questionnaire, participants were gathered from 22 layper-

son volunteers. The same protocol was followed with each experiment. First, the partic-

ipant completed the pre-experiment questionnaire. Second, the participant was told the

goal of the experiment. Third, the participant was given the chance to practice playing

the game in the demo mode with each user interface, (1) PR with 1st viewpoint (2) PR

Fig. 5. Examples of NPR rendering for pre-selection.

with 3rd viewpoint (3) NPR with 1st viewpoint and (4) NPR with 3rd viewpoint (in ran-

domized order), for no more than three minutes. Fourth, the participant played the game

with pre-determined user interfaces, on a pre-determined level. Finally, the participant

answered the interface experience questionnaire related to the user interfaces.

The questionnaire had two main parts. First part was a pre-experiment question-

naire, which gathered the participant’s characteristics including gender (male/female),

handedness (right / left / ambidextrous) and age (from <20 to >60 years old). The par-

ticipants were also asked to rate their expertise with computers and games by selecting

the frequency of using a computer and playing a computer game (from <1 to >20 hours

per week). The second part was an interface experience questionnaire. In this part, three

groups of questions (with 16 questions in total) were asked. The ﬁrst group was a com-

parison between PR and NPR rendering, allowing a third, neutral answer denoting no

user preference, see Figure 6 for details. The second group intended to compare 1st

and 3rd person viewpoint, questions are shown in Figure 7. As in the ﬁrst group, three

options were provided. In the last group, the participants were asked to rate how much

they agree about different statements related to the visual realism of LISSA, using a

5-point Likert scale [13]: strongly disagree, disagree, neutral, agree and strongly agree.

4.2 Results

The results of the survey are presented in Table 1, 2, 3, 4 and Figure 8 which are

characteristics of the sampling; comparison results of “photorealism (PR)” and “non-

photorealism (NPR)”; comparison results of “1st” and “3rd” person viewpoint; visual

realism results of LISSA with predetermined rendering (PR and 3rd person camera

viewpoint); and an evaluation of average results (in red) with error polylines of stan-

dard deviation (green and blue), respectively.

The results show that willingness of learning can be enhanced by visual realism.

Photo-realistic (PR) rendering and 3rd person viewpoint was well rated. In terms of the

type of rendering (PR) and viewpoint (3rd person), participants had positive feeling with

the degree of visual realism, enjoyment, ease of use, comfortability while playing game.

Participants also agreed in that the intended actions were accurately carried out on the

screen when using LISSA

s interface. In the learning context, participants felt that when

learning with LISSA, their CPR performance could be improved signiﬁcantly.

Fig. 6. Comparison of PR and NPR in LISSA.

Fig. 7. Comparison of 1st and 3rd person viewpoint for different actions.

Table 1. Characteristics of sample for the questionnaire.

Issue Details

Gender 8 men, 14 women

Handedness 19 right, 1 left and 2 ambidextrous

Age (years old) 20 (21-40) and 2 (41-60)

Frequency of computer using (hour per week) 4 (1-10H) and 18 (>20H)

Frequency of playing game (hour per week) 4 (no), 6 (<1H), 8 (1-10H), 1 (11-20H) and 3 (>20H)

Table 2. Comparison results of ”photorealism (PR)” and ”non-photorealism (NPR)”.

Questions -1 µ ± σ 1

Q1. Which one was easier to understand? NPR 1.0 ± 0.2 PR

Q2. Which one was more attractive? NPR 1.0 ± 0.0 PR

Q3. Which one motivated you to learn more? NPR 1.0 ± 0.0 PR

Q4. In overall, which one satisﬁed you more? NPR 1.0 ± 0.0 PR

Q5. Which one is more appropriate with LISSA? NPR 1.0 ± 0.0 PR

Table 3. Comparison results of ”1st” and ”3rd” person viewpoint.

Questions -1 µ ± σ 1

Q6. Which viewpoint made you feel more real? 1st 0.6 ± 0.8 3rd

Q7. Which viewpoint was more comfortable to use? 1st 0.9 ± 0.4 3rd

Q8. For overall satisfaction, which one satisfy you more? 1st 0.8 ± 0.6 3rd

Q9. Which one is more appropriate with LISSA? 1st 0.8 ± 0.6 3rd

5 Discussion and Conclusions

In this paper we presented the process of optimizing visual realism within our serious

games for cardiopulmonary resuscitation learning, LIfe Support Simulation Application

(LISSA). Five visual realism components, form, surface, illumination, animation and

Table 4. Visual realism results of LISSA.

Questions 1 µ ± σ 5

Q10. Visual realism enhance the willingness of learning Strongly Disagree 4.5 ± 0.5 Strongly Agree

Q11. The degree of visual realism in LISSA is high enough Strongly Disagree 3.8 ± 0.6 Strongly Agree

Q12. Using this interface was enjoyable Strongly Disagree 3.8 ± 0.7 Strongly Agree

Q13. Learning this interface was easy Strongly Disagree 3.7 ± 1.0 Strongly Agree

Q14. This interface was comfortable to use Strongly Disagree 3.7 ± 0.6 Strongly Agree

Q15. My intended actions were accurately carried out on screen when using this

interface

Strongly Disagree 3.7 ± 0.9 Strongly Agree

Q16. I feel like more practice time with this interface would have made a signiﬁ-

cant difference to my performance

Strongly Disagree 4.2± 0.5 Strongly Agree

Fig. 8. Evaluation of average results (in red); error polylines (green and blue) at one standard de-

viation. R, VP and L denote questions related to rendering mode, view point and the effectiveness

of LISSA, respectively.

camera viewpoint have been proposed and used during the game production procedure.

Additionally, all objects and characters have been maintained with the real proportion

and movement. The basic illumination provided by Unity3d game engine has been used

in addition to the indirect illumination such as ambient occlusion which was embedded

into the texture maps. Two of the ﬁve components including surface rendering (PR,

NPR) and camera viewpoint (1st , 3rd viewpoint) were evaluated by 22 laypeople.

The evaluation results show that photo-realistic rendering with 3rd person viewpoint

are well rated and participants feel positive with the visual realism of LISSA. These

conﬁrm both that realism plays a key role in teaching by simulation applications, as

well as the observations made by Pepperell [10] about the difﬁculties of the realistic

depiction of peripheral vision in ﬁrst person view including the limited visibility of the

viewers body. As future work, comparative evaluations with other systems are required

and we also would like to investigate another types of realism, including functional and

physical realism, as well as the further possibilities of visual realism that effects each

step of learning process.

Acknowledgements

This work has been supported by the research projects coded TIN2010-21089-C03-01,

IPT-2011-1516-370000 and IPT-2011-0885-430000 (Spanish Commission for Science

and Technology), and by grant 2009SGR643 (Catalan Government) and by a mobility

grant from the Prince of Songkla University, Thailand.

References

1. Jensen, P. (1990). At this end of the oregon trail: The eugene augur: 19691974. Serials Re-

view, 16(3):91 95.

2. Dale, E. (1969). Audiovisual methods in teaching. third edition. New York: The Dryden

Press;. Holt, Rinehart and Winston. Dwyer, fm.

3. Lee, C. W. (2010). Inﬂuential factors of players loyalty toward online games for achieving

commercial success. Australasian Marketing Journal (AMJ), 18(2):81 92.

4. Park, H. J. and Kim, S. H. (2012). A bayesian network approach to examining key success

factors of mobile games. Journal of Business Research, (0):.

5. Rhyne, T. (2002). Computer games and scientiﬁc visualization. Communications of the

ACM, 45(7):41 44.

6. Sandaruwan, D., Kodikara, N., Keppitiyagama, C., Rosa, R., Jayawardena, M., and Sama-

rasinghe, P. (2012). User perception of the physical, behavioral realism of a maritime virtual

reality environment. In UKSim 14th International Conference on Computer Modelling and

Simulation (UKSim), 2012, pages 172178.

7. Cross, R. (1995). Interactive realism for visualization using ray tracing. In Visualization,

1995. Visualization 95. Proceedings., IEEE Conference on, pages 1926, 434.

8. Budrikis, Z. (1972). Visual ﬁdelity criterion and modeling. Proceedings of the IEEE,

60(7):771 779.

9. Kahlesz, F., Zachmann, G., and Klein, R. (2004). visualﬁdelity dataglove calibration. In

Computer Graphics International, 2004. Proceedings, pages 403 410.

10. Pepperell, R. (2012). The perception of art and the science of perception. Proc. of SPIE-IS&T

Electronic Imaging: Human Vision and Electronic Imaging XVII, 8291.

11. The European Resuscitation Council (2012). ERC Guidelines 2010. http://

www.cprguidelines.eu/2010/. Accessed 7 Feb 2013.

12. Unity Technologies (2013). Create the games you love with unity. http://unity3d.com/unity.

Accessed 11 Apr 2013.

13. Vagias, Wade M. (2006). Likert-Type Scale Response Anchors. Clemson International Insti-

tute for Tourism & Research Development, Department of Parks, Recreation and Tourism

Management. Clemson University.