Your first iOS game

This is a preview of the prototype game that we will create:

The prototyping is part of the development process of games, basically we create an extremely simple game to test ideas and mechanics. That is what we are going to do today.

Requirements

• Mac
• Install Xcode
• Some object oriented programming (OOP) experience

Choose your weapon

SpriteKit is a framework to help us to create 2D games. Sprite is anything in the game, from a simple static image, like a floor, to a character with lots of movements.

The SKView is the visible area on the screen. Inside the SKView there are SKScenes that represent our content. We can create a SKScene for each level of the game or even create a SKScene for the menu or to show the game over screen.

Almost every class in SpriteKit is a subclass of the SKNode:

The SKNode class is the fundamental building block of most SpriteKit content. The SKNode class doesn’t draw any visual content. Its primary role is to provide baseline behavior that the other node classes use. All visual elements in a SpriteKit-based game are drawn using predefined SKNode subclasses.

See SKNode class reference to know more.

Project setup

Open Xcode and click in Create a new Xcode project, choose iOS Application Game and click in Next.

Choose the language Swift and name your game and organization as you prefer:

Also select Assets.xcassets and drag and drop from finder the images that we are going to use later. Download them from blue, orange and red.

Keep in mind that you can always play your project. Just click in the play button on the top of Xcode.

If you prefer you can zoom out the iPhone simulator to correctly fit you screen when you play your game:

Creating a floor

Almost everything in our game will be created in the GameScene and the SKSpriteNode is the one to create our floor. So select the GameScene.swift, delete the code generated and create a constant to be our floor like this:

Note that we are using SKSpriteNode which is a subclass of the SKNode and allow us to handle sprites with images, in this case with an image named "blue".

Now we need to setup our floor, so write a method like this:

Creating the player

As we did with the floor, we need to create a node to the player and setup it:

Nice! The floor and the player appear on the screen, but nothing happened. So we need to create a physics body for each one.

The power of the physics body

The SpriteKit gives us a lot of physics techniques to use in our game, but before we need to create a enum to help us to setup the bodies:

We can use common physics roles by adding the SKPhysicsBody to our SKSpriteNode. Now we can be affected by gravity and be able to collide with other nodes.

Now your floor is static and the player falls to collide with him.

Touch me to impulse

The interaction between our game and the user is by touch. When the user touches the screen your square orange player should jump. So we need to apply an impulse to the player, after that impulse it should fall until hitting the floor because the player is affected by gravity.

There is a method in the SKScene that we can use to do that. This method is called when the user touches the screen:

Every hero needs enemies

In order to create more then one enemy and create it per second, we need to create a list of enemies and create a method to add enemies in that list.

It's very similar with the creation of the player and the floor. Note that we override a method called update which is called once per frame.

The result is something like this:

ops

Ops, isn't what we expected. We need to handle the time to add enemies correctly like this:

Game Over

There are a few things to do here. The first one is to detect the collision between an enemy and our player. The second is to present a game over scene.

So to detect the collision we need to add the .contactTestBitMask to our physics bodies and change the game scene to implement the SKPhysicsContactDelegate like this:

Now when two physics bodies contact itself the method didBeginContact is called, so we just need to know if it's the right contact with a conditional:

Now we need to create the game over scene, so add a new file to the group by clicking with the right button in the group and clicking in the "New File…" like this:

Then choose the iOS Source Swift File and save it as GameOverScene.swift.

In this scene we just add a SKLabelNode to add "Game Over" on the screen. We also need to go back to the game scene in order to restart the game. So we need to tell the view to present the scene.

We can add a sequence of actions to present the scene with a nice effect. Check the code bellow:

Now we just need to update the game over method in the game scene to present the game over scene like this:

Play and test it.

Conclusion

So it's quite simple to create games with iOS, you should try other mechanics of games too. If you need you can download the project used to write this post from the github.

Fell free to ping me at twitter to solve doubts or to give feedback.

Thank you =)

Homework:

• add a "jump" label in the middle of the floor
• change the enemies to appear randomly
• change the jump effect to the player be able to jump just once per time