HTML5 Game Development [VIdeo]
Packt Video. Stream online or download for unrestricted offline use. Learn more
- New! Packt Video courses: practical screencast-based tutorials that show you how to get the job done. Bite sized chunks, hands on instructions, and powerful results.
- Create two simple yet elegant games in HTML5
- Build games that run on both desktops and mobile browsers
- Presented in a modular approach, with elegant code and illustrated concepts to help you learn quickly
- Updated the code to work for CreateJS version 0.7.1 at - https://github.com/makzan/HTML5-Games-Examples/commit/4ed86ae488d35768f5...
Video DetailsLanguage : English
Release Date : Tuesday, December 31, 2013
Course Length : 1 hour and 58 minutes
ISBN : 1849695881
ISBN 13 : 9781849695886
Author(s) : Makzan
Topics and Technologies : Game Development, Other, Video
Table of Contents
- Planning Your First Game [12:08 minutes]
- Planning Your Game
- Setting Up Your File Structure
- Setting Up HTML and JS
- Drawing Basic Shapes with EaselJS
- Implementing Your First Game Object
- Creating the Core Game Logic [15:23 minutes]
- Displaying Multiple Objects on Stage
- Adding Click Input Events
- Adding the Game Logic
- Adding the Game Over Logic
- Restarting the Game
- Adding Graphics to Your Game [14:44 minutes]
- Preparing Your Graphics
- Adding Graphics to the Game
- Preloading Graphics
- Adding Custom Web Fonts
- Making Your Game Mobile-friendly
- Planning Your Second Game [17:13 minutes]
- Planning the Rush Game
- Defining the Game Object Class
- Creating a Platform Class
- Creating Movable Game Objects
- Adding Platforms to Your Stage
- Game Objects and Collisions [13:42 minutes]
- Handling Platforms and Hero Collisions
- Implementing the Obstacle Game Objects
- Handling Obstacle and Hero Collisions
- Handling Collisions with Generic Methods
- Implementing the Detection Score Counter
- Character Movement and Input Handling [12:05 minutes]
- Adding Gravity to the Level
- Applying Gravity to the Hero
- Making the Hero Run
- Making the Hero Jump
- Handling Hero-Obstacle Collisions
- Adding Graphics and Animations [15:40 minutes]
- Creating the Rush Game's Graphics
- Integrating Static Graphics in Rush
- Using EaselJS Sprite Sheet Animations
- Creating the Dynamic Platform Width Logic
- Preloading Graphics and the Progress Bar
- Polishing Your Final Game [17:44 minutes]
- Creating a Main Menu Scene
- Create a Game Over Scene
- Displaying Scores
- Displaying a Scoreboard
- Finalizing Your Game's Web Page
Sorry, there are currently no downloads available for this video.
Download the code and support files for this video.
Support, complaints and feedback.
Packt is committed to making Packt Video courses a valuable, useful way for IT professionals to learn new skills. We have made every effort to ensure that this course reaches the required standard and will work on our customer's devices. Please go to our support page.
What you will learn from this video course
- Create interactive games with gravity and collisions
- Modularize game components and create easily maintainable code
- Convert and embed custom fonts into your game and web pages
- Develop sprite and sprite sheet animations
- Preload graphic files and optimize your startup performance
- Control scene transitions such as main menu and game over scenes
- Understand core concepts that can be applied to developing other rich media and interfaces for your websites
- Test and optimize your game's performance
Who this video course is for
HTML5 Game Development will teach you all that you need to know to get started with creating your first game in HTML5 so you can start building captivating games from scratch.
This course is packed with step-by-step instructions to help you build modular code, optimize your game for deployment, and easily modify and reuse game logic to extend your game.
With this course, you’ll build two incrementally complex 2D games that run on both desktop and mobile browsers. This course will explain game programming best practices, complete with simplified game logic, physics and collision handling, as well as custom graphics and fonts.
Your first exercise is a simple counting game that lays the foundations for creating clean, customizable, and modular code. We’ll then move on to building a “rush” game with moving backgrounds, basic physics, and dynamic scoreboards.
We’ll cover essentials such as handling mobile touch events, controlling scene transitions, custom fonts and graphics, optimizing your game's load time, a loading progress bar, collision detection, keeping score, and creating a deployable game.
HTML5 Game Development will be your guide as you create two complete games that are compatible with multiple desktop and mobile web browsers.
Screenshots from the course
Packt video courses are designed to cover the breadth of the topic in short, hands-on, task-based videos. Each course is divided into short manageable sections, so you can watch the whole thing or jump to the bit you need. The focus is on practical instructions and screencasts showing you how to get the job done.