Book Image

HTML5 Game Development Hotshot

By : Seng Hin Mak, Makzan Makzan (Mak Seng Hin)
Book Image

HTML5 Game Development Hotshot

By: Seng Hin Mak, Makzan Makzan (Mak Seng Hin)

Overview of this book

Related Content you might be interested in

Current Title:

Small book image
HTML5 Game Development Hotshot
Seng Hin Mak | Makzan Makzan (Mak Seng Hin)
Jul, 2014 | 366 pages
No titles found
Table of Contents (15 chapters)
HTML5 Game Development HOTSHOT
HTML5 Game Development HOTSHOT
Credits
Credits
About the Author
About the Author
About the Reviewers
About the Reviewers
www.PacktPub.com
www.PacktPub.com
Preface
Preface
Free Chapter
1
Building a CSS Quest Game
Building a CSS Quest Game
Mission briefing
Creating the HTML structure
Managing the game scene
Representing the quest composition
Placing the patterns on the deck
Selecting the pattern
Comparing the player and compositions of the quest
Showing different quests
Adding a countdown timer to the game
Mission accomplished
Hotshot challenges
2
Card Battle!
Card Battle!
Mission briefing
Creating the game scenes
Creating a 3D card-flipping effect
Selecting a card
Adding a power value to the cards
Creating the opponent's card
Building the battle animation
Adding health points to the game
Restarting the game for the next round of battle
Mission accomplished
Hotshot challenges
3
Space Runner
Space Runner
Mission briefing
Managing the scenes
Defining the floor and tiles in the game
Controlling the tiles creation in JavaScript
Using a game loop
Parallax background scrolling
Controlling a player with the keyboard
Determining a collision between the player and tiles
Spritesheet animation
Mission accomplished
Hotshot challenges
4
Multiply Defense
Multiply Defense
Mission briefing
Setting up the canvas and EaselJS
Defining the numbered box
The game loop and falling boxes
Inputs and equations
Removing the boxes
Ending the game
Restarting the game
Replacing the rectangle shape with bitmap graphics
Mission accomplished
A Hotshot challenge
5
Building an Isometric City Game
Building an Isometric City Game
Mission briefing
Designing the game's user interface
Placing the tiles and grid in the city layer
Choosing which building to build
Placing buildings on the floor
Advancing the construction progress over time
Generating coins and diamonds
Collecting pop-up diamonds
Saving and loading the game progress
Mission accomplished
Hotshot challenges
6
Space Defenders
Space Defenders
Mission briefing
Setting up the user interface
Placing the defense buildings
Summoning the enemies
Generating energy
Enemies attacking the buildings
Firing bullets and attacking the enemies
Controlling enemy waves
Loading the bitmap graphics into the game
Mission accomplished
Hotshot challenges
7
A Ball-shooting Machine with Physics Engine
A Ball-shooting Machine with Physics Engine
Mission briefing
Creating a simulated physics world
Shooting the ball
Handling collision detection
Defining levels
Adding a launch bar with power
Adding a cross obstacle
Visualizing the graphics
Choosing a level
Mission accomplished
Hotshot challenges
8
Creating a Sushi Shop Game with Device Scaling
Creating a Sushi Shop Game with Device Scaling
Mission briefing
Making the responsive layout
Decorating the game
Making the sushi
Creating a customer queue
Refilling sushi ingredients
Adding sound effects
Distributing the game
Making the game mobile friendly
Mission accomplished
A Hotshot challenge
Index
Index

Chapter 1. Building a CSS Quest Game

In this project, we are going to build a card quest game using HTML elements and CSS styling. We will also learn how to separate JavaScript logic into modules for clarity. We will build the game from scratch with a basic HTML layout and then represent the composition of the pattern in logic and CSS.

Previous Section
End of Section 1
Next Section