Interactive Rive Mascot Rig

Job ID: 40291610

Budget: $275 – $350 USD

I have a single high-res illustration of my bear mascot, Roji (glasses + graduation cap), and I want to bring him to life inside my Vite + React web app using the Rive runtime. Starting from that flat image you will:

• Isolate and prepare the artwork layers so every limb, facial feature, cap, etc. is independently controllable.
• Rig the character in Rive, setting up bones, constraints and mesh deformation for natural movement.
• Animate a complete set of state-machine driven actions: idle, listening and speaking, plus the specific gestures I need—wave, nod, dance, jump, cheer—as well as facial expressions like smile and frown.
• Create mood states (Happy, Sad, Excited, Curious/Thinking) that can blend with those actions.
• Wire a parameter in the state machine that responds to real-time audio amplitude from my TTS engine so Roji’s mouth opens and closes in sync with the voice.
• Deliver a production-ready .riv file with clearly named inputs (e.g. action, mood, amplitude) so I can drive everything from React.

Acceptance criteria
– All states and transitions work in the official Rive Web runtime without modification.
– Mouth movement follows an amplitude value I feed at 30-60 fps, with no visible lag.
– No artifacts when gestures or moods blend; mesh remains stable on resize.
– File, layers and inputs are tidy and documented in a short README.

If you have shipped similar real-time Rive rigs before, I’d love to see them—otherwise a quick proof-of-concept gif is fine. Let’s make Roji an engaging, responsive study buddy for our users.

Specs / deliverables
• Starting from one Roji image (bear with glasses + graduation cap). You’ll handle layer separation/rebuild as needed, but keep the design identical (no redesign/color changes).
• Deliver:
1. final roji.riv (production-ready)
2. the separated parts you create (PSD/AI or PNG parts)
3. short screen recording showing mode/mood changes + mouthOpen scrub in Rive preview
4. 1-page integration notes (state machine + inputs + test steps)

State machine (please use exact names)
• State machine: RojiSM
• Inputs:
• mode (Number): 0=idle, 1=listening, 2=speaking
• mood (Number): 0=neutral, 1=happy, 2=confused, 3=thinking
• mouthOpen (Number): 0.0–1.0 (driven by TTS audio amplitude ~30–60fps)

Animations
• Idle loop (breathing, natural blinks, subtle head/eye motion)
• Listening loop (attentive posture + focused eyes)
• Speaking loop (gentle head bob + mouth driven by mouthOpen)
• Moods: happy, thinking, confused (cleanly integrated with mode)

Quality/performance
• Optimized for web runtime + mobile browsers
• No drift (glasses/eyes/pupils), no jitter/popping
• MouthOpen must look smooth under rapid updates (no flicker/double mouth)

Acceptance test
• Toggle mode 0→1→2→0 twenty times without breaking/sticking
• Scrub mouthOpen 0→1 stays aligned and smooth

Timeline: Ideally Milestone 1 in 5–7 days, Milestone 2 in the next 5–7 days (open to your recommendation).