Game Development Reference
In-Depth Information
Throughout this chapter, we will examine the case study of
Same Game Gravity
(a game available on six
game
) and look at how we can apply these lessons to our own projects.
Same Game Gravity
is a mind-bending, ball removal puzzle game where you try to remove all of the balls
from a board. Balls can only be removed when they are grouped with others of the same color. The balls
are influenced by gravity. On mobile, you influence gravity by rotating your device, and on the desktop you
have arrow keys.
The
Same
game is not new, but the gravity principle gives it a unique twist. You can rotate the game board
through 360 degrees to change the gravity of the game and consequently, the balls' positions.
The first challenge in the game development was to maintain most of common source code while adapting
it to the device. For instance, the game's gravity is handled by the accelerometer for mobile and tablet
versions, but just the mouse/keyboard for the web version.
The second challenge was to reduce maintenance cycles (bug fixes, features add) and game instance
“deployment.” Reducing the number of steps to move from a
n
to a
n+1
version on different markets is
very important, so we need tools to easily build game packages (in fact, PhoneGap build is a new web
service that satisfies this need).
For
Same Game Gravity
, I developed and used a micro framework I called “WebAppBuilder,” which is a
mashup of tools to perform different game instances “compilation.”
Once we've covered the basics, we will then apply this knowledge to creating a multi-platform chess game
that will run on desktops and smartphones.
The web offers an interesting architecture for making dynamic applications. Web development is usually
split in three parts: HTML, CSS and JavaScript. Let's focus on and independently explain the power of
each—then mix them together to bootstrap our multi-platform chess game from scratch.
Three-part code organization
Web client-side development is about HTML, CSS, and JavaScript. Basically, HTML helps us to describe
the
content
, CSS describes
how that content is displayed
, and JavaScript describes
what the content does
.
It is essential to make the best use of each part and not to blend their goals. The source code separation is
important because it adds modularity for the developer and allows us to be more productive: we only have
to focus on one part at a time and our repository also becomes far more maintainable.
For now we will focus only on client-side parts of a game, but it is also possible to have a web server that
receives, for instance, player scores via asynchronous requests (Asynchronous JavaScript and XML).
HTML, a content language
HTML (HyperText Markup Language) is the language that describes all the content of a web page. Like
XML, it is a
markup language
, meaning it is structured as a tree of tags with content. The current range of
available HTML elements is very rich. It links and structures different resources: images, videos,
