Tutorial 2: Animations and Layers
If you want to add a bit more motion to your avatar, you can use RahiTuber’s Sprite Sheet feature. We’ll start from the end of Tutorial 1.
Part 1: Sprite sheets
In the main (only) layer, click the Idle sprite and browse to select “Demo_Sprites/Advanced_sprites/body_idle.png”. This is a sprite sheet - an animation of frames laid out in a grid, from first to last. This one only has 2 frames.
Before we do anything else, it will look strange - the idle sprite now appears twice on the screen (all frames appearing at once). To set up the sprite sheet properly, we need to open the “Sprite Sheet Setup” dialog by clicking the little film-clip icon next to the sprite.
We’ll see the following popup. This is how we tell RahiTuber to read the animation from the sheet. Our “body_idle” sheet has two columns and one row, so input the correct numbers in the first two boxes.
When this is done, the “Frame Count” will automatically adjust itself to match the maximum available from a grid of that size. If your sprite sheet doesn’t fill the whole grid, you’ll have to manually adjust this number. I’ll set the FPS to 7.
We’ll leave Frame Size as (-1,-1). This will be automatically calculated from the image dimensions and the number columns/rows. If you want to specify it manually, you can do that instead. When we click Save, the sprite will go back to its expected position and will be animated.
Do the same for the talk and blink sprites, replacing them with “body_talk.png” and “body_blink.png” respectively. For body_talk, the animation sheet has 3 columns and 2 rows.
Now we’re roughly where we started, except that the avatar is animated, and appears to be missing some parts. We’ll add those with new layers!
Part 2: Layers
Let’s rename the existing layer to “Body”. Then we’ll add two more layers: One called “Chest” and another called “Arms”. Chest is easiest, so we’ll start there. For the idle sprite, add “Advanced_sprites/chest.png” and set the animation settings to show 2 columns, 1 row, and 7 FPS.
Now - the chest will not be talking or blinking, so we can turn off the “Swap when Talking” and the “Blinking” options.
To make sure the chest follows the body movement, we will set the “Motion Inherit” option to follow the Body layer.
And now we come to the reason the Chest layer is separate - physics! Don’t give me that look. We all know why VTubers got popular 😛
Expanding the Motion Inherit options gives us some numbers to play with. Feel free to tweak these and see what they do. I recommend the following setup in this situation:
For the Arms layer, we’ll turn off “Swap when Talking” as before, but this time we’ll keep the “Blinking” option and repurpose it. Set the “Talk Threshold” to maximum since we don’t need it.
The idle sprite (“arms_idle.png”) is also a 2 x 1 grid at 7 FPS, so we need to set up those animation options again. Then we’ll add our Blink sprite “arms_gaming.png”, which is 3 x 2.
We’ll set up the Blinking options so that the arms will start “gaming” at random intervals - A Duration of 5 seconds, a Delay of 10 seconds, and a Variation of 5 seconds. The Delay will be randomly changed up to the limit of Variation (i.e. Delay can be between 5 and 15 seconds here).
You may notice by now that the avatar doesn’t blink while you’re talking. On the Body Layer, let’s enable the “Blink While Talking” option. A new sprite will pop up:
We can load in “body_talkblink.png” and set it up as a 3 x 2, 7 FPS sprite sheet. The difference here is that the sprites have the eyes closed and the mouth open.
We now have an animated avatar with physics and gaming hands!