loading...
Cover image for WebGL2 : 136 : Quaternion Swing and Twist

WebGL2 : 136 : Quaternion Swing and Twist

sketchpunk profile image SketchPunk ・1 min read

This is the second video I put together to show a concept that helped me build my IK Rigs system. This is a concept of breaking rotation down into two separate rotations, one that swings then another that twists after the swing is complete.

Why do this? Well, lets talk about this example. In a TPose, I have 2 arms stretching straight out to the body's sides. The arms have a default orientation. To have control over how the arm moves its easier to break rotation down into two parts. So if I want the left arm to point straight, I can just create a rotation from Two Vectors, from LEFT to FORWARD, which when applied will move the arm so its pointing straight, but hand did not change its original orientation. From here, if I want to change the overall twisting of the arm or hand, I can then apply a twist rotation, for example changing a palm of the hand that's facing down to start facing up.

In this video I step through how to take an existing rotation and break things down into simple data, direction and twist angle. This means I can save two different rotations as a single vec4 [ dir_x, dir_y, dir_z, twist_angle ]. Then I take that data and apply it to another object by recreating the swing and twist quaternions which results with both objects now face at the same direction and orientation.

[Video Tutorial]

[Source]
https://github.com/sketchpunk/FunWithWebGL2/tree/master/lesson_136_quaternion_swing_twist

Posted on by:

sketchpunk profile

SketchPunk

@sketchpunk

10% luck, 20% skill, 15% concentrated power of will. 5% pleasure, 50% pain, And a 100% reason to remember the name.

Discussion

markdown guide