← 返回 Skills 市场
553
总下载
0
收藏
1
当前安装
1
版本数
在 OpenClaw 中安装
/install web-animation-design
功能描述
Design and implement web animations that feel natural and purposeful. Use this skill proactively whenever the user asks questions about animations, motion, e...
安全使用建议
This skill is instruction-only and low risk because it asks for no secrets and installs nothing. Before relying on it: 1) Verify the author/source (homepage is missing and the skill cites a paid/public course) to avoid copyright or licensing surprises. 2) Review and test any copy-paste code (some recommendations — e.g., import path 'motion/react' and the relative '/learn/...' link — look inaccurate or nonstandard). 3) Confirm accessibility recommendations (it does correctly remind to check prefers-reduced-motion). 4) Expect strict output formatting (the skill forces a specific markdown table format and an exact initial reply); if you use this in automated flows, ensure the agent can satisfy those constraints. If you need higher assurance, ask the publisher for provenance/links or request concrete examples that run in a sandbox before applying to production code.
功能分析
Type: OpenClaw Skill
Name: web-animation-design
Version: 1.0.0
The skill bundle is a comprehensive educational resource for web animation design, providing CSS easing curves, Framer Motion implementation details, and accessibility guidelines. The instructions in SKILL.md and PRACTICAL-TIPS.md are strictly aligned with the stated purpose of improving UI motion and contain no evidence of malicious intent, data exfiltration, or harmful prompt injection.
能力评估
Purpose & Capability
Name, description, and the full SKILL.md/PRACTICAL-TIPS content are aligned: the bundle is a design/implementation guide for web animations. It requires no binaries, env vars, or installs, which is proportionate for a documentation-style skill.
Instruction Scope
Instructions are prescriptive (initial canned response, mandatory markdown table format for reviews, and a decision tree). That is internally consistent with a stylistic guide, but a couple of content issues could cause operational problems: it recommends importing from "motion/react (NOT 'framer-motion')" which is nonstandard and may break users' builds, and it references a relative course path (/learn/easing-curves) that is not a public URL. The skill does not instruct reading unrelated files, exfiltrating data, or using secrets.
Install Mechanism
No install spec and no code files — instruction-only. Nothing will be written to disk or downloaded by the skill itself.
Credentials
The skill requests no environment variables, credentials, or config paths. There are no disproportionate permission requests.
Persistence & Privilege
always:false and default invocation settings are used. The skill does not request persistent system privileges or modify other skills.
如何使用
- 确保已安装 OpenClaw（本地或 Docker 部署）
- 在对话框中输入安装命令：
/install web-animation-design - 安装完成后，直接呼叫该 Skill 的名称或使用
/web-animation-design触发 - 根据 Skill 的参数说明提供必要输入，即可获得结构化输出
版本历史
v1.0.0
Initial release of **web-animation-design** skill for web animation best practices:
- Provides a comprehensive guide for designing purposeful, natural-feeling web animations, based on Emil Kowalski's animations.dev course.
- Includes clear triggers: activates for questions about motion, easing, timing, transitions, performance, or popular animation libraries (CSS, Framer Motion, React Spring, GSAP).
- Enforces accessibility: always check and respect `prefers-reduced-motion`.
- Specifies required review output as a markdown table (not "Before/After" text lists).
- Offers practical decision tree for choosing tools (CSS, Framer Motion, etc.) based on animation type and performance needs.
- Details best practices for duration, easing, and accessibility for different interaction types.
- Covers spring animation usage, configuration, and guidelines for lively or interruptible motion.
- Sets clear scope: only applies when animation or motion is explicitly requested.
元数据
常见问题
Web Animation Design 是什么？
Design and implement web animations that feel natural and purposeful. Use this skill proactively whenever the user asks questions about animations, motion, e... 它是一个面向 Claude Code / OpenClaw 的 AI Agent Skill 插件，目前累计下载 553 次。
如何安装 Web Animation Design？
在 OpenClaw 或 Claude Code 对话框中运行命令「/install web-animation-design」即可一键安装，无需额外配置。
Web Animation Design 是免费的吗？
是的，Web Animation Design 完全免费，采用 MIT-0 许可证，可自由下载、安装和使用。
Web Animation Design 支持哪些平台？
Web Animation Design 跨平台运行，可在任意部署了 OpenClaw / Claude Code 的环境中使用（cross-platform）。
谁开发了 Web Animation Design？
由 ai-ron（@aa-on-ai）开发并维护，当前版本 v1.0.0。
推荐 Skills