Communitygithub.com

claudes-world/plugins

在任何动画或过渡(CSS、JS、SwiftUI/UIKit、Remotion/视频、Framer Motion、GSAP、画布或手动驱动)编写前必须阅读。涵盖组合动画(交错、永不同步)、弹簧感与时间控制、叠加动画、手势到动画的速度传递以及可中断性的运动指导。

plugins 是什么?

claudes-world/plugins 是一个专注于动画与过渡设计的 AI 技能,适用于前端开发、移动端开发、视频渲染以及交互设计场景。该技能旨在提供统一的运动指导,帮助开发者避免常见陷阱,例如动画同步导致的僵硬效果、缺乏自然感的速度传递以及中断处理不当。它涵盖的关键概念包括:交错动画(stagger)以增强层次感、弹簧感与时间曲线的选择、叠加动画的正确用法、从手势到动画的速到传递(velocity handoff),以及动画的可中断性设计。该技能支持多种平台和框架,包括 CSS、JavaScript 动画库(如 GSAP 和 Framer Motion)、原生移动 UI(SwiftUI/UIKit)、视频渲染工具(如 Remotion )以及 Canvas 图形绘制。当检测到用户输入中涉及 'animate'、'animation'、'transition' 等关键词时,该技能会自动激活,确保在执行任何动画相关代码之前,首先引入这些核心运动原则。

兼容平台✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/claudes-world/plugins/tree/dev/plugins/interaction-craft/skills/motion

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

plugins 是做什么的?

在任何动画或过渡编写前必须阅读——包括 CSS、JavaScript、SwiftUI/UIKit、Remotion/视频、Framer Motion、GSAP、画布或手动驱动。涵盖组合动画的运动指导:交错(stagger,永不同步)、弹簧感与时间控制、叠加动画、手势到动画的速度传递以及可中断性。触发关键词包括:'animate'、'animation'、'transition'、'fade in'、'slide in'、'easing'、'spring'、'duration'、'keyframes'、'motion design'、'micro-interaction'、'make it fee'

相关技能