I can’t imagine how to make the same functionality of this camera movement so that it is smooth and captures exactly the room as in this video 2023 01 23 22 36 11 - YouTube
unity smooth damp will get you there. don’t use THREE.MathUtils.lerp, don’t use THREE.MathUtils.damp. most animation libraries will fail you as well unless they have inertia/velocity or are spring based.
quick explanation: imagine you start to animate from starting point A towards a goal B and now change the goal midway to C (which is what is always happening in interactive motion), with lerp and all the other dumb animation systems the moving object will stop dead in its track and now move towards the new target, worse, often resetting time. in the real world an object wouldn’t come to immediate halt but go further and expend energy until reaching inertia, then move towards the new direction. this is what springs and smooth damp approximate, it’s called interruptible animation.
(apple ui kit engineer)
it’s a bit more complex, since unity approximates physical accuracy with curves and velocity, but let’s not overcomplicate it.
this site otherwise is react-three-fiber, i think most of what constitutes it is available in the eco system. the mouse move is moving camera x y + scrollTop. here’s an example for just the plain movement, and you can bring this to your vanilla app just by copying the line with the damp function:
1 Like
thanks, but to me, but there is not the effect that is on the site, here is the one presented from the point of view of the camera link: Story Line: messages from a pandemic - The Feed - SBS
it’s all the same just implemented a little differently. if you have a lookAt(center) then it feels like a circular motion, without it it’s more like pan. but that’s just tweaking it to your liking, what matters is how, and the easiest way to get smooth movement is damp.