During lunch a few weeks ago we thought it would be cool to have a fully functional Clippy that can be embedded in any website. We fiddled around with it and we had an unexpected amount of fun laughing at Clippy and his antics.
We started thinking about the developers' state of mind when they created Clippy. Did they think it would really help people? It seems that Microsoft really believed that Assistants were the way of the future.
We built Clippy.js over the weekend to share that fun and whimsy with everyone, and to remind people to try new and risky things, even when they seem silly.
We built Clippy.js over the weekend to remind people to try risky and silly things.
- Play agent animations
- "Speak" to the user
- Move the agent around
- Use multiple agents at the same time
Behind the scenes
Agents are composed of multiple sets of animations.
However, unlike your Saturday morning cartoon, the animation is not linear.
For example, while Links the cat is idle, behind the scenes a coin is flipped, and 10%
of the time Links will turn about in boredom, or scratch behind his ears.
Add this code to you to your page to enable Clippy.js.
All the agent actions are queued and executed by order, so you could stack them.
// Play a given animation agent.Play('Searching');
// Play a random animation agent.animate();
// Get a list of all the animations agent.animations(); // => ["MoveLeft", "Congratulate", "Hide", "Pleased", "Acknowledge", ...]
// Show text balloon agent.speak('When all else fails, bind some paper together. My name is Clippy.');
// Move to the given point, use animation if available agent.moveTo(100,100);
// Gesture at a given point (if gesture animation is available) agent.gestureAt(200,200);
// Stop the current action in the queue agent.stopCurrent();
// Stop all actions in the queue and go back to idle mode agent.stop();