Loading interactive animation…
Process
I prepared the character illustration and separated it into animation-ready layers in Affinity Designer. Since the artwork was raster-based rather than vector, I used meshes in Rive to give each body part additional flexibility and enable natural deformation.
In Rive, I built the character rig using the bone system, connected the individual body parts, and refined the deformations. The final step was creating and animating a complete walk cycle directly in Rive.

Basic blend state
A basic blend state that transitions the animation between idle and walk cycles based on pointer movement.