Clothing/armour - Adding visual armour to 3D animated Characters

I’m starting to learn how to use babylonJS, and I was wondering if its possible to implement a clothing system for animated characters, and the general idea as to how one would achieve this.


Do you mean like cloth?
I you make a cloth-like physics object you should be able to use lock joints to attach it to a imported 3d modeled character.

But beyond that, I might be able to help, but others should be able to.
I hope that kinda helps.

1 Like

But what I’m trying to do is to do is to have like, a rigid mesh of a medieval armor/coat/scarf/hat/mask/boots appear in a character/npc when equipped.

It does not have to be cloth.

A rigid mesh. Hmm. I’m pretty sure cloth isn’t a thing cannon (default babylon physics engine) has, but can be made. A rigid mesh as in like kinda sways but is not all over the place?

I may be able to simply setup a character mesh in underwear with all animations and bones.
Then I would make a armor mesh using the same skeleton.

After that I may be able to set the character mesh as a parent mesh for the armor and play the animations in both meshes.

I just have no idea if this is the right way to doit.
I’m not planning in using physics at all, just have the items I equip show up in my character and have the same system working for NPCs

1 Like

That might work. Playing around with code is the best way to find a solution! (I do it a lot) I don’t think that there is a definitive way to do what you’re trying to do, so anything works that works!

Good luck!

1 Like

Hi gmfc,

This is definitely not an area of expertise for me, but I think what you’re trying to do is either have two skins for the same skeleton or have a “modular” skin that you can replace pieces of with other pieces (for example, replace a torso section with a hauberk). In either case, I think you’ll probably want to use bones and skeletons. Again, this is not an area I know much about, but @PatrickRyan can almost certainly help if you get stuck.

And +1 to what Givo said: good luck, and welcome to the Babylon forum!


@gmfc, I get what you are trying to achieve with your character customization and is fairly common in games with any kind of customization. For any objects that don’t need to deform on your model like a helmet, shield, weapon, or backpack (unless you want shoulder straps on it) you can simply set the parent of the object to the correct bone in your skeleton with an appropriate offset. This will handle the transforms of the child object (translation, rotation, scale) with the animations in your skeleton. This is cheaper than skinning objects that don’t need to deform because you aren’t needing to step through the vertices and apply a weight to the transform which would all be the same.

For anything that needs to deform like chest armor (even though it is a rigid material in reality, it will need to deform with your model to prevent penetration with surrounding meshes like the arms) you will want to skin the mesh to the same skeleton and swap out the current object on the skeleton with the new object. You will miss out on a little optimization as you will have to have several meshes attached to the same skeleton rather than combining the meshes and reducing draw calls, but if you combine meshes, you will have to swap the whole mesh to change one piece which requires a separate mesh for every combination of gear which is unrealistic.

I hope this answers some of your questions about your method. Please let me know if you have any other questions or concerns as you design your customization system. And thanks to @syntheticmagus to pinging me on this thread.

1 Like

Thank you very much!
It’s exactly what I’m trying to do.
Now I know where to start.:smiley:

1 Like

Hi, do you mind to share any references and examples if possible.

I don’t have anything at hand to be able to show as a reference. I will put together a simple PG to demonstrate, though.

@inevitable, I actually found a great example for you. This is a playground that has multiple meshes skinned to the same skeleton as well as shows how to attach a mesh to a bone. As you can see there are several meshes all pointing at the same skeleton which all animate together:

And the attachment of the sphere to the hand bone is accomplished with the code:

sphere.attachToBone(skelenton.bones[34], dude);

Hope this helps point you in the right direction, but you can find more in the bones and skeleton documentation page.


Hey @inevitable, @gmfc

I just created a demo showing how to import and use animation and clothing from multiple glTF files, all rigged identically. hopefully you can find this useful!:

glTF Animation Retargeting Demo | Babylon.js Playground


Hey Drigax,

I loved it man. i will go trough line by line. I achieved the avatar outfit by applying material of individual mesh of outfit.glb file to avatar mapping mesh.

1 Like

these are great thanks :pray:


You can also rename certain bones and attach something to the bone by its name. That’s what I do and it makes things easier than bone numbers

const boneIndex = this.skeleton.getBoneIndexByName("Head");[boneIndex],;

For anything clothing, I just change the textures of the mesh with new BABYLON.Texture(diffuseTexture, this.scene).

PS: I hadn’t noticed that this topic was from 2 years ago.