Advanced Game Design with HTML5 and JavaScript

Book Description

How do you make a video game? Advanced Game Design with HTML5 and JavaScript is a down to earth education in how to make video games from scratch, using the powerful HTML5 and JavaScript technologies. This book is a point-by-point round up of all the essential techniques that every game designer needs to know.

You’ll discover how to create and render game graphics, add interactivity, sound, and animation. You’ll learn how to build your own custom game engine with reusable components so that you can quickly develop games with maximum impact and minimum code. You’ll also learn the secrets of vector math and advanced collision detection techniques, all of which are covered in a friendly and non-technical manner. You’ll find detailed working examples, with hundreds of illustrations and thousands of lines of source code that you can freely adapt for your own projects. All the math and programming techniques are elaborately explained and examples are open-ended to encourage you to think of original ways to use these techniques in your own games. You can use what you learn in this book to make games for desktops, mobile phones, tablets or the Web.

Advanced Game Design with HTML5 and JavaScript is a great next step for experienced programmers or ambitious beginners who already have some JavaScript experience, and want to jump head first into the world of video game development. It’s also great follow-up book for readers of Foundation Game Design with HTML5 and JavaScript (by the same author) who want to add depth and precision to their skills.

The game examples in this book use pure JavaScript, so you can code as close to the metal as possible without having to be dependent on any limiting frameworks or game engines. No libraries, no dependencies, no third-party plugins: just you, your computer, and the code. If you’re looking for a book to take your game design skills into the stratosphere and beyond, this is it!

What you’ll learn

• The latest JavaScript ES6, HTML and Canvas Drawing API skills you need to know to make games.
• Make game sprites, compose a scene graph, load and manage game assets, and how to use a texture atlas.
• Control the geometry and physics of the game world using vector math, the Separating Axis Theory (SAT), and advanced collision detection strategies.
• Build a custom music and sound effects player for games using the WebAudio API.
• Keyframe animation and how to implement precise control over the frame rate and game loop.
• Learn how to make interactive sprites and buttons for the keyboard, mouse and touch.
• Create and manage game scenes, and learn how to make particle explosions and screen shake effects.
• Manage complexity to build games of any size that scale seamlessly.

Who this book is for

Advanced Game Design with HTML5 and JavaScript is for video game developers with some experience who want to learn the essential techniques they need to know to take their skills to the next level. It’s for readers who want to understand and fine-tune every line of code they write, without resorting to quick fixes. All the techniques covered in this book are core game design skills that can be applied to many other programming technologies.

Table of Contents

Chapter 1. Level-up: New JavaScript Tricks
Chapter 2. The Canvas Drawing API
Chapter 3. Working with Game Assets
Chapter 4. Making Sprites and a Scene Graph
Chapter 5. Making Things Move
Chapter 6. Interactivity
Chapter 7. Collision Detection
Chapter 8. Juice It Up: Keyframe Animation and Particles Effects
Chapter 9. Sound with the WebAudio API
Chapter 10. Tweening
Chapter 11. Make Your Own Game Engine

Appendix A: Vectors for Movement and Collision Detection

中文：

书名：Advanced Game Design with HTML5 and JavaScript

How do you make a video game? 使用HTML5和JavaScript的高级游戏设计 是一个关于如何使用强大的HTML5和JavaScript技术从头开始制作视频游戏的脚踏实地的教育。这本书是每个游戏设计者需要知道的所有基本技巧的一点一点的总结。

您将了解如何创建和渲染游戏图形、添加互动性、声音和动画。您将学习如何使用可重复使用的组件构建自己的自定义游戏引擎，以便快速开发具有最大影响和最少代码的游戏。您还将学习向量数学和高级碰撞检测技术的秘密，所有这些都将以友好和非技术的方式介绍。您将找到详细的工作示例，其中包含数百个插图和数千行源代码，您可以根据自己的项目自由调整这些示例。所有的数学和编程技术都得到了详细的解释，并提供了开放式的示例，以鼓励您想出在自己的游戏中使用这些技术的创新方法。你可以用你在这本书中学到的东西来制作台式机、手机、平板电脑或网络游戏。

使用HTML5和JavaScript的高级游戏设计 对于有经验的程序员或雄心勃勃的初学者来说，这是一个很好的下一步，他们已经有了一些JavaScript经验，并希望首先进入视频游戏开发的世界。它也是一本很棒的后续书籍，适合以下读者 基于HTML5和Java脚本的基础游戏设计 (同一作者)，他们想要增加他们的技能的深度和精确度。

本书中的游戏示例使用纯JavaScript，因此您可以尽可能地编写代码，而不必依赖于任何限制框架或游戏引擎。没有库，没有依赖项，没有第三方插件：只有您、您的计算机和代码。如果你正在寻找一本书，把你的游戏设计技能带到平流层和更远的地方，这就是它！

What you’ll learn

• 最新的脚本ES6，超文本标记语言和画布绘图API技能，你需要知道做游戏。
• 制作游戏精灵，构建场景图，加载和管理游戏资源，以及如何使用纹理图集。
• 使用矢量数学、分离轴理论(SAT)和高级碰撞检测策略控制游戏世界的几何和物理。
• 使用WebAudio API为游戏构建自定义音乐和音效播放器。
• 关键帧动画以及如何实现对帧速率和游戏循环的精确控制。
• 学习如何制作用于键盘、鼠标和触摸的互动精灵和按钮。
• 创建和管理游戏场景，并学习如何制作粒子爆炸和屏幕震动效果。
• 管理复杂性，以构建可无缝扩展的任何规模的游戏。

Who this book is for

使用HTML5和JavaScript的高级游戏设计 是为有一定经验的视频游戏开发人员编写的，他们想要学习他们需要知道的基本技术，以将他们的技能提升到一个新的水平。它是为那些想要理解和微调他们编写的每一行代码的读者编写的，而不是求助于快速修复。这本书涵盖的所有技术都是核心游戏设计技能，可以应用于许多其他编程技术。

Table of Contents

Chapter 1. Level-up: New JavaScript Tricks
Chapter 2. The Canvas Drawing API
Chapter 3. Working with Game Assets
第四章：制作雪碧和场景图
Chapter 5. Making Things Move
Chapter 6. Interactivity
Chapter 7. Collision Detection
第8章.增强：关键帧动画和粒子效果
Chapter 9. Sound with the WebAudio API
Chapter 10. Tweening
Chapter 11. Make Your Own Game Engine

Appendix A: Vectors for Movement and Collision Detection