BuenHogar

Starting from the client's original concept, I took over the character design: I redrew Tilo as clean vectors, gave it a soft fake-3D look with gradients and inner shading, and added the glow that shifts color with each mood. The result is a rounded blob with just enough features to read emotion, even at avatar size. The rig uses bones and constraints for eye tracking and head tilt, driven by two properties (mouseX and mouseY, 0 to 100) that the dev team feeds straight from React. To keep Tilo from looking robotic when nobody's interacting, the state machine picks randomly between four idle animations, with separate layers for blinking and breathing. On top of the idle, Tilo has five emotional states: Working, Thinking, Oops, Curious and Happy. Each one is a single trigger the app can fire, and each mood has its own color: orange at rest, teal when working, blue when thinking, red for oops, purple when curious and yellow when happy. Every change blends color, shape and posture, so moods flow into each other instead of cutting. Everything lives in one .riv file with a camera property that frames Tilo at four distances, from full body to a close-up of the face, so the same character fits the landing page or a small chat avatar. The handoff included a short guide with every property name and value for the developers.