Play it here!

3D rendering and physics library for game-like projects on the web, featuring a few conventional gameplay mechanics and basic 3D models. Currently not production-ready. Until 1.0 is released, anything can break at any point and backwards compatibility with previous versions isn't guaranteed.

It's called Sketchbook because I'm sketching in all the gameplay mechanics I've known for years and always speculated on how I would go about creating them from scratch. Mostly it's just my little playground which I'm happy to share with people.

Built on three.js and cannon.js.

• World
  • Three.js scene
  • Cannon.js physics
  • Variable timescale
  • Frame skipping
  • FXAA anti-aliasing
  • Custom damped-spring simulation
• Characters
  • Third-person camera
  • Raycast character controller with capsule collisions
  • General state system
  • Character AI

• Vehicles
  • Cars
  • Airplanes
  • Helicopters

All planned features can be found in the project pages.

This creates a fullscreen canvas, initializes the physics and rendering, adds a character and lets you control him.

let world = new Sketchbook.World();

let player = new Sketchbook.Character({
    position: new THREE.Vector3(1.13, 3, -2.2),
});
LoadCharacterModel(player);
world.add(player);
player.takeControl();

Check out the examples to learn specifics about using Sketchbook.

Simply import the library in your project, along with provided build of cannon.js and a three.js version of your choice, and you're ready to go.

<script src="three.min.js"></script>
<script src="cannon.min.js"></script> <!-- Only use provided build, official package is extremely outdated! -->
<script src="sketchbook.min.js"></script>

A NPM package and @types are on the way, which should make this a whole lot easier.

Please do!

I appreciate all help, be it suggestions, issues or even pull requests. Just make sure to create PRs on the dev branch, which is the most up to date one.