WebGLThree.jsInteractive 3D· 7 min read

Designing Touch-Sensitive 3D Creature Physics in Three.js

Qasim Malik·February 5, 2026

# Touch-Sensitive 3D Creature Physics

Creating immersive 3D backdrops requires balancing high visual impact with effortless usability. In our latest canvas update, we rebuilt the interactive creature physics engine.

Surface Repulsion Dynamics

Rather than calculating generic mouse proximity across the entire viewport, surface repulsion is strictly constrained to direct contacts.

``ts const dist = Math.hypot(p.x - cx, p.y - cy, p.z - cz); if (dist < repelRadius) { const force = (1 - dist / repelRadius) 0.4; p.vx += normal.x force; } ``

This ensures text remains readable while providing organic, tactile feedback when users interact directly with the 3D entity.