motion-choreography

Plan accessible motion sequences with timing and easing recommendations.

Updated Apr 13, 2026

Search Tags:#performance #accessibility #animation #ux #motion

Ready to run

npx skills add https://github.com/Angusatgithub/Charmera --skill motion-choreography-angusatgithub

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: motion-choreography
Source: https://github.com/Angusatgithub/Charmera/tree/main/.github/skills/motion-choreography
Command: npx skills add https://github.com/Angusatgithub/Charmera --skill motion-choreography-angusatgithub

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It guides designers and developers in creating meaningful, performant motion that enhances user understanding and interaction without causing discomfort or delay.

Core Features & Use Cases

Animation Planning: Provides principles and timing suggestions for micro-interactions, page transitions, and complex choreographies.
Design Consistency: Ensures motion aligns with accessibility standards and performance best practices.
Use Case: A designer needs to animate a page transition smoothly; they consult this Skill for duration and easing recommendations and implement a state change animation that feels natural and accessible.

Quick Start

Consult this Skill for best practices and specifications when designing animations for onboarding sequences or user feedback interactions.

Frequently Asked Questions about motion-choreography

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

What is motion choreography in web interface design?▼

Motion choreography is the design of meaningful, performant animation sequences for web interfaces. It guides timing and easing to enhance user communication and experience without causing discomfort or delay.

How do I design accessible animations for page transitions?▼

Design accessible animations by consulting timing and easing recommendations to ensure smooth state changes. Align motion with accessibility standards to prevent discomfort while maintaining natural interaction.

What duration and easing should I use for micro-interactions?▼

For micro-interactions, use duration and easing specifications that feel natural and accessible. Consult motion design principles to ensure animations are purposeful, consistent, and performance-optimized.

Can I use motion choreography principles for onboarding sequences?▼

Yes, motion choreography principles apply to onboarding sequences. Consult best practices for animation planning to design user feedback interactions that are meaningful, accessible, and performant.

Why does my web animation feel jarring or uncomfortable?▼

Your web animation may feel jarring due to improper timing, easing, or lack of accessibility alignment. Apply motion choreography principles to ensure purposeful, consistent, and performant state changes.

When should I not use complex animations in UX design?▼

Avoid complex animations when they cause delay or discomfort, or when they lack clear purpose. Ensure motion sequences align with accessibility standards and performance best practices before implementation.