[Example Project] Chain Physics with Two Anchors

Hi again! 

Last time we talked about how we can modify the chain controller script to add a collider. This time, we’ll go over how we can modify the chain controller to simulate a chain pinned to two points. 

Download Example Project

To do this, let’s consider how the chain controller works. The first point in the chain is updated according to its world position (let's call it an anchor), and then every point after has its position calculated based on its distance from the previous points position.

Let's try to move the last point (make the second anchor). When we change last point position we see that position of a point before that will not be recalculated, because we have only forward constraints.  What we need to do in this case is to add another set of constraints from the end to the beginning of the chain. And also add some iterations. 

We’ll start by setting up the Chain Controller as usual. Take a look at the template for more information

Next we will modify the chain controller based on our idea above. Take a look at the chain controller script in the example project to see the complete script. 

For each pair of chain links we will create a pair of distance constraints - forward (first anchor) and backward one (second anchor).

for (var i = 0; i < script.joints.length; i++) {
    if (i > 0) {
        var c = new global.Constraint(points[i - 1], points[i], script.stiffness, script.type == 0);
        constraints.push(c);// forward constraints
        links[i - 1].startDir = points[i].getPosition().sub(points[i - 1].getPosition());
    }
    if (i < lastIndex) {
        var c = new global.Constraint(points[i + 1], points[i], script.stiffness, script.type == 0);
        constraints.push(c); //adding back constraints
    }
}

And in updatePhysics function we will update last link, as well as the first one.

points[lastIndex].setPosition(global.MathLib.vec3.fromEngine(links[lastIndex].transform.getWorldPosition()))

For this example, we will use the elastic chain calculation. Since this type of chain is more dynamic, let's increase our calculation iterations from 3 to 5 to make it more stable. At the picture you can see how point positions converge with iterations

Let’s take a look at what we’ve got at this point:

Looks great! Let’s now use this technique to create a real Lens. 

I’ve created a face piercing chain in Blender, rigged it to the bones, and imported it into Lens Studio.Then, I set up a chain using updated ChainController script as above.

Now that the chain works, let's attach it to the face. To do this, we’ll pin the ends of our chain to a face mesh - that way as the user changes their face, our chain will continue to be pinned to the same part of the face. In this case, our Face Mesh is the same one we use to occlude anything behind the user’s face. 

Approximate nostril attachment setup: 

Approximate ear lobe attachment setup:  

Let’s add some final touches. We can add other objects to pin to the same face mesh, as well as imported makeup from the Makeup Template to complete the look. (You can see a stream recording about mixing different templates) 

To recap:

• Added a new set of constraints from the each next chain to the previous one
• Set up a rigged chain model
• Pinned first and last chain to the face mesh
• Added Makeup controller and post effects

Have fun!

Download Example Project