This book is your foray into building in-browser 3D games. The book starts with an introduction to the basics of the low-level 3D rendering API, WebGL. We then transform the low-level API to an implementation of a sample 3D rendering library. We use this library to build components of a concept game, "5000 AD". We walk you step by step from using 3D assets to the implementation of techniques that are used to build a complete in-browser massive multiplayer online role-playing game.
Chapter 1, Getting Started with WebGL Game Development, covers basic terminologies of 3D and the basics of WebGL, 3D mathematics, and 3D graphics. It also gives a walkthrough of the WebGL API and discusses the structuring of a WebGL application.
Chapter 2, Colors and Shading Languages, explains how to add colors, light, and material to objects in a scene. It discusses how to export 3D objects using tools such as Blender and also explains the basic Wavefront OBJ file format and the JSON file format. Also, we will learn about directional lights in this chapter.
Chapter 3, Loading the Game Scene, teaches us how to handle loading and rendering of multiple objects through coding. This chapter also teaches you to add point lights to your scene.
Chapter 4, Applying Textures, covers all of the topics on how to create, load, and apply textures to 3D objects. It also teaches advanced techniques such as filtering and cubemaps.
Chapter 5, Camera and User Interaction, focuses on evolving our own camera class for our game scene. We will also empower our users to view the game scene from different angles and positions by adding the mouse and keyboard interactivity.
Chapter 6, Applying Textures and Simple Animations to Our Scene, starts by simulating a first-person camera and takes it forward by giving weapons to our character. We also dive deep into different animations techniques used in game engines.
Chapter 7, Physics and Terrains, explains physics simulation and discusses how physics engines control component trajectories as well as work with collision detection in a game.
Chapter 8, Skinning and Animations, covers our study of character animation by understanding the skeleton, which is the base of the character, upon which the body and its motion are built. Then, we learn about skinning and how the bones of the skeleton are attached to the vertices.
Chapter 9, Ray Casting and Filters, unveils a very powerful concept in game development called ray casting, which is used to cover cases that cannot be handled by collision detection. This also covers framebuffers, another very important concept used in game development.
Chapter 10, 2D Canvas and Multiplayer Games, covers the use of 2D rendering in 3D games through canvas 2D, a very powerful 2D drawing API. We also discuss the technology behind HTML-based multiplayer games.
To learn game development in WebGL, all you need is your favorite text editor and any of the following browsers:
Mozilla Firefox Version 4.0 and above (http://en.wikipedia.org/wiki/Mozilla_Firefox)
Google Chrome Version 9 and above (http://en.wikipedia.org/wiki/Google_Chrome)
Safari Version 6.0 and above (http://en.wikipedia.org/wiki/Safari_%28web_browser%29)
If you are a programmer who wants to transform the skill of blending imagination and thought in games, this is the book for you. You need to have a good understanding of object-oriented programming, JavaScript, and vector and matrix operations.
In this book, you will find a number of styles of text that distinguish between different kinds of information. Here are some examples of these styles, and an explanation of their meaning.
Code words in text, database table names, folder names, filenames, file extensions, pathnames, dummy URLs, user input, and Twitter handles are shown as follows: "Open the SquareGeomtery.js file from client/primitive."
A block of code is set as follows:
<html>
<canvas id="canvasElement"></canvas>
</html>
<script>
this.canvas = document.getElementById("canvasElement");
this.ctx = this.canvas.getContext('2d');
</script>Any command-line input or output is written as follows:
#node server.js #npm install socket.io
New terms and important words are shown in bold. Words that you see on the screen, in menus or dialog boxes, for example, appear in the text like this: "We can enable the extension in the Settings menu in Google Chrome."
Feedback from our readers is always welcome. Let us know what you think about this book—what you liked or may have disliked. Reader feedback is important for us to develop titles that you really get the most out of.
To send us general feedback, simply send an e-mail to <[email protected]>, and mention the book title via the subject of your message.
If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, see our author guide on www.packtpub.com/authors.
Now that you are the proud owner of a Packt book, we have a number of things to help you to get the most from your purchase.
You can download the example code files for all Packt books you have purchased from your account at http://www.packtpub.com. If you purchased this book elsewhere, you can visit http://www.packtpub.com/ support and register to have the files e-mailed directly to you.
Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you find a mistake in one of our books—maybe a mistake in the text or the code—we would be grateful if you would report this to us. By doing so, you can save other readers from frustration and help us improve subsequent versions of this book. If you find any errata, please report them by visiting http://www.packtpub.com/submit-errata, selecting your book, clicking on the errata submission form link, and entering the details of your errata. Once your errata are verified, your submission will be accepted and the errata will be uploaded on our website, or added to any list of existing errata, under the Errata section of that title. Any existing errata can be viewed by selecting your title from http://www.packtpub.com/support.
Piracy of copyright material on the Internet is an ongoing problem across all media. At Packt, we take the protection of our copyright and licenses very seriously. If you come across any illegal copies of our works, in any form, on the Internet, please provide us with the location address or website name immediately so that we can pursue a remedy.
Please contact us at <[email protected]> with a link to the suspected pirated material.
We appreciate your help in protecting our authors, and our ability to bring you valuable content.
You can contact us at <[email protected]> if you are having a problem with any aspect of the book, and we will do our best to address it.