Player models 🧍🏽‍♀️🧍‍♀️

Questions
, ,
14

If you’re intending to make a game, i suggest looking into a game engine. There are a few out there. Game engines abstract a lot of common tasks for you, such as animation, physics, user interface, input/output and more.

One such engine is meep, it handles animations and does use three.js as a rendering engine by default. It also supports GLTF as the default 3d model format.

disclosure: I’m the author of meep

Here’s a sample of what an animating a model looks like in meep:

const entityBuilder = new EntityBuilder()
	.add(Transform.fromJSON({
		position:{0,0,0}
	})) //gives position, scale and rotation
	.add(Mesh.fromJSON({
		url: "http://web.site/mode.gltf"
	}) // Actual 3D model
	.add(Animation.fromJSON({}) // Animation component is required to let a Mesh animate
	.add(AnimationController.fromJSON([
		{
			startEvent:"jump-event",
			loop: false,
			animation: "jump-animation"
		}
	])); // Event-driven animation controller	

entityBuilder.build(sceneData); //construct the entity onto the scene


document.body.addEventListener('click',()=>{
	sceneData.sendEvent(entityBuilder.entity, 'jump-event');
});

Here we assume that your GLTF model has an animation named “jump-animation”, when you click on the screen - that animation will be played.

2 Likes