OrbitControls vs TrackballControls for product configurators

Three.js ships several camera controls. For a product configurator the realistic choice is between two, OrbitControls and TrackballControls, and they feel completely different to a customer. I have shipped the wrong one and watched a client try to figure out why their pergola was upside down.

The difference that matters

OrbitControls keeps an up direction. The camera orbits around the model but the world stays oriented. Up is up. You can spin around a product and look at it from any side, but it never tilts onto its head. This matches how people expect to inspect a real object on a turntable.

TrackballControls has no up vector. Rotation is completely free, like the model is floating in space. Powerful for inspecting abstract geometry, disorienting for a customer looking at furniture. They flick it once, the product rolls sideways, and now they are fighting to get it level again.

For anything a customer is configuring to buy, you want OrbitControls. The constraint is the feature.

The setup that feels good

import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js' const controls = new OrbitControls(camera, renderer.domElement) controls.enableDamping = true // weighty, not twitchy controls.dampingFactor = 0.08 controls.minDistance = 1.5 // do not let them fly inside the model controls.maxDistance = 8 controls.maxPolarAngle = Math.PI / 2 // do not go under the floor 

Two things that make it feel professional rather than like a demo:

1. enableDamping gives the motion weight, so it glides to a stop instead of snapping. Remember it needs controls.update() in your loop.
2. Distance and angle limits stop the customer from getting lost inside the geometry or staring at the underside of the product.

The one caveat

enableDamping requires calling controls.update() every frame, which means a continuous render loop. If your configurator renders on demand to save battery, either render while damping settles or drop damping. Pick deliberately, do not leave it half-wired.

The pergola at pergola3d.grodev.pl uses OrbitControls with these limits, which is why it feels like turning a real object rather than wrestling one.

I am Dominik Groński / GroDev, a studio in Poznan, Poland building custom 3D configurators and Laravel back-ends for manufacturers.