Collision vs Visual Geometry

Shipped games run two geometries in parallel: the camera gets the sculpted, organic mesh, and the physics gets a plain box or capsule hidden inside it. Decoupling them is what makes 'prettier' an art pass instead of a rewrite — and reskinning a whole world a content swap the gameplay never notices.

Core Idea

The little runner above is playing on geometry you can’t see. Every rock and stump is a costume — the physics that decides where the ball lands runs on plain boxes hidden inside the art, and on nothing else. That split is standard practice in shipped games at every budget: the visual geometry is a detailed mesh sculpted for the camera, and the collision geometry is a separate, radically simpler shape — a box, a capsule, a convex hull — that the simulation actually tests. The two live on independent tracks: art can be swapped, upgraded, or themed without the gameplay changing by a millimeter, because the gameplay never read it.

Two Meshes, Two Jobs

The split exists because the two consumers want opposite things:

Forcing one mesh to serve both masters makes physics expensive and art constrained. Splitting them makes “make it prettier” a pure art pass: the collider stays, the costume changes, and nothing in the simulation needs retesting.

What the Simulation Actually Tests

The price difference isn’t subtle. Ask “is this point inside?” of both shapes:

The box answers with four comparisons. The detailed outline pays an edge test for every edge, every query — and a real prop is thousands of triangles, not 48 edges. Engines lean on this gap twice over: the broad phase wraps everything in boxes and asks the cheap question first, and only pairs whose boxes overlap graduate to a narrow phase — which, thanks to the collider split, is usually still a cheap shape rather than the render mesh. The camera’s geometry never enters the pipeline at all. It’s the same economy that drives level of detail: different consumers of the same object get different meshes, each no heavier than its job requires.

Reskins, Not Rebuilds

Once gameplay runs on invisible boxes, a level stops being a 3D scene and becomes data:

{ type: 'hurdle', x: 42, z: 0 }   // what it IS — collider, placement, behavior
theme: 'jungle'                    // what it LOOKS like — resolved at render time

The renderer maps type + theme to a model and materials: the same hurdle collider wears a log in one world and driftwood in another. A whole new environment — swap jungle for beach for desert — is almost purely an art cost: new models, new textures, new palette. The mechanics vocabulary (run, jump, the obstacle set, the difficulty curve) is untouched, which is exactly how endless runners like Temple Run ship many worlds on one game. It also means a blocky prototype isn’t a stage to grow out of — those blocks are the collision geometry, and they stay forever; only the costume layer accretes on top. Instancing makes the economics even better: one obstacle geometry, many themed appearances, few draw calls — the territory of draw-call batching.

This split is also why studios greybox: build the level entirely in untextured primitives and playtest it raw. The practice looks like a budgeting trick — don’t pay for art before the design is proven — but the geometry split gives it a second, quieter payoff: the grey boxes aren’t a throwaway sketch, they are the collision geometry the finished game will run on. The maxim is that no one cares about your beautifully detailed cathedral if the player can’t fit through the door at the bottom — and the door’s width is a collider property, testable on day one, unchanged by every art pass that follows.

Seams Are a Material Problem

The same decoupling instinct applies one level down. A ground made of two flat colors meeting at a mathematically straight line reads as fake — but the fix is not modelling a better ground mesh. What sells a surface is edge treatment: a tiling texture with real grain, noise breaking up the seam, a blended transition zone straddling the boundary, and a few scattered props overlapping it. All of that is a texturing and set-dressing pass over the same simple geometry — cheap, and safe for worlds that scroll and recycle tiles, where a bespoke mesh would have to tile perfectly or pop every cycle. Model the props that sit on the surface; paint the surface itself.

Connections

The hidden collider is a mesh reduced to its job, the visible skin is a mesh grown into its own — and keeping a family of meshes per object is the same move level of detail makes for the camera at distance. Themed reskins over shared colliders pair naturally with instancing, surface realism is bought with texturing rather than vertices, and in Three.js the pattern is literal: the physics world and the scene graph are separate structures you keep in sync by hand — the engine won’t even let you conflate them by accident.