Game Development with Three.js

Isaac Sukin

• Publisher: Packt Publishing
• Year: 2013
• eBook ISBN: 9781782168539
• Edition: 1
• Topic: Informatica
• Subtopic: Programmazione in HTML

In Detail

The advent of WebGL and its inclusion in many browsers enabled JavaScript programs running in a web browser to access the GPU without a plugin or extension. Three.js is a next generation high-level library that makes it possible to author complex 3D computer animations that display in the browser using nothing more than a simple text editor. The development of these new tools has opened up the world of real-time 3D computer animations to a far broader spectrum of developers.

Starting with how to build 3D games on the web using the Three.js graphics library, you will learn how to build 3D worlds with meshes, lighting, user interaction, physics, and more. Along the way, youll learn how to build great online games through fun examples. Use this book as a guide to embrace the next generation of game development!

Moving on from the basics, you will learn how to use Three.js to build game worlds using its core components, including renderers, geometries, materials, lighting, cameras, and scenes. Following on from this, you will learn how to work with mouse and keyboard interactions, incorporate game physics, and import custom models and animations. You will also learn how to include effects like particles, sounds, and post-processing. You will start by building a 3D world, and then create a first person shooter game using it. You will then be shown how to imbue this FPS game with a capture the flag gameplay objective. With Game Development with Three.js, you will be able to build 3D games on the Web using the Three.js graphics library.

Approach

A step-by-step, example-based guide to building immersive 3D games on the Web using the Three.js graphics library.

Who this book is for

This book is for people interested in programming 3D games for the Web. Readers are expected to have basic knowledge of JavaScript syntax and a basic understanding of HTML and CSS. This book will be useful regardless of prior experience with game programming, whether you intend to build casual side projects or large-scale professional titles.

Game Development with Three.js

---

Table of Contents

Game Development with Three.js

Credits

About the Author

About the Reviewers

www.PacktPub.com

Support files, eBooks, discount offers and more

Why Subscribe?

Free Access for Packt account holders

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Downloading the example code

Downloading the color images of this book

Errata

Piracy

Questions

1. Hello, Three.js

The wonderful world of Three.js

Let's code!

Been there, scene that

Choosing your environment

Summary

2. Building a World

Geometries

3D primitives

2D primitives

Custom geometries

Text

Materials

A city scene

Lighting

Shadows

Renderers

Summary

3. Exploring and Interacting

Keyboard movement and mouse looking

Clicking

Timing

First-person shooter project

Designing a map

Constructing a player

Player movement

Physical movement

Updating the player's movement and rotation

Player collision

Voxel collision

Bots

Bullets

Updating the game loop

Summary

4. Adding Detail

Setting up CTF

Asset management

Loaders

Exporting to Three.js

Exporting from Three.js

Managing loaders

Mesh animation

Morph animation

Skeletal animation

Particle systems

Capturing the flag

Particles and Sprites

Particle systems

Sound

Renderer effects and postprocessing

Summary

5. Design and Development

Game design for the Web

Performance

Bandwidth/network constraints

Level of detail

Rendering optimizations

Battery life and GPU memory

Performance-measuring tools

Networking and multiplayer

Technologies

Anticheating

Development processes

JavaScript best practices

Existing workflows and level development

Summary

Index

Game Development with Three.js

Copyright © 2013 Packt Publishing

All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.

Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author, nor Packt Publishing, and its dealers and distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this book.

Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.

First published: October 2013

Production Reference: 1171013

Published by Packt Publishing Ltd.

Livery Place

35 Livery Street

Birmingham B3 2PB, UK.

ISBN 978-1-78216-853-9

www.packtpub.com

Cover Image by Suresh Mogre (<[email protected]>)

Credits

Author

Isaac Sukin

Reviewers

Ian Langworth

Wenli Zhang

Acquisition Editor

Gregory Wild

Commissioning Editor

Govindan K

Technical Editors

Arwa Manasawala

Veena Pagare

Project Coordinator

Aboli Ambardekar

Proofreader

Jonathan Todd

Indexer

Mehreen Deshmukh

Production Coordinator

Arvindkumar Gupta

Cover Work

Arvindkumar Gupta

About the Author

Isaac Sukin has been building games since he was eight years old, when he discovered that Nerf Arena Blast came with a copy of Epic Games' Unreal Editor. At 16, he became co-leader of the Community Bonus Pack team, an international group of game developers for the Unreal Engine that won 49 awards over the next few years. He started learning to code around the same time by developing an open source Facebook-style statuses system that thousands of websites have adopted. Since then, he has been increasingly drawn to interactive JavaScript on the web. He created an open source 2D game engine in early 2012 and then dove into Three.js.

As of 2013, he is a senior, studying entrepreneurship and information management at the Wharton school at the University of Pennsylvania. He has worked for Twitter, First Round Capital, and Acquia among others, and was previously a freelance consultant and developer. He is also a founder of Dorm Room Fund, a student-run venture capital fund that invests in student-run startups. You can find him on GitHub and Twitter under the alias IceCreamYou or visit his website at www.isaacsukin.com.

He has previously published short stories and poetry, but this is his first book.

Thanks, Mom and Dad, for your love and support in exploring my passions. To Lauren and Sarah, I am so proud to have such amazing little sisters. I love you.

And a shout out to the CBP3 team! Thanks for a lot of fun over the years.

About the Reviewers

Ian Langworth is the co-founder and CTO of Artillery, which aims to bring console-quality games to the browser using HTML5, WebGL, and other cutting-edge browser technology. Prior to Artillery, he was the first engineering hire at Redbeacon (acquired by The Home Depot in 2012), and before that he was a software engineer at Google. He is the co-author of Perl Testing: A Developer's Notebook, O'Reilly, 2005.

Wenli Zhang is a graduate student at Digital Art Lab of Shanghai Jiao Tong University. She has sufficient experience in web design and programming and shows great interest in it. She's familiar with HTML, CSS, JavaScript, Three.js, jQuery, PHP, and so on. She's also interested in graphics rendering and image processing.

She originally learned Three.js for a game to demonstrate web audio during her internship in Intel corp. Owing to her knowledge in the field of computer graphics and previous experience with OpenGL, she learned Three.js quickly and developed a 3D Arcalands game within a week. After that, she used Three.js for several applications and found it efficient and easy to use.

She has also developed a jQuery plugin named jWebAudio (htt...

Table of contents

• Game Development with Three.js