Creating a Responsive Multiplayer Action Web Game in HTML5
In this tutorial we'll learn advanced topics surrounding HTML5 game development. Software required: HTML5, CSS.
What you'll learn
In this tutorial we'll learn advanced topics surrounding HTML5 game development. Throughout these lessons we will look at the steps required to build a multiplayer action game from scratch.We'll start by setting up our game scene using the Pixi.js open source library. We'll continue by implementing physics, audio and other game elements that are often tricky in-browser. We'll take a look at getting the most out of our performance by using Google Chrome's Developer Tools. Finally, we'll use WebSockets and Node.js to add multiplayer elements to our game.By the end of this tutorial, you'll have a solid understanding of advanced HTML5 game development topics and workflows, as well as a fully functioning game that will scale to fit any screen size. Software required: HTML5, CSS.
Table of contents
- Setting up an Efficient Workflow 9m
- Drawing Our Character on the HTML5 Canvas 9m
- Setting up Keyboard User Input 10m
- Adding a Physics Simulation to Our Game Loop 9m
- Setting up Physics-based User Input 10m
- Creating Randomly Spawning, Physics-based Enemies 11m
- Setting up Browser Audio 9m
- Triggering Audio from Physics-based Collisions 10m
- Tuning Cpu/gpu Performance in the Browser 15m
- Identifying and Patching Memory Leaks 9m
- Making the Game Responsive 9m
- Adding Multiplayer Gameplay 12m
- Preparing the Game for Deployment 9m