Momo

The idea

An interactive red panda who follows your cursor, an apple, with his eyes, and reacts: happy, sleepy or surprised.

The process

Twelve poses were aligned pixel for pixel to an idle video. A small engine maps the angle and distance from his face to the cursor onto eight gaze directions and crossfades between them in about 165 ms.

Motion techniques

• Eight-direction gaze from cursor angle, with hysteresis
• Convex crossfade blend, so layers never turn see-through
• Idle breathing video when the apple rests
• Device-tilt gaze on phones
• Reactions to hover, stillness and clicks

The outcome

Playful but careful: AA contrast on every text, 44 px targets, keyboard-friendly mood cards, and a static version for reduced motion.