Build an HTML5 Game

A Developer's Guide with CSS and JavaScript

by Karl Bunyan

March 2015, 224 pp.

ISBN-13:

978-1-59327-575-4

If you already have even basic familiarity with HTML, CSS, and JavaScript, you’re ready to learn how to build a browser-based game. In Build an HTML5 Game, you’ll use your skills to create a truly cross-platform bubble-shooter game—playable in both desktop and mobile browsers.

As you follow along with this in-depth, hands-on tutorial, you’ll learn how to:

Send sprites zooming around the screen with JavaScript animations
Make things explode with a jQuery plug-in
Use hitboxes and geometry to detect collisions
Implement game logic to display levels and respond to player input
Convey changes in game state with animation and sound
Add flair to a game interface with CSS transitions and transformations
Gain pixel-level control over your game display with the HTML canvas

The programming starts right away in Chapter 1—no hemming and hawing, history, or throat clearing. Exercises at the end of each chapter challenge you to dig in to the bubble shooter’s code and modify the game.

Go ahead. Take the plunge. Learn to create a complete HTML5 game right now and then use your newfound skills to build your own mega-popular, addictive game.

Author Bio

Karl Bunyan's first adventure game was published in 1990 on the ZX Spectrum, and he’s been developing games ever since. Bunyan created HTML5 prototypes for the Game Show Network’s Facebook gaming platform, and he is currently the owner of Wedu Games, an independent firm that builds web and mobile games.

Table of contents

Introduction

Part I: Building a Game with HTML, CSS, and JavaScript

Chapter 1: Preparation and Setup
Chapter 2: Sprite Animation Using jQuery and CSS
Chapter 3: Game Logic
Chapter 4: Translating Game State to the Display

Part II: Enhancements with HTML5 and Canvas

Chapter 5: CSS Transitions, Transformations, and the HTML Canvas
Chapter 6: Rendering Canvas Sprites
Chapter 7: Levels, Sound, and More
Chapter 8: Next Steps in HTML5

Afterword: Go Make Some Games!

View the detailed Table of Contents (PDF)
View the Index (PDF)

Reviews

"If you like to follow along writing the code from technical books while reading them, the author of this book has done a fantastic job making it easy to do. The book is a great reference. It exposes a developer new to web technologies to the numerous APIs, does a good job explaining when such technologies are useful, and accurately weighs pros and cons of different approaches."
—Mozilla Hacks, the Web developers blog (Read More)

"Bunyan’s excellent new book on web programming sits between beginner guides to JavaScript and the many specialist, advanced titles available for experienced web programmers. After each chapter you’ll have another stage of the game complete, feeling some sense of achievement, and ready to learn more."
—MagPi Magazine (Read More)

"The writing is clear and easy to follow, the examples are good, and the concepts provide a solid foundation on which you can build."
—Matthew Helmke, author of Ubuntu Unleashed (Read More)

"If you have any interest at all in learning how to build games with web standards, then I definitely recommend checking out this book."
—Raymond Camden, author of jQuery Mobile Web Development Essentials (Read More)

"Could you build an online game using just HTML, CSS and JavaScript? Absolutely! And this book might just help you make that happen."
—IT World (Read More)

"Clear and easy to follow."
—I Programmer (Read More)