前言¶
做科普或技术分享时，常见路径是：先写稿，再手工做 PPT 或录屏。若希望产物是可直接打开、可分享的网页，还要自己搭页面结构和动效，成本往往比写内容更高。下面介绍的 Skill 把「输入科普文本 → 产出演示页面」收成一条可在 Agent 里触发的工作流，并内置 HTML 模板，减少从零写前端的时间。
这是什么¶
根据文字生成 HTML 演示动画（坐标 @user_ab5ae6ee/unclecheng-ai-animation-v1）是发布在 SkillHub 上的社区 Skill，当前版本 1.0.3，分类为 content-creation，发布者为 user_ab5ae6ee（SkillHub 页面标注维护者为 Uncle城）。标签 requires_api_key=false，表示按 SkillHub 元数据无需额外 API Key。
一句话定位：当用户提供科普类文本并希望生成演示页面时，由 Agent 按 Skill 内工作流与模板，输出 PPT 风格的单页 HTML 动画，或在流程图模式下对已有页面做样式重构。
官方入口：
- API 页：
https://api.skillhub.cn/user_ab5ae6ee/unclecheng-ai-animation-v1 - SkillHub 展示页：
https://www.skillhub.cn/skills/user_ab5ae6ee/unclecheng-ai-animation-v1
核心功能¶
以下能力均来自官方简介，未在资料中出现的细节不展开。
-
默认模式
将科普内容生成为仿 PPT 轮播的单页 HTML 动画网页，适合「一段文字 → 一页可演示的网页」。 -
流程图模式
使用 Skill 内置的 Animation 模板，将已生成的AI_Animation.html按平面 UI 样式重构，适合在已有动画页面上换一套流程图向的视觉结构。 -
触发方式
在用户输入科普内容并希望生成演示页面时由 Agent 触发。官方列出的触发词包括：「生成 PPT」、「生成演示网页」、「生成流程图」 等（具体匹配以 Agent 对 Skill 的加载为准）。 -
模板内置
Animation 等模板已内置于 Skill，无需在资料之外另行指定外部模板仓库。
安装与启用¶
SkillHub 页面给出的安装指引是：让 AI 参照 https://skillhub.cn/install/skillhub.md，安装坐标 @user_ab5ae6ee/unclecheng-ai-animation-v1。
若本机已安装 SkillHub CLI，可按官方文档将技能装到当前 Agent 的 skills 目录（安装时必须使用 --dir，否则默认落在 ./skills/ 且可能不被识别）。常用路径如下（摘自 SkillHub 安装文档）：
| 环境 | skills 目录 |
|---|---|
| Cursor | ~/.cursor/skills/ |
| Claude Code | ~/.claude/skills/ |
| Codex | ~/.codex/skills/ 或项目下的 .agents/skills/ |
检查 CLI 是否已安装：
command -v skillhub && skillhub --version
未安装时，官方提供完整安装（CLI + 默认 Skill）：
curl -fsSL https://skillhub-1388575217.cos.ap-guangzhou.myqcloud.com/install/install.sh | bash
仅安装 CLI：
curl -fsSL https://skillhub-1388575217.cos.ap-guangzhou.myqcloud.com/install/install.sh | bash -s -- --cli-only
安装本 Skill 的示意命令（将 <skills 目录> 换成上表对应路径）：
skillhub install user_ab5ae6ee/unclecheng-ai-animation-v1 --dir <skills 目录>
也可先搜索再安装：
skillhub search unclecheng-ai-animation
skillhub install user_ab5ae6ee/unclecheng-ai-animation-v1 --dir <skills 目录>
在 Cursor 中，完成安装后需确保 Agent 能加载该 skills 目录下的 Skill；若环境要求重启客户端，以你当前 Cursor 版本说明为准。资料中未单独区分 Codex CLI 与 Claude Code 对本 Skill 的差异化配置，此处不臆造。
典型用法¶
官方未提供固定示例文稿，但触发条件与模式在简介中写清，可按下面步骤复现意图（由 Agent 执行 Skill 内工作流，具体生成文件名以 Skill 约定为准）。
- 在对话中粘贴科普正文（段落、要点、术语解释等）。
- 使用默认模式时，附带意图明确的触发语，例如：「根据下面内容生成演示网页」 或 「生成 PPT」。
- 若已有
AI_Animation.html，并需要平面 UI 的流程图样式，使用 「生成流程图」 等表述，进入流程图模式，由 Skill 用内置 Animation 模板重构页面。 - 在浏览器中打开 Agent 产出的 HTML，检查轮播与版面是否符合预期；需要改稿时继续在同一对话中补充或修订文本，再触发一次生成。
适用场景与注意¶
适合谁
- 需要把科普、培训要点做成可分享单页 HTML 的作者或运营，且希望少写前端。
- 已有
AI_Animation.html，只想换成流程图向平面 UI 的场景。
限制与注意
- 产物形态以官方描述的「仿 PPT 轮播单页」和流程图重构为主，不等同于 PowerPoint 源文件或复杂数据可视化项目。
- Skill 面向「科普内容」类输入；极长文档、强交互应用是否在单页 HTML 内表现良好，取决于 Agent 执行与模板能力，资料未承诺上限，需自行试跑。
- 社区来源（
source: community），升级与行为变更以 SkillHub 上 v1.0.3 及后续版本为准；安装前可用skillhub查看来源与版本。 - SkillHub 统计（截至页面抓取）：评分 100000，下载 1479，安装 18；数字会随时间变化，以 SkillHub 页面为准。
结尾¶
根据文字生成 HTML 演示动画把科普文本到演示网页的路径收成可触发的工作流，默认出轮播式单页 HTML，并支持对 AI_Animation.html 做流程图模式重构；模板内置，且元数据标明无需 API Key。若你在 Cursor 或其他支持 Skill 的客户端里做内容演示，可从 SkillHub 安装 @user_ab5ae6ee/unclecheng-ai-animation-v1，并用官方触发语试一轮。
- SkillHub：
https://www.skillhub.cn/skills/user_ab5ae6ee/unclecheng-ai-animation-v1 - 安装说明：
https://skillhub.cn/install/skillhub.md
