EFF Express Automation

Meet Mo

Your AI-powered companion — click to interact, double-click to run, or just watch Mo greet you.

Click to wave · Double-click to run

Mo's State

Idle

Interactions

0

🎨

Swap any image

Replace any PNG in images/mo/ and the site instantly uses the new art. No code changes.

🔌

Plug into React

Import CharacterController and call mo.setState('wave') from any event — login success, API response, button click.

🤖

Connect to Claude AI

Feed Claude API text into mo.say(text) and trigger Mo's expression based on sentiment — fully wired in js/character.js.

🎬

Upgrade to Rive / Lottie

See the next level: smooth skeletal animation, state machines, and true interactivity. Click to open the live tech demo.

Photo → Interactive Character

How to turn any image into a living, reactive web character using Rive, Lottie, or Three.js + Mixamo.

LIVE 3D

Mo — Interactive 3D Character

Built with vanilla Three.js. FBX animation from Mixamo. Click to interact.

UPGRADE — RECOMMENDED

Rive — Skeletal Animation + State Machines

The industry standard for interactive web characters. State machines wire interactions natively.

⚡

GPU-accelerated

120fps smooth animation via WebGL/Canvas. Files are 10–15x smaller than Lottie.

🎮

Native state machine

Define states (Idle, Wave, Follow) and inputs (MouseX, IsHappy, OnClick). Rive handles transitions automatically.

📦

One .riv file

Design, rig, animate, and wire interactions in the Rive editor. Export a single file. Drop it in your project.

⚛️

React-ready

Official @rive-app/react-canvas SDK. useRive + useStateMachineInput hooks. Works with Next.js.