GLB animation for the web and three.js

For 3D on the web, use an animated GLB (binary glTF): one compact file with the character and its animation that three.js, Babylon.js and model viewers load directly. KinemIQ turns a video into such an animation and exports GLB / glTF.

Try it free in your browser Use my own video

KinemIQ: GLB animation for the web and three.js

In three.js

Load the file with GLTFLoader.
Create an AnimationMixer for the scene.
Play gltf.animations[0] with mixer.clipAction(...).play() and update the mixer every frame.

Keep it light

Export only the block you need.
30 fps is enough for most web scenes.
Export with the character mesh or skeleton only.

Frequently asked questions

Does it work in Babylon.js and model-viewer?

Yes - both read animated GLB / glTF.

Can I export only the skeleton?

Yes, turn the character model off in the export dialog.

Root motion on the web?

Export in place and move the object in your code, or keep root motion if the travel should come from the animation.

Open KinemIQ Studio

More with KinemIQ: Video to 3D animation · Video to motion · Free AI mocap from video · Video to FBX · Video to BVH · Martial arts animation · Ragdoll animation · Mocap from a phone video · FBX animation for Unity · Mocap for Unreal Engine · Mocap to Blender · Text to animation · 5-minute guide · All guides and answers