What was delivered
The public 3D model became part of the site navigation. The astronaut fades in, moves into depth, follows a smooth orbit and waves on interaction. Arm motion is stored as five reproducible poses, while leg corrections are applied separately. Speed, trajectory and the central safe zone are explicit parameters.
Why the embedded animation was insufficient
The source clip does not know the page composition. The astronaut had to remain to the right of the Earth, avoid the copy, stop during the wave and remain readable across desktop screens.
We separated the movement into the embedded clip, bone corrections and the trajectory of the complete model. Each source of jitter could then be tested independently.
A pose panel instead of blind iterations
The debug=pose query freezes the cycle and exposes sliders for three shoulder axes, elbow, wrist and finger adduction. A useful pose can be copied as a numeric snippet and stored under buttons A–E.
Smootherstep interpolates between five points. Each segment takes 18 seconds. Legs are not part of A–E: the code restores their bind pose and applies separate thigh, knee and ankle corrections.
pose A → 18 s → pose B → 18 s → pose C
→ pose D → pose E → pose A
full cycle: 90 sProblems found during integration
- 01KHR_materials_pbrSpecularGlossiness was unsupported by the selected Three.js version. The GLB was converted to metal/roughness.
- 02Dots in bone names broke PropertyBinding. Node names were normalized with sanitizeNodeName.
- 03Drei useAnimations did not resolve the bone bindings in this wrapper. A manual AnimationMixer replaced it.
- 04Mouse parallax, noise and velocity-based rotation made the model appear jittery. They were removed after separate position and bone logging.
- 05The external HDR returned 404. Lighting moved to local PMREM and RoomEnvironment.
Trajectory verification
The model remains hidden for five seconds, fades in over two, travels away from the camera for 36 seconds and transitions to an orbit. A safe zone pushes it away from the central composition. During the wave, its position is frozen so the contact panel stays stable.
Coordinates and velocity were logged four times per second. Smooth position data pointed the investigation toward bones or animation clips instead of the orbit. Less powerful mobile devices receive a simplified version without the heavy scene.