ThreeJS Rigid-body Physics

Learning how to make objects interact with each other in the world

A good starting point for physics simulations is rigid body simulations. Shapes colliding and pushing each other. Like circles, which turn out to be the simplest shape to calculate.

Circles are easy because you only need the distance to the center and the radius of the circle. If the distance is greater than the radius, then you are outside. If the distance is almost equal to the radius, then you are about to collide. With objects with corners and complex shapes, it ain't that straight forward.

However, physics simulation is more than collision checking. It involves, forces, impulses, constraints, and more! There's a lot to it, so in this issue, we'll explore how far you can get with only rigid body simulations with no constrains!

Getting started

sponsor

Fun character physics

Often we are taken away by the technicality of our techniques. This 2D physics sim looks like a circle sim, the shapes look complex, but it seems like behind the scenes the physics are just calculated with circles.

This effect is such a small part of the site but gives so much character and fun to the whole project along with all the other small interactions. Patrik Heng is one of the masters.

Mouse Pushing cats

Garden Eight's portfolio is similar to this week's demo. All the cats have force applied to them so they always want to reach their target position, however, the mouse is another body that pushes them around.

For complex shapes like these, often the trick to have better performance is to calculate the physics using simpler shapes like cubes that encompass the mesh or a low-poly version of the mesh.

Pin Pong Game

Physics can also be a main part of the experience instead of a side thing. This demo adds gravity to the ball, meaning that it'll always have downward force applied to it. And because you apply also force to the pallet, whenever it interacts with the ball it's pushed upwards.

Conveyor belt physics

Usually, conveyors don't move anything, it's an illusion. The usual way to do it is to slap an animated texture on the conveyor so it looks like it's moving, and then just apply forward force on the items on top of it.

The physics in off-brand's projects are good because they play well with the environment and the setting, it makes it more significant than just physics.

The final touch is the conveyor soft-body flaps that interact with the objects, which I might explore in the next issue!