I've been trying to understand the maths behind Three.JS's skinning and I've been stuck there for a while.

My use case is loading "any" 3D model that is passed through OpenAssetImport and saved in a custom model format (mostly built for a custom native render, but it's just a representation of assimp's data structures).

In this model format I track:

• Meshes (obviously)
• Nodes (as in the 'assimp' definition of nodes)
• Bones

For each bone, I track:

• The node which it is attached to
• The individual 'bind matrix' as defined by assimp

I'm then struggling to re-construct the skeleton in Three.JS. My attempt is this:

• Generate all the 'nodes' (as in, 'assimp' nodes) as simple THREE.Object3D
• Attach the meshes when required
• For each bone
  • Find the node (THREE.Object3D) it's attached to
  • Create a new THREE.Bone
  • Apply assimp's 'bind matrix' to the ThreeJS bone with bone.applyMatrix(assimpBone.bindMatrix)
  • Set the THREE.Bone as a child of the THREE.Object3D
• Create a THREE.Skeleton with the array of THREE.Bone objects
• Attach it to the mesh with 'attached' bind mode

However, for some models this works, while for others I have big errors with meshes being de-formed (even if the base mesh is still at least recognizable).

Example mesh loaded with skinning disabled:

Same mesh loaded with skinning enabled: