book

Core HTML5 2D Game Programming

Name: Core HTML5 2D Game Programming
Author: David Geary
ISBN: 9780133564280

by David Geary

July 2014

Intermediate to advanced

640 pages

16h 35m

English

Pearson

Read now

Unlock full access

About This eBook
Title Page
Copyright Page
Contents
Preface
A Brief History of This BookHow to Use This BookThe Book’s ExercisesSource Code and Chapter-specific Versions of Snail BaitPrerequisitesYour GameOnline Resources
Acknowledgments
About the Author
Chapter 1. Introduction
1.1 Snail Bait1.2 HTML5 Game Development Best Practices1.3 Special Features1.4 Snail Bait’s HTML and CSS1.5 Snail Bait’s Humble Beginning1.6 The Use of JavaScript in This Book1.7 Conclusion1.8 Exercises
Chapter 2. Raw Materials and Development Environment
2.1 Use Developer Tools2.2 Obtain Assets2.3 Use CSS Backgrounds2.4 Generate Favicons2.5 Shorten the Coding Cycle2.6 Conclusion2.7 Exercises
Chapter 3. Graphics and Animation
3.1 Draw Graphics and Images with the HTML5 canvas Element3.2 Implement Smooth HTML5 Animations3.3 Implement a Game Loop3.4 Calculate Frame Rates3.5 Scroll the Background3.6 Create Time-Based Motion3.7 Reverse Scroll Direction3.8 Draw Animation Frames3.9 Use Parallax to Create the Illusion of Depth3.10 Conclusion3.11 Exercises

Chapter 4. Infrastructure
4.1 Encapsulate Game Functions in a JavaScript Object4.2 Understand JavaScript’s Persnickety this Reference4.3 Handle Keyboard Input4.4 Pause or Resume the Game When the Player Presses the p Key4.5 Freeze the Game to Ensure It Resumes Exactly Where It Left Off4.6 Pause the Game When the Window Loses Focus4.7 Resume a Paused Game with an Animated Countdown4.8 Conclusion4.9 Exercises
Chapter 5. Loading Screens
5.1 Define Snail Bait’s Chrome5.2 Fade Elements In and Out with CSS Transitions5.3 Fade Any Element In or Out That Has a CSS Transition Associated with Its Opacity5.4 Implement the Loading Screen5.5 Reveal the Game5.6 Conclusion5.7 Exercises
Chapter 6. Sprites
6.1 Sprite Objects6.2 Incorporate Sprites into a Game Loop6.3 Implement Sprite Artists6.4 Create and Initialize a Game’s Sprites6.5 Define Sprites with Metadata6.6 Scroll Sprites6.7 Conclusion6.8 Exercises
Chapter 7. Sprite Behaviors
7.1 Behavior Fundamentals7.2 Runner Behaviors7.3 The Runner’s Run Behavior7.4 Flyweight Behaviors7.5 Game-Independent Behaviors7.6 Combine Behaviors7.7 Conclusion7.8 Exercises
Chapter 8. Time, Part I: Finite Behaviors and Linear Motion
8.1 Implement an Initial Jump Algorithm8.2 Shift Responsibility for Jumping to the Runner8.3 Implement the Jump Behavior8.4 Time Animations with Stopwatches8.5 Refine the Jump Behavior8.6 Implement Linear Motion8.7 Pause Behaviors8.8 Conclusion8.9 Exercises
Chapter 9. Time, Part II: Nonlinear Motion
9.1 Understand Time and Its Derivatives9.2 Use Animation Timers and Easing Functions to Implement Nonlinear Jumping9.3 Implement Animation Timers9.4 Implement Easing Functions9.5 Fine-tune Easing Functions9.6 Implement a Realistic Bounce Behavior9.7 Randomize Behaviors9.8 Implement Nonlinear Color Changes with Animation Timers and Easing Functions9.9 Conclusion9.10 Exercises
Chapter 10. Time, Part III: Time Systems
10.1 Snail Bait’s Time System10.2 Create and Start the Time System10.3 Incorporate the Time System into Snail Bait10.4 Redefine the Current Time for Stopwatches and Animation Timers10.5 Implement the Time System10.6 Conclusion10.7 Exercises
Chapter 11. Collision Detection
11.1 The Collision Detection Process11.2 Collision Detection Techniques11.3 Snail Bait’s Collision Detection11.4 Select Candidates for Collision Detection11.5 Detect Collisions Between the Runner and Another Sprite11.6 Process Collisions11.7 Optimize Collision Detection11.8 Monitor Collision Detection Performance11.9 Implement Collision Detection Edge Cases11.10 Conclusion11.11 Exercises
Chapter 12. Gravity
12.1 Equip the Runner for Falling12.2 Incorporate Gravity12.3 Collision Detection, Redux12.4 Conclusion12.5 Exercises
Chapter 13. Sprite Animations and Special Effects
13.1 Implement Sprite Animations13.2 Create Special Effects13.3 Choreograph Effects13.4 Conclusion13.5 Exercises
Chapter 14. Sound and Music
14.1 Create Sound and Music Files14.2 Load Music and Sound Effects14.3 Specify Sound and Music Controls14.4 Play Music14.5 Play Music in a Loop14.6 Play Sound Effects14.7 Turn Sound On and Off14.8 Conclusion14.9 Exercises
Chapter 15. Mobile Devices
15.1 Run Snail Bait on Mobile Devices15.2 Detect Mobile Devices15.3 Scale Games to Fit Mobile Devices15.4 Change Instructions Underneath the Game’s Canvas15.5 Change the Welcome Screen15.6 Incorporate Touch Events15.7 Work Around Sound Idiosyncrasies on Mobile Devices15.8 Add an Icon to the Home Screen and Run Without Browser Chrome15.9 Conclusion15.10 Exercises
Chapter 16. Particle Systems
16.1 Smoking Holes16.2 Use Smoking Holes16.3 Implement Smoking Holes16.4 Pause Smoking Holes16.5 Conclusion16.6 Exercises
Chapter 17. User Interface
17.1 Keep Score17.2 Add a Lives Indicator17.3 Display Credits17.4 Tweet Player Scores17.5 Warn Players When the Game Runs Slowly17.6 Implement a Winning Animation17.7 Conclusion17.8 Exercises
Chapter 18. Developer Backdoor
18.1 Snail Bait’s Developer Backdoor18.2 The Developer Backdoor’s HTML and CSS18.3 Reveal and Hide the Developer Backdoor18.4 Update the Developer Backdoor’s Elements18.5 Implement the Developer Backdoor’s Checkboxes18.6 Incorporate the Developer Backdoor Sliders18.7 Implement the Backdoor’s Ruler18.8 Conclusion18.9 Exercises
Chapter 19. On the Server: In-game Metrics, High Scores, and Deployment
19.1 Node.js and socket.io19.2 Include socket.io JavaScript in Snail Bait19.3 Create a Simple Server19.4 Create a Socket on the Server19.5 Start the Server19.6 Create a Socket on the Client and Connect to the Server19.7 Record In-game Metrics19.8 Manage High Scores19.9 Deploy Snail Bait19.10 Upload Files to a Server19.11 Conclusion19.12 Exercises
Chapter 20. Epilogue: Bodega’s Revenge
20.1 Design the User Interface20.2 Create the Sprite Sheet20.3 Instantiate the Game20.4 Implement Sprites20.5 Implement Sprite Behaviors20.6 Draw the Bullet Canvas20.7 Implement Touch-Based Controls for Mobile Devices20.8 Conclusion20.9 Exercises
Glossary
Index

Overview

Game programming offers a wealth of creative and business opportunities, and it’s never been more accessible. In Core HTML5 2D Game Programming, best-selling author David Geary shows you how to use freely available browser tools and open source resources to create video games that run in desktop browsers and on mobile devices.

Geary walks you step by step through every aspect of implementing a sophisticated arcade-style game entirely from scratch, without using proprietary game frameworks. Packed with code, this full-color tutorial gives you the in-depth understanding you need to design and build any kind of HTML5 2D game on your own, whether you use a framework or not.

A clearly written, accessible, and exhaustive guide to implementing games, this book leaves no stone unturned, showing you how to

Create smooth, flicker-free animations
Implement motion that’s unaffected by your game’s underlying animation frame rate
Animate sprites (graphical objects) to make them sparkle, explode, etc.
Layer multi-channel sound effects on top of a soundtrack
Warp time to create nonlinear effects, such as jumping or bouncing
Control the flow of time through your game with a time system
Implement particle systems that simulate natural phenomena
Efficiently detect collisions between sprites
Create a developer backdoor containing special features
Use Node.js and socket.io to transfer real-time metrics to a server
Employ a heads-up display to show high scores stored on a server
Understand the nuances of implementing HTML5 games for mobile devices

Through expertly written code that’s easy to understand, and prose that cuts to the chase, Geary illuminates every corner of game development. Everyone from novice game programmers to professional game developers will find this book invaluable as both a tutorial and a reference.

All of the book’s source code, including chapter-specific versions of the game discussed in the book, are available at corehtml5games.com.

Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.

Read now

Unlock full access

More than 5,000 organizations count on O’Reilly

O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.

Julian F.

Head of Cybersecurity

I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.

Addison B.

Field Engineer

I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.

Amir M.

Data Platform Tech Lead

I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.

Mark W.

Embedded Software Engineer

Building a 2D Game Physics Engine: Using HTML5 and JavaScript

Publisher Resources

ISBN: 9780133564280Purchase book

Cloud Computing

Data Engineering

Data Science

AI & ML

Programming Languages

Software Architecture

IT/Ops

Security

Design

Business

Soft Skills