Tributary Arms and Motion

First Written    Sat Oct  2 19:06:44 2021
File Modified    Wed Feb 14 18:32:26 2024
Latest Upload    Thu Sep 19 03:09:54 2024

Warning: These early blog posts are going to contain videos I took in-the-moment to share with my girlfriend and Discord friends. Going forward, I will be using screen capture, but for now you can have fun looking at the Moiré patterns on my screen!

In this post, you can meet Swimmi, who will be one of two playable characters in Tributary! Swimmi wears water wings while walking, adding to the mysterious ambiguity of whether she's actually underwater! Naturally, her male counterpart will be Dove, because swimming and diving are naturally symbiotic.

Because I wanted my characters' motions to feel more real, I decided to make animations dynamic where possible. For example, picking up an item should actually involve reaching over and grabbing the item with a hand.

To make initial use of the system, I opted to have Swimmi track the mouse with her upper body. This also lends herself to being easily made to dance by enterprising players:

Achieving this meant two things:

1. Different body parts needed to be split into different objects
2. Art assets needed to be split as well, and still look connected even when rotated

I'll explain the other parts of her node-based architecture in another post, maybe one for Pilum as I use similar design patterns for both games!

To actually make her move and calculate her arm positions, I used some inverse kinematics techniques I learned in robotics class to control our robot's limbs:

1. When the game starts, I rotate all of her limbs to neutral positions, so that I can dynamically get fully extended limb length
   • This lets the player character code be reusable, for other characters or in case I update her art assets
2. Then, during gameplay, I rotate her parts towards the cursor
   • Rotation is clamped within reason, so that her head and torso don't veer into body horror territory
   • I rotate her head, torso, and arms
     • For her arms, I treat her bicep + forearm as two sides of a triangle, with the "imaginary side" being what gets actually rotated towards the cursor
     • This invisible imaginary side is also the distance between the shoulder and hand, which makes setting her hand placements very easy!
3. Finally, I change her elbow angle to extend or shorten the "imaginary side" depending on how far the cursor is!

Here's the initial product before improvements:

Some other things I've added to smooth her out include:

1. Only moving her torso when the cursor is far away, allowing more accurate control when the cursor is near, and faster control with large mouse swings
2. Using linear interpolation to smooth out all of her motion: all joint rotations follow a curve where they will swing fast to make up large differences between limb positions, then decelerate (as opposed to instantly rotating)
3. For flipping the character over the y-axis, the flip is first queued up, then the model waits until all limbs are in a neutral close-to-middle position before flipping, to mitigate the jarring look of flipping with arms extended

Now that her arms work, next up is realistic leg motion!

For now, she can hop like a rabbit with t-rex arms through the endless waters of the tributary.

Tags: Blog, Tributary with Moons