Back to the blog

Animation

Your model, moving the way you want.

Animate a GLB in your browser, nothing uploaded: give its parts, the camera and the lights keys on a timeline, and save an animated GLB, a video or a GIF.

By 6 min read

A teal star on an artboard, drawn three times as it turns and grows, over a timeline with keys for its turn, size and opacity and the easing curve beside them

A GLB from a shop, a scan or a 3D program often stands still. KeepSimp's Animate a GLB page opens it in the Animation maker's 3D editor, in your browser, where its parts, the camera and the lights can be given keys. It saves an animated GLB, a video or a GIF, with nothing uploaded and no watermark.

Drop the model.

A GLB opens as it is. A glTF opens with the .bin and pictures it names, dropped with it; an FBX, an OBJ, an STL, a 3MF, a PLY and the other files KeepSimp's 3D viewer opens are turned into a GLB first, by the viewer's own readers. What a file names but was not dropped is named on the page, never fetched.

The model is placed in metres, standing on Y, as glTF files are.

Its parts, listed.

A GLB is made of parts, such as the wheels of a car or the lid of a box, held one inside another. They are listed as the file holds them, by name, and a part moves the parts inside it, as a car moves its wheels.

Each part keeps the place, turn and size it has in the file; keys move it from there. Hide a part to work on what is behind it, or lock it so it is not chosen by mistake.

Give it keys.

In Animate, move, turn or size a part, and a key is set at the frame shown. Set another later and every frame between is worked out: a wheel turns, a lid lifts, a door swings open. Easing decides how: Slow down for a soft stop, Overshoot for a little bounce.

The camera and the lights take keys too. Move the camera round the model or close in on a detail; brighten a light, or change its colour, over time.

Play its own animations.

A model that came with animations, such as a character's walk, lists them under it. Play one, or place it on the timeline to start at a moment you choose, beside the keys you add.

To trim, join, rename or speed one up, open the same model in the GLB animation editor, or do it right here: it is the same editor.

Save it.

An animated GLB keeps the model and holds your keys as glTF's own animations, which every glTF viewer plays. A camera's view, the lights' strength and colour and a material's colour are animated with glTF's KHR_animation_pointer extension, which some viewers do not support yet: they show those still, and the page says so. Every GLB is read back by three.js's glTF loader, as the 3D viewer reads it, before it is offered, and the way it is written is held to Khronos' glTF Validator in KeepSimp's own tests.

A video or a GIF shows what the camera sees, with no watermark. For a model that only needs to turn round once, KeepSimp's 3D viewer makes that video in one step.

Further reading

Topics: animate glb · animate a 3d model · glb animation · animated glb · keyframe 3d model · 3d model animation · animate fbx model

A little less theory. A little more doing.

Try it on your own terms, with a free browser tool.

Try the tool