Roboface-an Interactive Face Animation Tracker

I want you to imagine a character that tracks your mouse and expresses emotions based on how you interact with it. Emotions range from happy, surprised, bored, or neutral. The character in this case is a 2D face, a playful experiment to build something that feels alive. See it on GitHub or try the live demo.

😄 What It Does

The face shifts between emotional states—happy, surprised, bored, or neutral—based on mouse position and activity, acting like a finite state machine:

• Eyes track the cursor for a lively effect.
• Gets happier (smiling, blushing) when the mouse is closer.
• Shows surprise after a pause in interaction.
• Turns bored after long inactivity.
• Settles to neutral with less activity.

Smooth transitions come from CSS and JavaScript, adjusting eye movement, mouth shape, and blush.

The current version is version 2. Here’s a screenshot of an earlier version where I tried to include eyebrows on the face avatar to make it more expressive.

🧠 HRI Inspiration

This project came from a human-robot interaction course at Carnegie Mellon, where I explored how robots evoke emotions. The Keepon robot, with its simple, expressive movements, inspired me to create a virtual version with similar charm.

HRI concepts in the project:

• Feedback Loop: Boredom prompts mouse movement, which shifts the face to happiness, creating an interaction cycle.
• Agency: The face seems to “choose” emotions (like happiness when approached), despite being algorithmic.
• Affective Interaction: Emotions like happiness or surprise aim to spark a response in the user.
• Social Presence: The face feels like a social entity through its reactions.
• Proxemics: Emotions change with the mouse’s virtual proximity, mimicking real-world closeness.
• Uncanny Valley: A cartoonish style keeps it approachable, avoiding eerie realism.

Note: It feels alive, but it’s just pixels driven by code.

🌟 Other Projects

Since building this in May 2025, I’ve noticed similar projects. xAI’s Grok Companions (July 2025) introduced animated characters like “Ani” for premium users. Emotionally adaptive AI companions, discussed in tech blogs around August 2025, focus on emotional support but lack a specific project page. KEYi Robot’s automated companions (August 2025) also emerged. These focus on conversation and emotional support but don’t react to user movement or proximity like this face does.

This is my take on blending HRI with code to create something lively and fun.