THREE.BasicThirdPersonGame is a free open source JavaScript micro-framework for WebGL games based on THREE.js and Cannon.js.

Play the demo game to see THREE.BasicThirdPersonGame in action.

Key facts

  • Build 3D browser games with HTML5, WebGL and JavaScript
  • Utilizes THREE.js, one of the most popular 3D engines on the web
  • Cannon.js is a simple, fast and lightweight physics engine
  • Use rigid bodies, friction, restitution, collision detection and constraints
  • Single module files for a clean separation of game logic
  • Provides smooth controls and an adjustable follow camera

Overview

THREE.BasicThirdPersonGame is a set of JavaScript files which form the starting point for a 3D game using a third-person camera system. In contrast to a first-person (or ego) perspective, a third-person camera automatically follows the main player character or player vehicle of the game and provides an "over the shoulder" view. So the follow camera keeps track of the orientation of the player and sticks to his position by using a fixed distance. THREE.BasicThirdPersonGame provides a simple configuration for this distance so you can adjust it horizontally and vertically.

Beside the camera system, the boilerplate comes with some other interesting features. In a nutshell:

  • an input system
  • player movement/jumping
  • a level reset mechanism
  • math helper methods
  • adjustable camera viewport
  • Cannon.js-optimized processing of imported 3D models

For more about the details and implementation, head over to the documentation and learn how to use it. THREE.BasicThirdPersonGame ought to be an interactive tutorial and starting point for your WebGL game based on THREE.js. The code is documented and you can extend it with features you like.

Side note

If you like the background image of this website and want to download it in its full resolution, you can grab the image here.