New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implemented Skeletal Animation Blending #4029

Closed
wants to merge 11 commits into
base: dev
from

Conversation

Projects
None yet
4 participants
@insominx
Contributor

insominx commented Oct 28, 2013

This work was directly integrated into the Animation object with some additional bookkeeping added to the Bone object.

Concerns:

  • Because Animation is used for non-skeletal animation, this results in more special case code being added.
  • There might be a more flexible way to blend multiple Quaternions but the current way is correct and is easy to iteratively apply.
  • The API for handling animations is very bare bones. I'm hoping that somebody with more experience can fill it out.

Anyhow, it works!

Enjoy,
Michael

insominx added some commits Oct 28, 2013

Added blending for skeletal animations.
Allows for smooth transitions between animations.  Look Ma, no popping!
Added blended character controller example.
Shows skeletal blending transitions between idle and walk cycles.
Added new blend example.
Allows manual control with a dat.gui slider.
Fixed animation update bug and typo.
Removing an animation while the AnimationHandler was iterating over them
was causing an update to be missed resulting in a choppy 1 frame glitch.

Typo was preventing an optimization.
@insominx

This comment has been minimized.

Show comment
Hide comment
@insominx

insominx Oct 30, 2013

Contributor

@mrdoob If there's anything you want me to change/fix, I have until the end of Friday to do it. Please let me know before then as I might not be able dedicate much time to this after that. Thanks!

Contributor

insominx commented Oct 30, 2013

@mrdoob If there's anything you want me to change/fix, I have until the end of Friday to do it. Please let me know before then as I might not be able dedicate much time to this after that. Thanks!

@insominx

This comment has been minimized.

Show comment
Hide comment
@insominx

insominx Nov 1, 2013

Contributor

Here's another demo to play with: http://www.realitymeltdown.com/WebGL2/marine-demo.html. Unfortunately, I don't think it's legal to distribute this model as it originally came from Evolver.com (when that was still around).

Contributor

insominx commented Nov 1, 2013

Here's another demo to play with: http://www.realitymeltdown.com/WebGL2/marine-demo.html. Unfortunately, I don't think it's legal to distribute this model as it originally came from Evolver.com (when that was still around).

@Digitoxin

This comment has been minimized.

Show comment
Hide comment
@Digitoxin

Digitoxin Nov 4, 2013

Contributor

Looks amazing, nice job!

I think this pretty much settles the only gripe I've had with this library.

Contributor

Digitoxin commented Nov 4, 2013

Looks amazing, nice job!

I think this pretty much settles the only gripe I've had with this library.

@mrdoob

This comment has been minimized.

Show comment
Hide comment
@mrdoob

mrdoob Nov 5, 2013

Owner

Hmmm... I'll have to take a close look at this at some point.

Owner

mrdoob commented Nov 5, 2013

Hmmm... I'll have to take a close look at this at some point.

@kaanozcan

This comment has been minimized.

Show comment
Hide comment
@kaanozcan

kaanozcan Nov 8, 2013

Does this means we can do layered animation now?

kaanozcan commented Nov 8, 2013

Does this means we can do layered animation now?

Joosua added a commit to realXtend/WebTundra that referenced this pull request Jan 31, 2014

@insominx

This comment has been minimized.

Show comment
Hide comment
@insominx

insominx Mar 21, 2014

Contributor

I think I'll have some more time to work on this in a couple weeks. What would you like to see in order to get this merged?

Contributor

insominx commented Mar 21, 2014

I think I'll have some more time to work on this in a couple weeks. What would you like to see in order to get this merged?

@mrdoob

This comment has been minimized.

Show comment
Hide comment
@mrdoob

mrdoob Mar 22, 2014

Owner

Hmmm... I think before merging I wanted to clean up what's there right now.

I'm thinking that may be nice to have this kind of api...

var skeleton = new THREE.Skeleton( bones );
var mesh = new THREE.SkeletonMesh( mesh, skeleton );

Also would be nice, for debugging purposes to do a nice SkeletonHelper, which has been started in #4521.

That way we'll be able to visualise the skeletons and the blending nicely.

What do you think?

Owner

mrdoob commented Mar 22, 2014

Hmmm... I think before merging I wanted to clean up what's there right now.

I'm thinking that may be nice to have this kind of api...

var skeleton = new THREE.Skeleton( bones );
var mesh = new THREE.SkeletonMesh( mesh, skeleton );

Also would be nice, for debugging purposes to do a nice SkeletonHelper, which has been started in #4521.

That way we'll be able to visualise the skeletons and the blending nicely.

What do you think?

@insominx

This comment has been minimized.

Show comment
Hide comment
@insominx

insominx Apr 2, 2014

Contributor

I agree that factoring out the skeleton into it's own object would be more clean and readable.

As for the THREE.SkeletonMesh, are you suggesting a different object for that or rather making it a part of THREE.SkinnedMesh?

var mesh = new THREE.SkinnedMesh( geometry, material, skeleton, useVertexTexture )

Or perhaps THREE.SkinnedMesh could be modified to be composed of a THREE.Mesh and a THREE.Skeleton?

var mesh = new THREE.SkinnedMesh( mesh, skeleton )

Or THREE.SkinnedMesh could create its own THREE.Skeleton using the bones passed in geometry.bones.

Contributor

insominx commented Apr 2, 2014

I agree that factoring out the skeleton into it's own object would be more clean and readable.

As for the THREE.SkeletonMesh, are you suggesting a different object for that or rather making it a part of THREE.SkinnedMesh?

var mesh = new THREE.SkinnedMesh( geometry, material, skeleton, useVertexTexture )

Or perhaps THREE.SkinnedMesh could be modified to be composed of a THREE.Mesh and a THREE.Skeleton?

var mesh = new THREE.SkinnedMesh( mesh, skeleton )

Or THREE.SkinnedMesh could create its own THREE.Skeleton using the bones passed in geometry.bones.

@insominx

This comment has been minimized.

Show comment
Hide comment
@insominx

insominx Apr 2, 2014

Contributor

Also, I'm working on a visualization to help debug animations and blends. Here's what I've got so far: http://www.realitymeltdown.com/WebGL3/skeletal-anim-inspector.html

The top row of meshes each play a single animation. The mesh on the bottom will blend according to the weights set in the gui. You can change the speed of the animation as well as take individual time steps.

Sometimes blends will look terrible without some special massaging (ie time warping) and this demo will help make it more obvious as to whether there is a problem with the code or the art.

Contributor

insominx commented Apr 2, 2014

Also, I'm working on a visualization to help debug animations and blends. Here's what I've got so far: http://www.realitymeltdown.com/WebGL3/skeletal-anim-inspector.html

The top row of meshes each play a single animation. The mesh on the bottom will blend according to the weights set in the gui. You can change the speed of the animation as well as take individual time steps.

Sometimes blends will look terrible without some special massaging (ie time warping) and this demo will help make it more obvious as to whether there is a problem with the code or the art.

@mrdoob

This comment has been minimized.

Show comment
Hide comment
@mrdoob

mrdoob Apr 2, 2014

Owner

As for the THREE.SkeletonMesh, are you suggesting a different object for that or rather making it a part of THREE.SkinnedMesh?

var mesh = new THREE.SkinnedMesh( geometry, material, skeleton, useVertexTexture )

Or perhaps THREE.SkinnedMesh could be modified to be composed of a THREE.Mesh and a THREE.Skeleton?

var mesh = new THREE.SkinnedMesh( mesh, skeleton )

I think both options are ok. Thinking about it again, maybe the first one is more intuitive.

Also, I'm working on a visualization to help debug animations and blends. Here's what I've got so far: http://www.realitymeltdown.com/WebGL3/skeletal-anim-inspector.html

Looking good!

Hmmm, Show bones doesn't seem to work?

Owner

mrdoob commented Apr 2, 2014

As for the THREE.SkeletonMesh, are you suggesting a different object for that or rather making it a part of THREE.SkinnedMesh?

var mesh = new THREE.SkinnedMesh( geometry, material, skeleton, useVertexTexture )

Or perhaps THREE.SkinnedMesh could be modified to be composed of a THREE.Mesh and a THREE.Skeleton?

var mesh = new THREE.SkinnedMesh( mesh, skeleton )

I think both options are ok. Thinking about it again, maybe the first one is more intuitive.

Also, I'm working on a visualization to help debug animations and blends. Here's what I've got so far: http://www.realitymeltdown.com/WebGL3/skeletal-anim-inspector.html

Looking good!

Hmmm, Show bones doesn't seem to work?

@insominx

This comment has been minimized.

Show comment
Hide comment
@insominx

insominx Apr 4, 2014

Contributor

Update:

I've fixed up the demo linked above quite a bit including hooking up the "show bones" option. Stepping and pausing work together much better as well.

I've pulled the latest three dev branch and re-merged the blending code. In the process I've fixed a couple areas I'd consider buggy that we can talk about when I submit a new / separate pull request.

Also, currently I have fade in/out code inside animation to alter the blend weights. This adds some additional complexity and may not be as flexible if you want to have direct control over modifying the weights over time yourself. I'm thinking there needs to either be a separate object to control weighting (fade in/out, cross fading, etc..) or maybe incorporate that into THREE.AnimationHandler. What do you think?

Contributor

insominx commented Apr 4, 2014

Update:

I've fixed up the demo linked above quite a bit including hooking up the "show bones" option. Stepping and pausing work together much better as well.

I've pulled the latest three dev branch and re-merged the blending code. In the process I've fixed a couple areas I'd consider buggy that we can talk about when I submit a new / separate pull request.

Also, currently I have fade in/out code inside animation to alter the blend weights. This adds some additional complexity and may not be as flexible if you want to have direct control over modifying the weights over time yourself. I'm thinking there needs to either be a separate object to control weighting (fade in/out, cross fading, etc..) or maybe incorporate that into THREE.AnimationHandler. What do you think?

@insominx insominx closed this Apr 8, 2014

@insominx insominx deleted the insominx:dev branch Apr 8, 2014

@vincent vincent referenced this pull request May 23, 2014

Open

Very impressive #11

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment