Free Sample
+ Collection

HTML5 Game Development HOTSHOT

Progressing
Makzan

Build interactive games with HTML, DOM, and the CreateJS Game library.
$26.99
$44.99
RRP $26.99
RRP $44.99
eBook
Print + eBook

Want this title & more?

$21.99 p/month

Subscribe to PacktLib

Enjoy full and instant access to over 2000 books and videos – you’ll find everything you need to stay ahead of the curve and make sure you can always get the job done.

Book Details

ISBN 139781849695466
Paperback366 pages

About This Book

  • Create eight different games using HTML5
  • Learn essential games development techniques, such as game loop, animations, and browser storage
  • Follow the project-based approach to build games from start to finish with in-depth explanations on game management

Who This Book Is For

Whether you are familiar with the basics of object-oriented programming concepts, are new to HTML game development, or are familiar with just web design, this project-based book will get you up and running in no time. It will teach and inspire you to create great interactive content on the Web.

Table of Contents

Chapter 1: 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
Chapter 2: 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
Chapter 3: 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
Chapter 4: 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
Chapter 5: 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
Chapter 6: 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
Chapter 7: 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
Chapter 8: 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

What You Will Learn

  • Create DOM-based HTML5 games
  • Use the CreateJS library to build a canvas-based game
  • Create different types of animations that are spritesheet-based, tween-based, and Flash vector-based
  • Modularize game components in JavaScript with object inheritance
  • Store and load persistent game progress in browsers
  • Convert coordinates between the screen and isometric perspective
  • Maintain a hierarchy for game elements to keep the extensibility of the game
  • Learn essential workflows and tools to create game assets easier

In Detail

This book will show you how to create stunning cross-browser games without the need for Flash or other plugins. Learn about Box2D, DOM elements, the EaselJS framework, and more, all providing a foundation of knowledge to expand your game-creating skills. With in-depth explanations and step-by-step instructions, you will finish this book feeling confident about building great games with HTML. Whether you are familiar with the basics of object-oriented programming concepts, are new to HTML game development, or are familiar with just web design, this project-based book will get you up and running in no time. It will teach and inspire you to create great interactive content on the Web.

Authors

Read More

Recommended for You