Game Design

Unreal Engine

Middle
Lesson 10
Infinity Runner

2
 Infinity Runner

Infinity Runner
Infinity Runner is another type of games that requires
players to react quickly. The gameplay is pretty straightfor-
ward. The main character has to run forward along an infinitely
generated world full of dangers and obstacles. Along the way,
she will collect certain items and bonuses for upgrades. Over
time, the running speed may increase, and obstacles become
more difficult.
The most prominent representative of this genre is the game
called Subway Surfers. It was developed in 2012 by the Danish
companies Kiloo and SYBO Games. Here, the players control
a character who attempts to escape from a policeman and his
dog by running along the railway lines (Figure 1).

Figure 1
Let’s use Unreal Engine 4 to create a similar game and un-
derstand the logic of its mechanics. At that, we will try to ad-
here to the style of another game, Fortnite. For example, in
our project, the character will collect loot boxes (Figure 2).

3
Lesson 10

Figure 2
First of all, we will need a third-person Blueprint. Let’s
change the position of the standard camera pointed at the char-
acter’s back. In the Subway Surfers-like games, the camera
looks top down. To achieve the same effect, open the Third-
PersonCharacter Blueprint and select the parent object Cam-
eraBoom that contains a camera. After this, go to the settings
window and increase the value of the Socket Offset along
the Z-axis to 100 (Figure 3).

Figure 3
In runners, the character moves forward automatical-
ly, without the player’s intervention. To make your character
move forward constantly, go to Event Graph, find the Move-

4
 Infinity Runner

ment input branch, and delete the InputAxis MoveForward

(Figure 4).

Figure 4
You should replace it with another node—Event Tick to
make the animation of the character running be calculated
in every frame (Figure 5).

Figure 5

5
Lesson 10

Now you can run your game for testing: our character
must run forward nonstop.
Next, you need to set up the logic of turning. For this,
create a new variable CanTurn of the Boolean type (Figure 6).

Figure 6
Another variable that you have to create is DesiredRo-
tation with a special Rotator type. It rotates the character in
the required direction (Figure 7).

Figure 7
The character should react to button commands, so add
the Can Turn value to the node of the A key. This key controls
the turn to the right by default (Figure 8).

6
 Infinity Runner

Figure 8
Also, to set the angle and direction of the rotation cor-
rectly, add the Desired Rotation node to the CombineRota-
tion function. Set the rotation value to -90° along the Z-axis,
that is to the left (Figure 9).

Figure 9
After this, connect two branches using the Desired Rota-
tion nodes with the Set value (Figure 10).

Figure 10

7
Lesson 10

Create the same script for the D key that rotates to the right.

The only difference is that the rotation angle should be set to
90° (Figure 11).

Figure 11
In the end, connect both scripts using the Can Turn nodes
(Figure 12).

Figure 12
If you need to group the finished branch quickly, you can
use the comment function. All you need to do is select all
the nodes you want and press C. As a result, a special group-
ing frame will be created that you can name according to its
content (Figure 13).

8
 Infinity Runner

Figure 13

Figure 14
The next step is to program the process of rotation itself.
For this, create Custom Event and name it TurnCorner. Next,
connect the nodes Get Control Rotation and Desired Rota-
tion. If their values do not equal to the set number, the Set

9
Lesson 10

Control Rotation function will be triggered, and the charac-

ter will turn.
Let’s additionally set the time that the character spends on
this action. To do this, add the RInterp To node to the script.
This node will access the World Delta Second value. Also, set
the rotation speed (Interp Speed) to 10, for example. Figure 14
shows the finished script.
Add a link to this event to the Event Tick script in the Char-
acter Blueprint (Figure 15).

Figure 15
The next thing we should do is form a track that will end-
lessly spawn thus expanding the boundaries of the world.

Figure 16

10
 Infinity Runner

For this, we are going to create a new Actor Blueprint and

rename it to BP_FloorTile (Figure 16).
Open the editor, add a Static Mesh to it, and name it Floor.
Set its Scale values along three axes to 10, 10, 0.1. These pa-
rameters allow turning mesh into a plane (Figure 17).

Figure 17
Use a cube as the object. Also, set its texture to wooden
to create an illusion that the character is running on a wood-
en floor (Figure 18). And we should not forget that the style
of our game is Fortnite. If the standard textures do not cor-
respond to the set style, you can choose a suitable variant on
the Internet.

Figure 18

11
Lesson 10

In addition to the floor, you should create boards for

the character does not accidentally fall off the track. For this,
duplicate the Floor component twice, rename new objects to
Wall, and change the Scale values to get short vertical walls
(Figure 19).

Figure 19
Place them at the edges of the platform, as shown in Fig-
ure 20.

Figure 20
The next component you should add is an Arrow. This el-
ement will point at the spawn of the next section of the road.

12
 Infinity Runner

Rename it to AttachPoint and shift it along the X-axis by

1000 points (Figure 21).

Figure 21
After this, create a new function GetAttachTransform
with the output parameter of the same name—Transform
(Figure 22).

Figure 22
This function calculates the Attach Point position, where
every next platform must attach to the previous using the Get-
WorldTransform node (Figure 23).

Figure 23

13
Lesson 10

First of all, before we test the game, let’s create a new lev-

el. Click File => New level (Figure 24).

Figure 24
Select a default project because all required elements will
spawn in the scene (Figure 25).

Figure 25

14
 Infinity Runner

Next, open the game Blueprint: ThirdPersonGameMode

(Figure 26).

Figure 26
Create a new AddFloorTile function that will spawn new
sections of the road (Figure 27).

Figure 27

Figure 28

15
Lesson 10

Add the Spawn Actor from Class of the BP_FloorTile

type to this function. Also, create a new local variable Next
Spawn Point (RMB => Promote to Variable) and connect it
to the Spawn Transform pin (Figure 28).
In turn, SpawnActor should address the object itself,
the BP_FloorTile, and add it in the next spawn point (Fig-
ure 29).

Figure 29
Also, create a link to this function in the BeginPlay event
so that the script is triggered right after the game start. Also,
add the ForLoop node that allows spawning multiple parts
of the track at the same time. For this, write the maximum
number of the created objects in the Last Index pin, let it be
9 (Figure 30). Do not make this number too big because this
action requires many computer resources.

Figure 30
Next, go back to BP_FloorTile and add a new Box Colli-
sion component named EndTrigger to it. After the character

16
 Infinity Runner

crosses this area, he can make a quick turn either to the right

or left (Figure 31).

Figure 31
For this component, set the Box Extent parameters along
the axes Y=500 and Z=200. Also, shift the box along the X-axis
by 1050 points to place it at the end of the track (Figure 32).

Figure 32

17
Lesson 10

Additionally, change Collision Preset to OverlapOnlyPawn

(Figure 33).

Figure 33
After this, create the On Component Begin Overlap event
for this component (Figure 34).

Figure 34

Figure 35

18
 Infinity Runner

This node must access the character and the GameMode

Blueprint and add a new block at the end of the existing track
(the Add Floor Tile node) (Figure 35).
In order to avoid cluttering the level, add the DestroyAc-
tor node to the script; it will delete all the track sections that
the player has already passed. And you should take into ac-
count the time that the character needs to pass the track. If
blocks are deleted too fast, the character will simply fall off
the track. This problem is easily solved by the Delay node set
to 2 (Figure 36).

Figure 36
Now create a new Actor Blueprint for the collectible items.
Rename it to BP_Item (Figure 37).

Figure 37
Go to the editor of this Blueprint and add a new Stat-
ic Mesh. As stated earlier, we are working on a Fortnite-like

19
Lesson 10

game. This is why we are not going to use regular coins but in-
stead loot boxes. You can easily find this model on specialized
websites. Also, do not forget to texture your mesh (Figure 38).

Figure 38
Set the Collision Preset for this object—OverlapOnlyPawn
(Figure 39).

Figure 39
You can also add the RotationMovement component to
the hierarchy. This element is responsible for mesh anima-
tion. As a result, after you run the game, all boxes will rotate
around their axis (Figure 40).

20
 Infinity Runner

Figure 40
Now set up the spawn area of objects. Go to BP_Floor-
Tile, add one more component Box Collision, and rename it
to BoxArea (Figure 41).

Figure 41
Place it in the center of the platform and change its di-
mensions so that the spawn area takes almost the whole road
(Figure 42).

Figure 42

21
Lesson 10

Next, create the SpawnBoxes function (Figure 43).

Figure 43
Add the Add Child Actor Component node of the BP_
Item class to it (Figure 44).

Figure 44
To make new boxes spawn randomly on the road, create
the following script. Add the Box Area component to the tar-
get nodes Relative Location and Box Extent and connect them
using the Random Point in Bounding Box function. Connect
the finished script with the Relative Transform pin (Figure 45).

Figure 45

22
 Infinity Runner

Increase the number of boxes that will appear on the road

at the same time by adding the ForLoop node with the Last
Index value equal to 3 (Figure 46).

Figure 46
The final step is to add spawn nodes (Set Spawn Points
and Spawn Boxes) to the Construction Script (Figure 47).

Figure 47
As a result, if you run the script simulation several times,
boxes will randomly spawn on the plane.

Figure 48

23
Lesson 10

Make the character pick up boxes at collision by adding

a new variable TotalBoxes of the Integer type to its Blueprint
(Figure 48).
After this, create the AddBox function (Figure 49).

Figure 49
Add the Total Boxes to it. Make sure that the number of
the collected boxes increases by 1 every time upon pickup.
The script that solves this problem is in Figure 50.

Figure 50

Figure 51

24
 Infinity Runner

To make the new function work, create the On Compo-

nent Begin Overlap event in the Box Blueprint (Figure 51).
Connect this event with the nodes Character and Add
Box (Figure 52).

Figure 52
At the end of the script, add the DestroyActor node that
will delete collected boxes from the Viewport. You can also
add a sound effect that will play when the character collects
an item. For this, simply add the Play Sound at Location node
and select the suitable sound from the library (Figure 53).

Figure 53
Now let’s visualize the counter of the collected items. Cre-
ate a new folder and add the widget Blueprint to it. Rename
it to RunHUD (Figure 54).

25
Lesson 10

Figure 54
In this Blueprint, create a hierarchy similar to that in Fig-
ure 55. Place all widget elements in the upper left corner of
the Viewport.

Figure 55
The number of collected boxes must change quickly. Let’s
create a logical connection between the relevant numeri-
cal widget and the character’s actions. For this, select it, go
to the settings panel — Content => Bind => Create Binding
(Figure 56).

Figure 56

26
 Infinity Runner

Connect the Character node and the target Total Boxes

node to the function. The value of the latter will convert to
a number. The finished script is shown in Figure 57.

Figure 57
The last step is to display the counter. For this, go to
the GameMode Blueprint and connect two nodes to the Be-
ginPlay event: Create a Widget of the RunHUD class and Add
to Viewport (Figure 58).

Figure 58

Figure 59

27
Lesson 10

Now let’s make the path of our character vary. To do this,

create a child class of the BP_FloorTile by right-clicking on
it (Figure 59).
Add a new Static Mesh to it. This will be a ramp that
the character should use to go up. Connect the relevant mod-
el to it (for example, Shape_Wedge_B) and texture it (Figure
60). In your project, you can use any model and materials that
make your game as close to Fortnite as possible.

Figure 60
Transform the ramp so that its area coincides with the area
of the track and place it at the end of the road (Figure 61).

Figure 61
You should also move AttachPoint and EndTrigger as in
Figure 62.

28
 Infinity Runner

Figure 62
After this, go to the GameMode Blueprint, the AddFloor-
Tile function. Let’s add a new object class—a FloorTiles array
variable—to the SpawnActor node. The road sections must be
selected randomly, so complete the script with the Random
Integer in Range node (Figure 63).

Figure 63
After this, compile the Blueprint and activate the Class
Defaults option on the top tools panel (Figure 64).

Figure 64

29
Lesson 10

At that, an element list of the Floor Tiles array will appear

on the right panel. To add a new item, click the + symbol. Af-
ter this, all you have to do is connect the relevant Blueprint
to the array (Figure 65).

Figure 65
Let’s create one more child BP_FloorTile (Figure 66).

Figure 66
Change the ramp position so that the character could go
to the lower level (Figure 67).
Because the array is already created, all you have to do is
add one more item to it and connect the corresponding Blue-
print. Note that the number of array elements is unlimited.
When you create new sections of the road and fill them with
special objects, you can generate a really interesting track
(Figure 68).

30
 Infinity Runner

Figure 67

Figure 68
In the end, implement the logic of obstacles. Remem-
ber the dangers that the Fortnite characters usually face and
add similar objects to the finished game. This can be horri-
ble Husks or crafty traps where the character can accidental-
ly fall (Figure 69).

31
Lesson 10

Figure 69
Now let’s look at a few examples of cool mobile games
that are decent representatives of the Infinity runner genre:
■■ Shred it! (Figure 70);

Figure 70

32
 Infinity Runner

■■ Lara Croft: Relic Run (Figure 71);

Figure 71
■■ Amazing Runner (Figure 72).

Figure 72

33
Lesson 10
Infinity Runner

© STEP IT Academy, www.itstep.org

All rights to protected pictures, audio, and video belong to their authors or
legal owners.
Fragments of works are used exclusively in illustration purposes to the extent
justified by the purpose as part of an educational process and for educational
purposes in accordance with Article 1273 Sec. 4 of the Civil Code of the Rus-
sian Federation and Articles 21 and 23 of the Law of Ukraine “On Copyright
and Related Rights”. The extent and method of cited works are in conformity
with the standards, do not conflict with a normal exploitation of the work, and
do not prejudice the legitimate interests of the authors and rightholders. Cited
fragments of works can be replaced with alternative, non-protected analogs,
and as such correspond the criteria of fair use.
All rights reserved. Any reproduction, in whole or in part, is prohibited. Agree-
ment of the use of works and their fragments is carried out with the authors
and other right owners. Materials from this document can be used only with
resource link.
Liability for unauthorized copying and commercial use of materials is defined
according to the current legislation of Ukraine.