Issues with scarf physics and bone attachment in Babylon.js

Hello,

I’m trying to create an animation where the scarf follows the movements of the character.
I’ve come up with a method that works fairly well:

  • I create a mesh grid that represents the base shape of the scarf
  • I set a maximum distance between each point

But I’m running into three issues:

  • The top of the scarf doesn’t follow the character’s neck (especially during animations like landing)
  • The scarf goes through the character
  • An orange square appears on the ground, and I don’t know why (but it’s the same mesh as the scarf)

As for the first issue, I’ve tried several methods:

  • Using the position of the neck bone as the position for the top points of the scarf
  • Parenting a dummy mesh to the bone, then using that mesh’s position for the top points of the scarf

Neither of these methods worked — the top of the scarf stays in its original position.

Here’s the link to the playground: Babylon.js Playground
Move: W A S D
Jump: Spacebar

If you have any advice, resources, or ideas, I’m all ears!

Hi @shinobi_cat welcome to the forum

Tweaking cloth is tricky but there is no specific process AFAIK other than rapid iteration.
This said, this.points.length is 49 but inspector reports 98 vertices for the mesh so only half of the points are updated. That’s because of sideOrientation: BABYLON.Mesh.DOUBLESIDE

  • The scarf goes through the character: You’ll have to handle collision with volumes. points/sphere is not too complex but you’ll have to compute collision sphere position yourself. Don’t forget to use debug display to help
  • No magic for the locked vertices: compute world position of the locks and set cloth vertex position to that value. Same as before: tweaking/debugging is king here. use debug display and, if possible, attache a gizmo to tweak their world/local position