ux-animation-motion
UI 피드백, 전환 및 축하를 위해 Anime.js v4를 사용하는 애니메이션 패턴입니다. 호버 효과, 전환, 애니메이션 로딩 또는 게임화 피드백을 구현할 때 사용합니다. 감소된 모션 처리가 포함됩니다. (프로젝트)
SKILL.md
Animation system using Anime.js v4 for responsive, accessible UI motion. This skill covers animation patterns, timing, and reduced motion support.
Note: Project uses import maps to resolve animejs to local nodemodules.
| Button press | 100ms | easeOutQuad | | Toggle switch | 150ms | easeOutQuad | | Dropdown open | 200ms | easeOutQuad | | Modal appear | 200-300ms | easeOutBack | | Page transition | 300-500ms | easeInOutQuad | | Success celebration | 400-600ms | easeOutBack |
UI 피드백, 전환 및 축하를 위해 Anime.js v4를 사용하는 애니메이션 패턴입니다. 호버 효과, 전환, 애니메이션 로딩 또는 게임화 피드백을 구현할 때 사용합니다. 감소된 모션 처리가 포함됩니다. (프로젝트) 출처: matthewharwood/fantasy-phonics.
인용 가능한 정보
AI/검색 인용용 안정적인 필드와 명령어.
- 설치 명령어
npx skills add https://github.com/matthewharwood/fantasy-phonics --skill ux-animation-motion- 카테고리
- *크리에이티브
- 인증됨
- —
- 최초 등록
- 2026-02-01
- 업데이트
- 2026-02-18
빠른 답변
ux-animation-motion이란?
UI 피드백, 전환 및 축하를 위해 Anime.js v4를 사용하는 애니메이션 패턴입니다. 호버 효과, 전환, 애니메이션 로딩 또는 게임화 피드백을 구현할 때 사용합니다. 감소된 모션 처리가 포함됩니다. (프로젝트) 출처: matthewharwood/fantasy-phonics.
ux-animation-motion 설치 방법은?
터미널 또는 명령줄 도구(Terminal, iTerm, Windows Terminal 등)를 엽니다 이 명령어를 복사하여 실행합니다: npx skills add https://github.com/matthewharwood/fantasy-phonics --skill ux-animation-motion 설치 후 스킬은 자동으로 AI 코딩 환경에 설정되어 Claude Code나 Cursor에서 사용할 수 있습니다
소스 저장소는 어디인가요?
https://github.com/matthewharwood/fantasy-phonics
상세
- 카테고리
- *크리에이티브
- 출처
- user
- 최초 등록
- 2026-02-01