Tilt Game

Fatih Özcelik – faozc14@student.sdu.dk

 

Introduction

This project is a game where the goal is to move the player to avoid enemies by tilting the device.

The project is built using the Xcode IDE, the Swift programming language and the Swift frameworks SpriteKit and CoreMotion.

The goal with the game is to provide good, funny and challenging gaming experience to the users. I think that it is interesting and funny to play a game by tilting the device.

I have spotted some bad things regarding design and gameplay of some game apps similar to my idea and I wish to develop a game that solves these issues. An example of such a game is Tilt to Live HD.

Figure 1: Tilt to Live HD

The bad things I have spotted in this game and how I want to solve them are as follows:

Design:

My idea is to make use of colors in a way that makes it clear and easy to see all the game-objects and the game-map. As it is in Tilt to Live, the background is a bit dark at some places and some other objects in the game are also a bit dark colored, and this sometimes make it hard to see what’s going on when playing the game

The player in the game has a grey color and it just doesn’t appear clearly. Especially when explosions and such kind of things happens, sometimes the player can’t be seen at all.

And also I think one of the most important thing about this game is the score. Therefore I think that it is important to show the score clearly in-game, and also at the start menu and when you lose the game. The score in Tilt to Live is not shown very clearly, neither in-game nor after the game, and at the start menu, it is not shown.

Gameplay:

The player should have health and should take damage from the enemies when it is hit. I In the game Tilt to Live, you die and lose the game immediately when you are hit by an enemy/obstacle. Therefore, when too many enemies and obstacles appears on the game map, it becomes very hard to survive.

I want to have pick-up items, like different weapons, which you can have in a bag, and use them when you need them by tapping on a button. In the game Tilt to Live, there are also a pick-up weapon, but it shoots automatically after 1 or 2 seconds after pickup.

 

Methods and materials

Brainstorming

Brainstorming was used at the beginning of the project. I brainstormed on ideas of apps I wanted to develop.

Researching

I have done some researching. First of all, I researched for apps similar to my idea. To see what I could do better I tested and analyzed the apps. I also analyzed the target group of the app, because it’s really important to know who will potentially use your app. This is important to know before developing the app, so e.g. design and gameplay can be formed with the knowledge of the target group in mind.

Conceptual design

A model of a potential conceptual design was not made but I did some considerations about the conceptual design and wrote them down. This was the foundation of the first prototype.

Prototyping

The first prototypes were made as paper sketch and used in the first evaluation. The next prototype was a functional game.

Evaluation

The first evaluation based on the first prototypes aimed to gather information about what users might think about the design of the app. So how good or bad it looks and how hard/easy it is to navigate in the app. This evaluation had some limitations because the game itself could not be played and tested, because the prototypes was just sketches on papers.

Requirements

Based on my goals and the results from the evaluations the requirements specification was made.

Implementation

The game is implemented using the Swift programming language and the Swift frameworks SpriteKit and CoreMotion.

Results

Brainstorming

The results of my brainstorm on app ideas:

  • Auto Quiz Generator – scrape text from web and/or use OCR to scan for example book pages or newspapers, then generate quiz-questions based on the text.
  • Labyrinth game, where you have to tilt the device to move a ball into a hole
  • A game, where you control a car, a motorcycle or a helicopter by tilting the device
  • A game where you have to find words. The letters can be mixed by shuffling the device.
  • Alarm clock where the alarm can be stopped by moving your hand over the device (using proximity sensor).

From these ideas I decided to work on a game, where you have control the player by tilting the device.

Researching

The genre of my game is arcade and action. I found out that these kind of games, like action, arcade and strategy games, are most popular among males aged 10-50.

Source: http://developers.magmic.com/demographic-breakdown-casual-mid-core-hard-core-mobile-gamers/

This can be seen at above chart for the game Clash of Clans.

To compare it, I looked at another game, Bejewled Blitz, which is a puzzle game.

Source: http://developers.magmic.com/demographic-breakdown-casual-mid-core-hard-core-mobile-gamers/

So, it seems like this kind of puzzle games are more popular among females.

But of course, there could be other factors than the genre of the game, that have impact on the genders and age-groups of the players. For example, the graphical design in these games means also a lot.

Conceptual design

When thinking about suitable metaphors/analogies that will make the game easier for the user to adopt, I came up with 3 different conceptual design ideas:

  • The game can be designed for example like a space-shooting game, where the spaceship has to avoid asteroids and enemy spaceships which for example can be UFO’s.
  • The player could be a car, which you have to drive around and avoid obstacles.
  • A simple square/circle formed player and corresponding enemies.

Prototyping

Prototype V1

The conceptual design ideas ended up as prototypes as paper sketches. I decided to work on 3 screens, namely Homescreen, Playscreen and Game over Screen.

Figure 2: Homescreen 1

Figure 3: Homescreen 2

Figure 4: Homescreen 3

Figure 5: Playscreen 1

 

Figure 6: Playscreen 2

Figure 7: Playscreen 3

  

Figure 8: Game over screen 1                            Figure 9: Game over screen 2

 

Prototype V2

In the next functional prototype the gameplay screen was implemented. A few core elements was implemented: the player, movement of the player, the walls forming the map and collision between player and walls.

 

Evaluation

Results of evaluation of prototype V1

Two users gave feedback on the first prototypes. They came with comments and suggestions and, they rated the prototypes from 1 to 10 based on the overall design and the user experience.

Some things they liked was for example the crown symbol used to show the high score. Some of the screens was a bit confusing and others was easy to understand. Also, there were suggestions like e.g. adding a Facebook-share button.

 

Results of evaluation of prototype V2

Because of the game was not fully implemented yet, the feedback was very little. It was a bit hard to understand what to do in the game, because the only thing that could be done was to move the player around. The user said that it was a bit hard to move the player by tilting the device.

 

Requirements

The requirements specification:

  • You should be able to move the player by tilting the phone.
  • There should be enemies and/or obstacles
  • There should be pick-up items, which can be used by the player to attack the enemies
  • There should be a high score
  • The player should have health
  • There should be a Facebook-share button so you can share your score with your friends

 

Implementation

As it can be seen in my results from my evaluation of the first low fidelity prototype, I decided to make 3 screens, namely a home screen, a play screen (in which the game is played) and a game over screen. When you create a new game-project in Xcode, it generates some useful files for you. I started out to create the gameplay screen using the generated files GameScene.sks, GameScene.swift and GameViewController.swift.

Then I created two views, one for the home screen and one for the game over screen. Then after some research, I found out that when we make Swift games with the framework SpriteKit, normally, we will have SKScenes and switch between the scenes instead of having views and switching between them. Therefore I was in trouble when trying to switch to a game-over view when the game was over. I leaved the Homescreen as it is, because I had no problems switching from the Homescreen-view (with a play-button) to the GameScene. But I had to remove the Game Over Screen view, and instead replace it with a Game Over Scene.

When the game is over, the game over scene is assigned to a gameOverScene variable, the transition animation is set and then the game over scene is presented:

let gameOverScene = GameOverScene(size: self.size, highScore: highScore)
let transition = SKTransition.fade(withDuration: 1.0)
view?.presentScene(gameOverScene, transition: transition)

 

Then from the GameOverScene, the GameScene is represented back in a similar way, if the user taps the screen.

The player is moved by tilting the device. This is achieved using the accelerometer in the device. To access and use the accelerometer, the framework CoreMotion is used. From this framework, the object CMMotionManager is used to create a motion manager object:

let motionManager = CMMotionManager()

This object can start and manage motion services like the accelerometer:

//Start accelerometer
motionManager.startAccelerometerUpdates()
//Every 0.1 second, grab the data from device
motionManager.accelerometerUpdateInterval = 0.1

The gravity is set to a vector, which has deltax as acceleration.x and deltay as acceleration.y. This means that the gravity is “moving” acceleration.x in x-direction and acceleration.y in y-direction. So the gravity is set to move according to the x and y values of the accelerometer, and this makes the player move when the device is tilted:

motionManager.startAccelerometerUpdates(to: OperationQueue.main) { (data, error) in 
    self.physicsWorld.gravity = CGVector(dx: data!.acceleration.x * 10, dy: data!.acceleration.y * 10)
}

The player and enemy entities are created as sprites. With the SpriteKit framework in Swift, sprites are represented by SKSpriteNode objects. The enemy objects are put into an array.

Discussion

I regret choosing to build a game in Swift because it was not a part of our curriculum. It was a bad idea because I just started learning the fundamentals of Swift this semester and while I haven’t got much experience in the fundamentals yet, I think I bit off more than I could chew. The downside is I couldn’t reach my initial goal and all my initial requirements are not implemented. As stated in the introduction chapter, my initial goal was to differentiate from existing/similar apps (e.g. Tilt to Live HD) by design and gameplay. While some of the goals are reached, not all of them are completed.

It was maybe not a good idea to build a Swift game at this stage, but on the other hand, I learned a lot so this was a good upside, even though I’m not quite pleased with the results of my project. So, overall I learned a lot.

The way I would continue my project from here is to implement all the missing parts of the game.

Code & demo

Link to code at Bitbucket: https://bitbucket.org/iosprogrammingsdu/tilt-game

Link to demo video: https://drive.google.com/file/d/1bBgEBIO6rA5jRvvG2_vO87zhyOTNNZJW/view

Resources

https://www.raywenderlich.com/

https://www.youtube.com

https://stackoverflow.com

https://developer.apple.com/documentation/

 

 

Leave a Reply