O'Reilly logo

HTML5 Game Development from the Ground Up with Construct 2 by Roberto Dillon

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

143
Chapter 10
Turky on the Run
Development
D
T   Run is going to be a bit more compli-
cated than the two other games we have worked on so far: while
we managed to keep Moon Wolf and Kitty & Katty within the 100 events
limit so that they could be developed on the Construct 2 Free Edition, the
full version of Turky on the Run we can nd on the Apple AppStore and
BlackBerry World counts more than 600 events!
For this reason, here we will focus on describing how to achieve the actual
gameplay only, leaving the other parts of the game, like splash screens, navi-
gation between layouts, etc., as a simple exercise: this shouldnt be a problem
by now since these tasks would involve essentially the very same steps we did
when developing Kitty & Katty. e gameplay alone, though, will still need
more than 100 events overall, so, if developing on the free edition, you may
have to try dierent features individually in independent projects or sim-
plify certain aspects of the game, for example by reducing content. Specic
places where this can be done will be pointed out as we progress.
Our step-by-step development will be subdivided into the following
sections:
1. Layout and shuing, where we place the dierent tiles to form the
grid and shue them around.
2. Moving tiles, where we are going to allow the player to move a tile
into the empty area by clicking on it or touching it. We will also
144  ◾    HTML5 Game Development from the Ground Up
implement a tile highlighting mechanism to point out the tiles that
can actually be moved.
3. Turky: placement and movement, here we will dene where Turky
starts his adventure and how it moves.
4. Sly, Foxy, and Otto, in this section we will take care of Sly, Foxy, and
Otto and how they should become more dangerous aer each level.
5. Timer and bonus items, where we are going to add dierent bonus
items as well as other elements like a timer.
10.1 LAYOUT AND SHUFFLING
Originally, Turky on the Run was developed with a web browser and the
iPhone 3GS as target platforms, so great care was taken to keep resources
as low as possible and to work on the 3GS low-resolution screen of
480×320 pixels, relying on the up-scaling abilities of Construct 2 to adapt
to other devices. I will maintain the original 480 × 320 layout size here, but
if you prefer, feel free to design for a higher resolution and scale all values
accordingly.
Once our new empty project is open and the layout size set, let’s rename
the Layer 0 to “Action,” set its background color to black, and then add
a new layer named GUI, like we did for the other projects. We may also
want to add a Debug layer to display helpful text while the game is run-
ning and monitoring dierent variables.
We saw in the game design document that our maze will consist of a
grid made by four rows and ve columns, making enough room for 19
tiles and one empty space. Specically, we will have tiles of seven dierent
types according to the paths they represent, shown in Figure10.1.
Start by adding a new sprite for each of these and import the graph-
ics accordingly (you can nd these in the downloadable game project le
or draw your own). As usual, name each sprite in a meaningful way, for
example, the crossroad could be t_X, with t standing for “tile,” the vertical
FIGURE 10.1 The dierent tiles that will make up our maze. In the game project
these are named as: t_X, t_V, t_H, t_LD, t_DR, t_UR, and t_LU, respectively.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required