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