HTML 5 Shoot ’em Up in an Afternoon
Bryan Bibat
Computers & Technology
HTML 5 Shoot ’em Up in an Afternoon

Learn (or teach) the basics of Game Programming with this free Phaser tutorial.

This book was a result of three things that happened to occur around the same time:

First was the problem that came up with our HTML5 workshop. The original lecturer bailed at the last minute and we had problems with finding a replacement. We even considered the worst case, cutting out the hands-on portion leaving us with a morning “workshop” consisting only of talks from people in the local gaming industry.

Coincidentally, I was playing around with Phaser a few weeks before the event. While I am not a game developer, I had just enough knowledge to make a simple workshop to introduce basic game concepts via the said HTML5 game framework. In the end I volunteered to take over the workshop less than four days before the actual event.

Normally I would have prepared a hundred or so slides and go through them during the workshop. But earlier that week I had the rare opportunity to talk to the first person who gave me advice when I started out teaching, and one of the things we talked about the not-so-recent trend of lazy college professors making only slides leaving a big gap between them and textbooks. This convinced me to switch things up with the workshop – instead of giving the participants a link to SpeakerDeck, I would point them to the book.

It took a few sleepless nights to write the original 36-page workbook, but it was worth it: I had a much easier time conducting the workshop than I would have if I went with slides.

Purchasing the book is optional, but would be greatly appreciated as purchases will allow me to spend more time writing books like these. A bonus video is included with purchases.

Table of Contents
Who is this book for?
Morning: Preparing for the Afternoon
Introduce them to Shoot `em Ups
Technical Requirements: JavaScript and Math
Development Environment Setup
Other Suggested Prior Reading
Video Walkthrough
Afternoon 0: Overview of the Starting Code
Afternoon 1: Sprites, the Game Loop, and Basic Physics
Sprite Basics
The Game Loop
Apply Physics
Afternoon 2: Player Actions
Keyboard Movement
Mouse/Touch Movement
Firing Bullets
Afternoon 3: Object Groups
Convert Bullets to Sprite Group
Enemy Sprite Group
Player Death
Convert Explosions to Sprite Group
Intermission: Refactoring
Refactoring Functions
Reducing Hard-coded Values
Afternoon 4: Health, Score, and Win/Lose Conditions
Enemy Health
Player Score
Player Lives
Win/Lose Conditions, Go back to Menu
Afternoon 5: Expanding the Game
Harder Enemy
Boss Battle
Sound Effects
Afternoon 6: Wrapping Up
Restore original game flow
Sharing your game
Evening: What Next?
What we didn't cover
Appendix A: Environment Setup Tutorials
Basic Setup
Advanced Setup
Cloud IDE Setup
Appendix B: Expected Code Per Chapter
The book hasn't received reviews yet.