PRACTICAL FIELD GUIDE
What is a website mascot?
A practical introduction to website mascots: static illustrations, animated loops and interactive characters, with useful roles and questions to ask before commissioning one.
Read the guide ↗THE FIELD GUIDE
A little character knowledge.
Practical guides to planning, designing and implementing website mascots. Explore cursor tracking, Rive, performance, animation formats and project costs.
PRACTICAL FIELD GUIDE
How to add a mascot to your website.
Follow a practical integration sequence: choose the role, prepare the asset, reserve layout space, connect behavior and check accessibility and performance.
Read the guide ↗PRACTICAL FIELD GUIDE
How to make a character follow the cursor.
Understand pointer coordinates, normalization, gaze inputs, smoothing and movement limits. Design a useful mobile and reduced-motion fallback before shipping.
Read the guide ↗PRACTICAL FIELD GUIDE
Five useful ways to put a mascot to work.
Explore interaction patterns for hero sections, onboarding, empty states, purchases and AI assistants. Learn what makes each example useful and where to use restraint.
Read the guide ↗PRACTICAL FIELD GUIDE
What does a website mascot cost?
Understand the factors behind a mascot quote: existing artwork, custom design, rig complexity, reactions, website integration, revisions and advanced AI or voice states.
Read the guide ↗PRACTICAL FIELD GUIDE
A practical guide to Rive website mascots.
Learn how artwork, a Rive rig, a state machine and website inputs work together. Understand the delivery contract and the checks that matter before launch.
Read the guide ↗PRACTICAL FIELD GUIDE
Interactive mascot or GIF: which fits the job?
Compare a fixed animation loop with an interactive character. Consider behavior, visual quality, runtime cost, accessibility and the maintenance your website needs.
Read the guide ↗LET'S MAKE A CONNECTION
Ready to bring your
mascot to life?
Your character. Your personality. A whole new way to interact.