<<

Integrating Visual Effects into 2D Platformer Games to Enhance Play Experiences

Hao Tian Game Science and Design Northeastern University [email protected]

Thesis Presented by Hao Tian to the Department of Art + Design

In Partial Fulfillment of the Requirements for the Degree of Master of Science in Game Science and Design in the Graduate School of the College of Arts, Media and Design

Northeastern University Boston, Massachusetts May, 2020

Abstract

This paper offers an experimental result of how to design visual effects in the 2D game to enhance play experience by offering visually appealing graphics and helping players understand the game. Visual effects in the industry were used as set decoration because they can attract players from an aesthetic aspect and even help players understand the game better. More than just making the game visually appealing, they can also be used to guide the players on how a game's mechanics should work without using text-based instructions. By integrating appropriate visual effects into a 2D platformer game, the game mechanics become easily understood by the player, and the appropriate visual effects can also help players immerse into the game from both narrative perspective and interactive perspective. In this research project, the development team applied game design concepts and art knowledge to design visual effects based on the principle making them appealing and informative. The visual effects are applied to the game objects or shown with other elements. This paper uses the data collected from the playtest to iterate the design. The result from playtests shows the game designers and graphics designers need to relate visual effects to core game mechanics to help players to understand the game mechanics and the game theme, which can help players to be more engaged in the game.

Keywords: 2D game, visual effects, play experience.

Table of Contents

1 Introduction 1

2 Background 3 2.1 Visual Effect in Games and Play Experiences 3 2.2 Apply Visual Effects in the 2D scene 5 2.3 Example of 2D game visual effect 6

3 Study Methodologies 7 3.1 Project and Research Method 7 3.2 Human Subject and Recruiting 7 3.3 Testing 8 3.4 Data Collected and Analyzed 9

4 Design Visual Effects 10 4.1 The Game Theme 10 4.2 Project and Visual Effects Design And Development 10 4.2.1 Full-screen visual effects 11 4.2.1.1 Blurry borders 12 4.2.1.2 Floating Broken Mirror Pieces 13 4.2.1.3 Mirror transition effects: Fly in-and-out effect 13 4.2.2 Partial Visual Effect 14 4.2.2.1 Mirrors 15 4.2.2.2 Parallel Mirror Transportation 16 4.2.2.3 Stars 17 4.2.2.4 Interactable Items 19 4.2.3 Real-time lighting effect on Interactable Items 21 4.2.4 Other Visual Effects 23

5 Result 25

6 Discussion 27

7 Reflection 29

8 Conclusion 30

References 32

Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

1 Introduction

This thesis study is based on an experimental game which was developed by two

Northeastern University Game Science and Design (GSND) students. I am the programmer and the visual effect designer of the team, another team member is Sidan Fan, the project idea founder and lead designer of the team. This thesis studies how to design visual effects in the 2D ​ game to enhance play experience by offering visually appealing graphics and helping players understand the game. Sidan’s research focused on whether or not the game changed people's ​ attitudes about bullying.

In video games, the game world environment and atmosphere are becoming very important for game evaluations. When it comes to game evaluations, the hard standard score that a game receives from game communities and players' opinions is just the beginning. Game ​ evaluations not only represent what players and their communities think of a game, but they also represent the evaluation of the game as a whole, whether it be from players, or news sources like

IGN. Advances in computer graphics and game engines have provided a number of tools to develop appealing game graphics in 3D games. 3D games usually have light sources and spatial perspectives which makes players feel as though the game is closer to the human eyes’ perspective (Mattila, 2018). According to Mattila, the visual effects of 3D games can ​ ​ ​ significantly improve the quality of the game because visual effects provide and enhance the expression of actions such as explosions, smashes and vaporizations. Game graphics’ appearance ​ is also an important factor that could enhance play experience by creating the right atmosphere and helping players to immerse themselves into the game. Different combinations of color,

Hao Tian Thesis, Game Science & Design, 2020 1 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences shape, light and other visual effects could generate an astonishing game world that players would fully engage in. (Geslin et al., 2016).

Creating such an attractive game world is easier in 3D game worlds because human eyes have a natural depth perspective, so 3D graphics create more detailed and immersive experiences

(Kim et al., 2016). However, it is fairly hard to create a similar environment in a 2D game.

Fortunately, there are some great examples of 2D games that have visual effects that could create such immersive experiences that only use 2D visual effects. For example, Hollow Knight is a 2D ​ platformer game that contains many spectacular lights, shadows and other visual effects in the game scene, which generate a dark and dampened dungeon. The game has dungeons with glimmers, vapor and mirror reflections, which enhance players’ experience instead of the mechanics itself (Figure 1).

Figure 1. Hollow Knight Screenshot

In this thesis study, a 2D platformer game with various visual effects was designed and developed by a graduate student team. The game serves as an experimental tool in order to study

Hao Tian Thesis, Game Science & Design, 2020 2 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences how visual effects impact player experience. To make an adequate immersive experience, the thesis study would focus on designing various visual effects. Hence, the study is about designing visual effects and combining them into the game. In order to study people's opinions and judgements on several visual effects, the playtest will be creating different visual effects to understand how players feel about them. Then, by adjusting the visual effects and their combination through multiple playtests, we can capture/collect people's perception to make the game visually attractive and help players immerse themselves into the game.

2 Background

According to Crawford et al. (2018) a study about player experience and sport-theme games, immersive games usually make players fully aware of what they should do in the game.

Using solid game mechanics and appealing graphics can help achieve that goal. I have studied some successful commercial 2D games, which is helpful to do the thesis study. The background research of this thesis has three parts: the first part shows current research about the relationship between game visual effects and the player experience. The second and third part study some researches that explain how to integrate the visual effects from 3D into 2D from design perspectives and use survey data to discuss how to make the visual effects become visually appealing.

2.1 Visual Effect in Games and Play Experiences

Current studies about how game visual effects influence the player experience are not adequate to help this thesis study’s design section, especially since they do not have a lot of

Hao Tian Thesis, Game Science & Design, 2020 3 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences research about the relationship between different visual effects in the game environments and player experience. However, research exists that provides evidence that game environments could affect the player experience. According to Knez and Niedenthal’s research (2008) , the color theme of the environment can directly influence the players’ feelings and even performance in the game. For example, players in warmer-color FPS games environments usually report feeling more relaxed and can also play the game better; in a cooler color environment, they feel just the opposite.

Furthermore, Totten (2016) mentioned that there are many classic colors and visual effects combinations used in game production that help game makers to evoke certain feelings, such as black and green to imply horror and ghosts, and shadows at the corners plus glimmers to represent dark and underground spaces. More than that, Geslin et al. (2016) studied 24 high-quality games in order to find out the relationship between different color combinations and player’s emotions. They claim that different color combinations can shape a harmonic and unified environment, which can influence players’ emotional experience significantly.

In addition, some studies also found some mistakes that a game can avoid in order to be more visually appealing. According to Hölttä (2018)’s work about the relationship between art styles of the game and the game narratives, the non-unified art styles in the game can influence the players’ evaluation of the game significantly. Together with Geslin’s study in 2016, it is fair to say the color combinations of a game are crucial to the game theme, especially to game narratives because the game theme is an important part to evoke players’ feelings and enhance the effect of the narrative parts. Furthermore, Maureira et al. (2015) studied how much ​ subliminal visual prompts in horror games could influence players’ experiences. Maureira

Hao Tian Thesis, Game Science & Design, 2020 4 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences concluded some subliminal visual effects are usually ignored in games and cannot enhance ​ players’ experiences. In contrast with their research, this thesis study focuses on the more ​ noticeable visual effects rather than unnoticeable visual effects.

2.2 Apply Visual Effects in the 2D scene

Creating visual effects can be done using many techniques. In this study, we focus on ​ visual effects created through two of these: shaders and particle systems. Both shaders and ​ particle systems are the pixel manipulation program that has been applied in games, game engines and graphics software. Applying these techniques can generate ideal visual effects on both 2D and 3D environments and some applications share similar methods of manipulating pixels. Unfortunately, the used for this thesis project did not support the desired visual effect on 2D sprites and texture we needed; we therefore developed a customized shader script to achieve our goal.

For implementing lighting or shadow effects in 2D games, Hudon (2018) mentioned the technique for creating fake shadow effects on 2D figures by providing a lighting source above the figure, which provides an approximate 3D projection that matches the 2D shape. As such, this technique can make realtime shadows on a 2D sprite or figure. Furthermore, according to Au

(2014), combining 3D and 2D graphics could create a better visual experience by building 2D objects on 3D objects. This follows the principle in this thesis project to create a 2D game that has 3D properties.

Without using 3D, the desired 2D visual effects can still be made by particle systems within and customized surface shaders. These methods, however, require more graphical

Hao Tian Thesis, Game Science & Design, 2020 5 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences computations. For example, Rodrigues (2015) proposes an effective method that generates light ​ effects on 2D game terrain. One solution proposed by Rodrigues, “baked on lighting”, calculates ​ the volume of a game object and calculates where the shadow on the game object should be put with an artificial light direction. Then, it adds a black and gray texture on the game object to create the desired lighting effects. Including similar lighting techniques on the game could be a ​ bonus for enhancing players’ feelings of traveling in a magical world.

2.3 Example of 2D game visual effect

In the game industry, the 2D visual effects need to be developed on art resources and scripts, and there are many things that need to be considered. According to Lidholt’s presentation at Game Developers Conferences 2015, developing appealing 2D visual effects could be done by many techniques, such as real-time, using the normal map or doing color adjustments on the visual effects (Lidholt, 2015). In order to apply those techniques, however, developers need to put more time and effort into making art assets. This approach is therefore less feasible for a student or independent team.

The pure 2D art assets can be used for generating memorable visual effects, such as the visual effects in Hollow Knight that are made by 2D art assets. However, combining 3D and 2D ​ perspective into one 2D game is also perfectly fine; according to Benson’s presentation about the

Animation in game Ori and the Blind Forest (2015), despite the character models in the game ​ ​ ​ are 3D, many visual effects such as wind, water waves and light are complete 2D visual effects.

The combination of 3D models and 2D visual effects were combined efficiently and aesthetically in the game.

Hao Tian Thesis, Game Science & Design, 2020 6 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

3 Study Methodologies

3.1 Project and Research Method

An experimental game project was created by myself and my collaborator, Sidan Fan, with the goal of both testing people's attitude about school bullying (this thesis question) and how to design visual effects for 2D games in order to give players an optimal playing experience

(my thesis question). The game project was developed as thesis project with Northeastern

University’s Game Science and Design Graduate Program. Surveys, informal interviews, and other methods, including Think-Aloud protocol, were used to collect quantitative and qualitative data concerning the impact of visuals on players’ experience of the game.

3.2 Human Subject and Recruiting

The human subjects for the research were GSND students, previous colleagues from

Co-op (e.g., professional game designers or gameplay developers), or general players who have experience with some 2D platform games. The participants were not required to have a background in art or design. However, participants were expected to be able to describe a visual effect, and how it impacted their gaming experience. Since the research study focused on the visual aspect of the game, the language that the participant speaks was irrelevant for the study purposes.

Participants were contacted via email, Slack, WeChat, and other communication applications. In order to maintain objectivity, the general players (i.e., those who had no former relationship with the research team) were recruited from varying sources, such as online gaming

Hao Tian Thesis, Game Science & Design, 2020 7 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences communities and Northeastern student communities. General participants were reached out to through online posts, Discord, and other public social media platforms (e.g., Facebook).

3.3 Testing

Informal playtesting was held frequently as part of the game development process in order to refine the visual effects and maximize their impact on players. Think-Aloud and informal interviews were used so that direct feedback could be received from participants. Direct feedback was useful in helping the team improve the gameplay and narrative, and the visual effects, and to better prepare for subsequent playtests. Below are a series of questions asked in order to gain intuitive feedback from participants:

● “Do you like this visual effect?”

● “How do you feel about it?”

● “What would you like to see about [the place to apply visual effects]?”

Two formal playtestings were held during the research data collection period. Surveys, informal interviews and Think-Aloud technique were used in the formal playtesting section. The questions that were asked in informal playtesting were also asked in the formal playtesting.

Other than the qualitative data that abou how participants talk about the visual effects, the quantitative data such as how long does each participant solve a puzzle were also collected. The purpose for collecting the time for solving each puzzle is to evaluate how much the visual effects can help participants solve each puzzle. Unfortunately, after the first formal playtesting, the research team realized the time doesn’t help with the research because there are very little

Hao Tian Thesis, Game Science & Design, 2020 8 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences differences between participants on solving puzzle time, so the team stopped collecting the quantitative data after the first formal playtest.

3.4 Data Collected and Analyzed

This thesis study used the research studies in reference as a guideline to collect quantitative data and find out what kind of visual effects would enhance players’ immersive experience, i.e., what visual effects would best allow players to feel that they are in the game's

'world'. In the research study, participants played different game scenes (i.e., a piece of the game, but not necessarily an entire game scene) that have different visual effects, e.g., a puzzle that contains only full-screen visual effects versus game scenes that possess both partial visual effects and full-screen visuals.In order to optimize participants time, the playtest questions were included in the team test survey.

The data will be collected via survey and coded for the thesis study purpose; the ​ ​ qualitative data is the majority data used for this study. In the survey, playtesters can describe what they saw in the game scene and how they feel about certain visual effects. No definition or suggestions are included in the survey questions. After the survey, each question response is coded into words. The analysis would be to mainly study those coded vocabularies to conclude what should be done in order to improve the project. If enough data were collected, the study could conclude what kind of visual effects could be included in a 2D game environment, and how to design the visual effects to make a game experience better.

Hao Tian Thesis, Game Science & Design, 2020 9 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

4 Design Visual Effects

4.1 The Game Theme

The game project, called Me Behind The Mirror, is a 2D platformer game which tells a ​ ​ story about a girl named Lynn who is trapped in her nightmare and tries to escape. The nightmare is the reflection of her experiences being bullied at school and influences of her parents’ relationship discord. As the game’s name, the mirror is the icon of the game and also the most important element that the players interact with. The mirror implies a sanctuary for Lynn to hide from hurt and escape from danger. In the game, mirrors are also portals from players to transport the game characters to different positions. Other than mirrors, there are other game objects like three stars, interactive items and enemies; each of them has their own functionality and visual effects are used for some of those functions.

The main theme of the game is sadness and sorrow at the beginning period of the game, but in the middle period of the game, the theme will become less somber and more hopeful. The visual effects are designed based on the decisions, playtests, and iterations of the design made by the game designers.

4.2 Project and Visual Effects Design And Development

The game was built by a two-person team using the Unity game engine. The game includes original art resources and game scripts built entirely by the team. Since the main theme of the game is school bullying, the art style in general is somber and depressing. All visual effects would be based on the theme of the game to deliver the message to the players and hold

Hao Tian Thesis, Game Science & Design, 2020 10 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences their attention in the game. Thus the overall goal of the effects was to support the gameplay theme, experience and narrative. The categories of visual effects in the project are:

4.2.1 Full-screen visual effects

This is a global visual effect which affects the whole screen. It manipulates all

pixels on the screen. This kind of visual effect is the most significant because it

influences the whole game world that players can see. These were applied in the game

because they could influence the game atmosphere and potentially be the most noticeable

by players.

The full-screen visual effect were changed by game scene or different locations

within the in-mirror game world. These could help players feel the difference between in

the mirror world and the real world, which could help players to recognize how the game

world is constructed and potentially helps players immerse into the game world. The

full-screen visual effects are applied on the gate mirror in the game. The reason for

paying attention to the in-mirror world visual effect is because the mirror is the key

element of the game, so it is significant to let players feel the characteristics of the

in-mirror world. Both visual effects were applied individually and together, and the study

tested both of them and collected feedback from players. New visual effects related to the

in-mirror world would be added and tested if those two visual effects were not adequate

to enhance the players’ play experience.

A gate mirror is a portal that connects real world and mirror world, which is how

the game characters transfer between in-mirror world and real world. Many visual effects

could be applied on the gate mirror. After multiple group discussions and a few early

Hao Tian Thesis, Game Science & Design, 2020 11 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

iterations, the team decided to apply the following three visual effects, which could

deliver the aesthetic feeling to the players.

4.2.1.1 Blurry borders

Blurry borders is the visual effect during which the background’s borders blur

around the player at the center. The similar effect that we would apply in the game is

shown in Figure 2. However, the degree of blur has been adjusted to become less

apparent, since the team, upon discussion, realized that this game requires players to

adjust the view by moving the camera, so overly blurred borders would severely

influence the game experiences. This visual effect was applied when the characters stood

in front of a broken mirror, indicating the character's broken heart. Using only a

mirror-like texture cannot imply the character’s psychological status perfectly. This could

also tell players that they are looking at the mirror, which could potentially enhance

players’ experience by telling them that they are interacting with the core story element in

the game.

Figure 2. Blurry Borders Example from Witcher 3

Hao Tian Thesis, Game Science & Design, 2020 12 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

4.2.1.2 Floating Broken Mirror Pieces

This visual effect is similar to the effect shown in Figure 3 but covers the whole

screen, as shown in Figure 4. Players see the floating broken mirror or glass pieces,

which are meant to be a strong indication that the character is standing in front of the

mirror. This was done using the particle effects in the Unity game engine. In order to

interact with different levels of the game, different colors of mirror pieces may be applied

depending on the theme of that .

4.2.1.3 Mirror transition effects: Fly in-and-out effect

This is a visual effect combination which creates the feeling of travelling between

real world and in-mirror world, and the designer believed the visual effect for mirror

transition needs to be strong enough to enhance players’ feelings about traveling between

worlds. In the game, the player can travel between the in-mirror world and the real world

when the character is in front of the gate mirror. When the player calls the mirror travel

command, the fly in-and-out visual effect starts. The actual transition happened in

between the visual effect starts and finishes. The fly in-and-out visual effect was

implemented by giving the main camera of the game a dramatic movement and small

blurry effect on the border edges when the mirror travel is happening. The feeling of

going in and out between two worlds will be adjusted in order to create the feeling of

speed. This visual effect was tested in the game together to see players’ feedback about it.

Hao Tian Thesis, Game Science & Design, 2020 13 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

Figure 3. Broken mirror pieces float in the air

Figure 4. Broken mirror pieces float which cover the whole screen

4.2.2 Partial Visual Effect

The partial visual effect is the visual effect that only is applied to a partial area,

and is applied to many objects. For example, broken mirror pieces that float in the air

(Figure 3) is a particle effect created by the Unity particle system and is applied on mirror

Hao Tian Thesis, Game Science & Design, 2020 14 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

game objects. This kind of partial visual effects were applied to both interactable and

non-interactable objects in the game, and those game objects' visual effects will not be

too subliminal for players to observe during the gameplay. The game objects that would

contain visual effects are included in the continuing list below:

4.2.2.1 Mirrors

Most attention was paid to the mirror - the most important element of the game.

There are two types of mirrors in the game. The first is a visual effect, the parallel mirror,

used for real world characters to transport themselves to other places in the real world.

The second is the gate mirror for players to transition between the real world and the

in-mirror world.

When the player steps into the mirror range, the mirror visual effects will be

triggered. For example, when the player steps into the parallel range, the visual effects of

the mirrors’ reflection will be triggered (Figure 5), and when the player in front of the

gate mirror, the floating broken mirror pieces visual effect will be triggered (Figure 3).

More visual effects were designed based on players’ feedback.

Hao Tian Thesis, Game Science & Design, 2020 15 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

Figure 5. The parallel mirror lighting visual effects

4.2.2.2 Parallel Mirror Transportation

Parallel Mirror is a game object that players can interact with to transport the

characters to the mirror star (blue star)’s position, which is calculated in real time based

on the character’s position; the mirror star position is always symmetrical to the

character’s position when the character is in the parallel mirror area. When the player

calls the parallel mirror transportation command, the teleportation occurs and the visual

effects will appear before the transportation happens. This transportation visual effect

was inspired by the famous puzzle game Portal; when the character is transported, two

circular lights will expand on each side of the parallel mirror, and disappear when the

transportation is over. The key design concept is to let the player feel the rapid (light

expanding and disappearing) and non-dramatic transportation (shape of the visual effect

is round, no sharp edge), so players could realize this is a harmless action and this can be

called frequently and quickly to move the character to another position. The

Hao Tian Thesis, Game Science & Design, 2020 16 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

transportation visual effect is shown in Figure 6.

Figure 6. The parallel mirror transportation visual effect

4.2.2.3 Stars

Stars are game objects that players can interact with. These stars can provide

positive or negative effects, and some can unlock characters’ abilities and skills. The

visual effects of the star were created by the particle system in the Unity engine. The

details may vary depending on the design decisions. There are five types of stars with the

following visual effect:

1) Mirror Star:

Mirror Star is a blue star that provides the character the ability to travel in the

mirrors. The appearance of the mirror star is a star shaped crystal (Figure 4 & 5), to

indicate this star interacts with mirrors (or a part of a mirror). A more detailed visual

effect was added into the art resources and it was tested with the parallel transportation

visual effects.

2) Fire Star

Hao Tian Thesis, Game Science & Design, 2020 17 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

The Fire Star is a red star which is the only tool that can be used to attack enemies

in the game. In the game, players can shoot out the red star and call it back after it is shot.

Multiple visual effects were attached with this game object, such as charging, flying and

explosion when the star hit something. The main design intention of the effects in the fire

star is to let convey its power. This is done by giving fire star multiple states such as

charging, flying, and exploding. One of the ways in which player experience is enhanced

is to let players feel the power of Fire Star. Designer added explosion effect on Fire Star;

when Fire Star was shot out and touch something, leading it to explode and generate

flames. Figure 7 shows the Fire Star’s charging, flying and exploding status.

Figure 7. Charging, flying, and explosion of the Fire Star

3) Black Star:

The Black Star is an enemy unit. When the character touches it, an explosion

effect will be shown and the character's HP will be deducted. The color combination of

the black star is black and red, which is the classic combination that indicates danger, and

the explosion effect implies the character is hurt (Totten, 2014). The design concern is ​ ​ that players might not know this is a dangerous sign, so text instruction will be included

in the game. The visual effects of the Black Star and its explosion are shown in Figure 8.

Hao Tian Thesis, Game Science & Design, 2020 18 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

Figure 8. Black Star and it’s explosion (circled). Bad bully word shows as well

4.2.2.4 Interactable Items

In the game, players can interact with all the game objects, not only the most

important game objects, mirrors, but also other things like stars, windmills and plant pots.

All interactable objects have specific functionality, and many of the functions have

special visual effects that are displayed when the function is evoked by players. The

following game objects were designed for this game project:

1) Toy Windmill

The Toy Windmill (Figure 9) is one of the first game objects that the team

designed. The toy windmill serves as a checkpoint: when the player walks to the

toy windmill, the windmill toy spins and the game manager updates this spot as

the latest spot that player checked. So when the player dies later, the game

manager will restart the game and revive the character at the checkpoint. The toy

windmill has probably the easiest animation and visual effect, which tells the

player they have reached the checkpoint by spinning with some shining dust

flying, a vivid indication of game progress without any text instruction.

Hao Tian Thesis, Game Science & Design, 2020 19 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

Furthermore, using toy windmills are also thematically appropriate to the game

narrative art (Figure 9).

Figure 9. Toy windmill spin animation and visual effect

2) Interactable items: plant pots

In level 3, players can interact with another type of game object: plant pots. Game ​ characters in the real world can hold a plant pot, push and pull to move it, and even

transport it by using parallel mirrors. There are three types of plants: clover, morning ​ ​ ​ glory and cactus. Each plant has its own look and function that corresponds with its ​ shape. Once it is activated by the player, the corresponding animations and visual effects

are displayed (Figure 10). The plants in the game are: ​ ● Clover: it can blow wind to help the character who can glide to fly higher.

The shape of the clover is like a fan. When it is activated, the leaves of

clover spins like a fan and the pixels nearby the leaves are maltipulated to

generate a blur effect. This is to stimulate a high speed spinning fan.

● Morning Glory: it can shoot the character to a higher place. The shape of

the morning glory is like a cannon. When it is activated and the character

Hao Tian Thesis, Game Science & Design, 2020 20 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

approaches it, an explosion effect is triggered. It is to stimulate cannon fire

to give players a powerful feeling of being shot out.

● Cactus: It can bounce all the attacks back to the enemy. The shape of the

cactus is like a wall. When it is activated, the cactus grows and a ring

circle appears around the cactus. It is to show the cactus could protect the ​ ​ character from the enemies’ bullets.

Figure 10. Plants’ visual effects

4.2.3 Real-time lighting effect on Interactable Items

These are light related visual effects (i.e. reflection, light, etc.) change while the

the game is running instead of a static graphic that does not change. This was an optional

visual effect to be used in the game at the beginning, but this visual effect was eventually

applied on the interactable items in level 3, and this visual effect could be the one to

study with. The reason that real-time lighting effect was included in the game is because

some game objects could illuminate themselves and the surrounding area. The purpose of

adding lighting effects on the plant is to tell players they can interact with the plant when

the light shows up above the plant. The lighting effect is also correlated with the level 3

Hao Tian Thesis, Game Science & Design, 2020 21 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

theme which is hope. It could be an indication that helps players to play the game with

better experiences from both gameplay and aesthetics perspectives.

This kind of visual effect is also common in many 2D games which create an

imaginary magical world (Lidholt, 2015). However, since that are subliminal effects ​ ​ would probably be ignored by players (Maureira et al., 2015), this lighting effect was ​ ​ designed to be noticeable in order to tell players if they are close enough to the plant to

activate it (Figure 10). When the character gets close enough to a plant pot, the light

above the plant pot will show up and the green star will move above the plant.

This technique uses Lindholt’s concept (Lidholt, 2015): the lighting effect on here ​ ​ is not only a texture, the color of the leaves changes based on the plant’s position under

the light. When the animation of the plant causes the leaves to move, the pixel on the

leaves will reflect the light in real time instead of adding a texture on the plant (Figure

11).

Figure 11. lighting visual effects when character close to the plant

Hao Tian Thesis, Game Science & Design, 2020 22 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

4.2.4 Other Visual Effects

Many other visual effects are used for decoration and to give players hints about

the game progress. For example, some white butterflies are placed at multiple places on

the platforms to tell where the character has travelled. When the character touches the

butterflies, they will fly away and will not come back even if the character travelled here

again. This animation and visual effect is meant to help players track their gaming

progress, and from the aesthetics perspective. The white butterflies are also a perfect fit

for the game’s art style (Figure 12).

Figure 12. White butterflies idle and fly away

Other to informative effects, there are many decorative visual effects that are

present for aesthetic reasons. For example, the dramatic battle scene that is created by

various mechanics, such as using the cactus to bounce all the enemies bullets back to the

enemies to generate a great fight scene (Figure 13). This combination of game mechanics

could generate great scenes, which attract players from multiple aspects.

Hao Tian Thesis, Game Science & Design, 2020 23 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

Figure 13. Great combat scene by using cactus to bounce bullets back to enemy

Furthermore, at the end of level 1 and 2, a giant tree with many shining stars

floating around it and some other visual effects combination will appear (Figure 14).

Putting these visual effects at the end of the level is meant to give the players a strong

sense of achievement. Furthermore, the star in the jar is also a hint about what the play is

going to play at the next level.

Hao Tian Thesis, Game Science & Design, 2020 24 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

Figure 14. Tree shows in end of level 1 & 2

5 Result

After two formal playtests and a few informal playtests, about 20 data sets were collected. Each playtester filled out the survey, and for some of them interview and think-out-loud data were also collected. Unfortunately, due to each player having different play styles, think-aloud data was not collected from all players because many playtesters were too focused on playing to talk through the game. However, on the other hand, this could also imply the game is enjoyable and the play experience is good.

To study how players feel about each visual effect in the game, the surveys, interviews and think-aloud data were coded following Christians’s study The logic and aims of qualitative ​ ​ research (1989) and knowledge from Northeastern University course GSND 5130 Mixed ​ Research Methods for Games as guideline. The structure of the qualitative data was created based on the feedback (survey, informal interviews, Think-Aloud) from the playtesters about each visual effect, the feedbacks were categorized by either positive or negative in Table 1.

Visual Effects Positive Feedback Negative Feedback

Figure 3 & 4: - Glass-like - Emmm

Hao Tian Thesis, Game Science & Design, 2020 25 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

Gate mirror & - Transfer - Floating blue paper floating mirror - Another world, inside pieces world

Figure 5: - In mirror area - Abstract Parallel mirror light - Reflection

Figure 6: - Teleportation, transport, - Shoot out Parallel mirror shifting transportation - Move to opposite point

Figure 7: - Cool, good, great, perfect Fire star visual - Weapon effect

Figure 8: - Dangerous - Enemy? Black star visual - Hurt - Seems harmless effect - Different shape is better

Figure 9: - CheckPoint, savepoint - Don’t care Toy windmill - Don’t know

Figure 10: - Represent function well - Cactus is abstract (3 Plant’s visual participant said this) effects

Figure 11: - Can interact - Didn’t notice (2 participants light visual effects - Wake up said this) - Hint and guide - Growing - Illuminate

Figure 12: - When Meet, fly away - Don’t know White Butterflies - Landmark - Didn’t notice - Hint to go - Undiscovered area - Need to follow

Figure 13: - Dramatically - Am I attacking? Combat Scene - Great - Safe

Figure 14: - Accomplished - Ignored Tree - Satisfaction - Happy - End of the level

Hao Tian Thesis, Game Science & Design, 2020 26 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

Table 1. Coded qualitative data

6 Discussion

By counting the number of bullet points on each side, it is fair to say that with the visual effects, most playtesters understand the mechanics and rules easier. However, some visual effects help the playtesters understand the mechanics, but some visual effects are not adequate to help playtesters to understand the mechanics, such as parallel light (Figure 5) and the cactus visual effects (Figure 10). Some of the visual effects are appropriate to be used on the game object, such as explosion of the black star (Figure 8), but according to feedback, the shape of the black star is too confusing to playtesters to identify that is something that will hurt the character, because the other star-shaped objects in the game are usually useful items instead of something that deducts HP. So if tutorial text was added when players see the black star for the first time, many playtesters think this could solve the confusion. On the other hand, it is worth coming up ​ with a different design for things that are supposed to be dangerous.

According to Table 1, visual effects that support the key game mechanics generated more positive feedback. For instance, the visual effect of the fire star received no negative feedback from playtesters (Figure 7). Most playtesters give high evaluation about the visual effects of the fire star. From some informal interviews, the playtesters mentioned that charging and shooting out the fire star is a satisfying process, especially when the fire star is fully charged. The interview and survey results showed the visual effect of the fire star has delivered the designer’s intention effectively. Another visual effect that had a similar effect was the lighting effect on the plants (Figure 11). Most players realized that the light above the plant was an important ​

Hao Tian Thesis, Game Science & Design, 2020 27 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences indication that the player could interact with the plant. The light also illuminates the surrounding area, which creates a good aesthetic feeling.

Some subliminal visual effects that also work with game mechanics did help improve ​ ​ player experiences. For example, the visual effects that relate to the parallel mirror (Figure 5 &

6) helped the playtesters to understand the mechanics. More than that, playtesters also used the words like “reflection” when the character is in the mirror area and “shifting” when the parallel transportation happened. Those words imply that the players understand the metaphors of the ​ game. Another subliminal visual effect is the white butterflies (Figure 12). The mechanics of the ​ white butterflies was interpreted accurately its animation and visual effects. On the other hand, the white butterflies did not seem to attract playtesters on the aesthetic aspect; no playtesters mentioned anything about the art of the butterflies other than it’s mechanics.

One interesting finding from Table 1 is the visual effects that are not related to the game mechanics also provide positive aesthetic feelings to playtesters. The combet scene (Figure 13) and tree at the end of level (Figure 14) delivered a strong feeling of involvement in a drastic combat and a sense of achievement. This kind of visual effects has nothing to do with gameplay, but it improves the play experience from an art perspective, which evokes players’ psychological reactions.

Despite most visual effects in the game receiving many positive evaluations from the playtesters, some visual effects were ignored or even misunderstood by the player. The floating broken glass pieces (Figure 3 & 4) is the iconic visual effect in the game. Many but not all playtesters recognized and understood the concept intended by the designers. Some visual effects even confused playtesters, such as the Black Star (Figure 8). The reason that many playtesters

Hao Tian Thesis, Game Science & Design, 2020 28 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences were confused is because the shape of the black star looks harmless, but not the explosion visual effect of the black star. This may have been due to the fact that all the other stars in the game have a positive effect in terms of gameplay. The user of an alternative shape for harmful or dangerous objects may remedy this problem.

7 Reflection

After reviewing two formal playtests and the survey feedback, some shortcomings could be improved in order to obtain better study results. Despite the study being influenced by

COVID-19, which limited our ability to collect firsthand in-person feedback, there are some things that can still be improved for better study result. The development team discussions have concluded several points that could be improved to obtain more useful data in the future. The points include:

1. Playtest time scale is too long, each playtester has to spend 20 to 30 minutes to play

through one level, and complete game playing time takes about 1 hour. Due to the time

scale, it is better to divide the game to three parts and have a group of participants who

can continually test the game from level 1 to level 3. It could be more efficient if each

participant can play the game on their own time and record the voice and eye tracking

data during the playing. In this way, firsthand data can still be collected and could be

used for future studies. Furthermore, the design team could explore how to combine

puzzles and visual effects to reduce the play time.

2. The questions could have been less leading, which could result in more objective answers

from participants. Questions that include presumptions should be avoided, such as telling

Hao Tian Thesis, Game Science & Design, 2020 29 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

participants what this visual effect is or what it represents. Avoiding presumptions within

the questions could result in less biased responses from participants.

3. Survey questions need to be refined and some of them need to be redesigned in order to

collect better data about how participants feel about each visual effect instead of just

knowing what each visual effect means. In the past two formal playtests, many

playtesters wrote in the survey about what a visual effect does but didn’t write how they

felt about it from an aesthetic aspect. Playtesters understanding each visual effect could

be a good sign of having an immersive play experience; however, the aesthetic aspect is

also an important part of play experience, so the study needs to find a way to collect more

data about this. Additional interviews could be arranged in order to obtain more data.

4. In a future study, questions should be asked immediately after the participants finish

playing or providing feedback. It is significant to know their ideas about what the

designers should do in order to improve the visual effects in the game. The feedback and

more detailed feedback will be collected and probably coded to find the orientation of

improving the study work.

8 Conclusion

This thesis studies how to apply visual effects in 2D games to make an immersive play experience. By examining the information obtained from the survey results and the interviews, the game designers were able to understand how each player describes each visual effect and its purpose in the game. The study concentrated on playtest participants’ opinions about each visual

Hao Tian Thesis, Game Science & Design, 2020 30 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences effect in the game to conclude what aspects graphic designers and game designers should consider in applying visual effects in the 2D game.

From the result and discussion section, it is reasonable to say that combining visual effects and game mechanics together is more likely to generate more immersive play experiences. Players who can understand more about the game are more likely to have a better play experience (Crawford et al., 2018). So following this standard, the visual effects in the game did help playtesters understand the game better, which leads us to conclude that combining visual effects and game mechanics is a useful design guideline. On the other hand, designing visual effects for non-essential game mechanics or just for decoration should be avoided unless the designers want to deliver specific feelings to players.

Using light and other properties that are usually inherent by 3D games in the 2D game ​ can generate better play experience. The game project has a z-axis when travelling between the in-mirror world and real time lighting effect, which receive positive evaluations from playtest participants. Future research looking at the impact of 3D-like effects in 2D games would also ​ provide valuable insights into the relationship between effects and gameplay.

Hao Tian Thesis, Game Science & Design, 2020 31 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

References

Au, K. C. (2014). Animation: 2D versus 3D and their combined effect (Unpublished bachelor’s ​ ​ thesis), Massachusetts Institute of Technology, Cambridge, Massachusetts, USA.

Benson, J. (2015, March). Animating Ori and the Blind Forest. Symposium conducted at the ​ Game Developers Conference 2015, Moscone Center, San Francisco, California.

Byl, P. D. (2015). A conceptual affective design framework for the use of emotions in computer game design. Cyberpsychology: Journal of Psychosocial Research on Cyberspace. ​ ​ Christians, C. G., & Carey, J. W. (1989). The logic and aims of qualitative research. Research ​ ​ methods in mass communication, 354–374.

Crawford, G., Muriel, D., & Conway, S. (2019). A feel for the game: Exploring gaming ​ ‘experience’ through the case of sports-themed video games. Convergence, 25(5–6), ​ 937–952.

Geslin, E., Jégou, L., & Beaudoin, D. (2016). How Color Properties Can Be Used to Elicit Emotions in Video Games. International Journal of Computer Games Technology. ​ ​ Hölttä, L. (2018). Effects of Art Styles on Video Game Narratives (Unpublished master’s thesis), ​ ​ ​ University of Turku, Turku, Finland.

Hudon, M., Pagés, R., Grogan, M., Ondřej, J., & Smolić, A. (2018). 2D shading for cel ​ animation (Unpublished doctoral dissertation). Victoria, BC, Canada. ACM, New York, NY, ​ USA.

Kim, H. R., Angelaki, D. E., & DeAngelis, G. C. (2016). The neural basis of depth perception from motion parallax. Philosophical transactions of the Royal Society of London. Series B, ​ Biological sciences. ​ Knez, I., & Niedenthal, S. (2008). Lighting in Digital Game Worlds: Effects on Affect and Play Performance. CyberPsychology & Behavior. ​ ​ Lidholt, V. (2015, March). Advanced Visual Effects in 2D Games. Symposium conducted at the ​ Game Developers Conference 2015, Moscone Center, San Francisco, California.

Hao Tian Thesis, Game Science & Design, 2020 32 Integrate Visual Effects into 2D Platformer Games to Enhance Play Experiences

Mattila, M. (2018) Visual Effects for a 3D Action Game (Unpublished bachelor’s thesis), Kajaani ​ University of Applied Sciences, Kajaani, Finland.

Maureira, M.A., Rombout, L.E., Teernstra, L., Speek, I.C., & Broekens, J. (2015). The influence of subliminal visual primes on player affect in a horror computer game. 2015 International ​ Conference on Affective Computing and Intelligent Interaction (ACII). ​ Rodrigues, É. O., & Clua, E. (2015). A Real Time Lighting Technique for Procedurally Generated 2D Isometric Game Terrains. Entertainment Computing - ICEC 2015 Lecture ​ Notes in Computer Science. ​ Roettl, J., & Terlutter, R. (2018). The same video game in 2D, 3D or virtual reality – How does technology impact game evaluation and brand placements? Plos One. ​ ​ Totten, C. W. (2014). An Architectural Approach to Level Design. Boca Raton, FL: CRC Press ​ ​ (pp. 373-385).

Hao Tian Thesis, Game Science & Design, 2020 33