花叔 Design
用 HTML 直接产出可交付的原型、幻灯片、动画和视觉设计。
SKILL.md明确要求用户确认方向、在关键检查点暂停、记录授权、使用占位符避免编造，并警告不要把私人资产放入技能目录，体现了一定的确认、数据边界和可追溯性。扣分原因是大量流程要求WebSearch、下载品牌资产、调用外部脚本和默认导出含音频视频，但没有细化网络请求、依赖权限、敏感数据处理、资源许可核验、回滚或失败后的清理机制；发布者也未通过策展注册表验证。
文档对路由、检查点、Playwright验证、视频校验和多种降级路径有较完整描述。扣分原因是关键能力依赖未保证存在的WebSearch、TaskCreate、subagent、HyperFrames、npm/Playwright及大量未提供的references/assets/scripts；存在流程复杂、工具假设多和维护成本高的问题，且静态阅读无法确认关键路径可运行，因此不超过10分上限。
目标受众、适用场景和不适用的生产级Web App/后端系统写得清楚，覆盖原型、deck、动画、信息图和评审，并明确弱runtime降级；中文支持明确。扣分原因是强制所有新视觉任务先做三版并等待用户选择，可能不适合简单或时限敏感任务；核心流程依赖WebSearch、npm生态、外部图片源和视频工具，在中国大陆网络环境下可达性未说明且可能受限。
SKILL.md有较清晰的任务路由、渐进式引用、检查点、异常处理和限制说明；README、package metadata、MIT许可证和版本变更信息提供了安装与治理线索。扣分原因是文档极其庞大，引用了大量未随本次材料展示的文件和工具；版本兼容矩阵、维护责任、更新渠道、依赖安装和故障排查仍不完整，且技能本身没有明确的维护承诺。
技能明确规定HTML、可点击原型、deck、MP4/GIF、PPTX和评审等目标输出，并提供较具体的流程、模板和边界；README还列出预期交付物。扣分原因是静态审查不能验证输出正确性，且实际结果依赖未核实的外部工具、素材获取、浏览器渲染和音视频链路；强制三方向、资产搜集和多阶段确认也可能使简单任务成本过高，因此不超过7分。
仓库材料包含README中的示例、测试提示、锁定依赖版本、脚本名称和若干演示声明，提供有限的审计线索。扣分原因是没有看到覆盖SKILL.md关键路径的真实CI与提交测试套件；A/B测试、实际演示和质量数字主要是作者自述，无法在静态阅读中独立复现或交叉 corroborate，因此只能给低分。
- 不要把默认WebSearch、外部资产下载、联网素材来源或音视频导出视为已验证能力；在受限网络、无相应工具或无用户授权时应先确认并提供本地降级方案。
- 应在执行前核对references、assets、scripts、Node/Playwright/HyperFrames版本及依赖许可；当前材料未证明这些关键路径可运行。
- 默认强制三方向和多轮暂停可能显著增加简单任务成本；用户应明确是否接受该流程及外部资源使用。
它能做什么 & 适用场景
花叔 Design 是一个面向 Agent 的 HTML 原生设计技能，适合制作高保真交互原型、演示幻灯片、时间轴动画、信息图和数据可视化。它通过设计方向顾问、品牌资产流程、变体探索和五维评审，帮助用户在需求模糊或缺少设计上下文时确定方向。输出可包括 HTML、MP4、GIF、PDF 和可编辑 PPTX。它不适合生产级 Web App、SEO 网站或需要后端的动态系统。
读取用户提供的品牌资产、设计系统、截图或代码上下文；在需求模糊时提出并制作三种设计方向；使用 HTML/CSS 和可选的 React/Babel 组件制作原型、幻灯片、动画和信息图；通过 Playwright 截图和交互验证；使用仓库脚本导出 PDF、PPTX、MP4 和 GIF，并可加入 BGM 与 SFX；按哲学一致性、视觉层级、细节执行、功能性和创新性进行五维评分。
- 产品经理需要一个可点击的 App 或 Web 高保真原型来演示用户流程。
- 演讲者需要一套可在浏览器播放、并可导出为 PDF 或 PPTX 的 HTML 幻灯片。
- 营销或产品团队需要将一段概念转化为带 BGM 和 SFX 的 MP4 或 GIF 动画。
- 设计团队缺少明确风格参考，希望先比较三种真实视觉方向。
- 团队需要对现有设计进行结构化评分，并获得 Keep、Fix 和 Quick Wins 清单。
优缺点一览
- 覆盖原型、幻灯片、动画、信息图、设计变体和专家评审等多类视觉产出。
- 明确强调品牌资产、真实图片、可读性和反 AI slop 规则。
- 提供 Playwright 验证、HTML 到 PDF/PPTX 导出以及 MP4/GIF 处理脚本。
- MIT 许可，支持个人和商业用途。
- 不适合生产级 Web App、SEO 网站或需要后端的动态系统。
- 完全没有品牌或设计上下文时，README 明确承认质量可能下降到约 60–65 分。
- 复杂 3D、物理模拟和粒子系统超出其边界。
- 来源未展示独立的自动化测试套件；验证主要依赖 Playwright 和脚本流程。
- 部分能力依赖 Node.js、Python、Playwright、网络访问及本地文件操作。
如何安装
在支持 Agent Skills 的环境中运行：npx skills add alchaincyf/huashu-design。来源说明 Claude Code、Codex、Cursor、OpenClaw 和 Hermes 等环境可使用。
如何使用
安装后直接用自然语言描述任务，例如：「做一份 AI 心理学的演讲 PPT，推荐 3 个风格方向让我选」或「把这段逻辑做成 60 秒动画，导出 MP4 和 GIF」。具体品牌任务应提供 logo、色板、UI 截图或品牌规范；幻灯片、动画和导出流程会使用仓库中的相关脚本与资源。
对比同类
README 将其与 Claude Design 对比：Claude Design 是图形界面产品并偏向画布与 Figma 导出；花叔 Design 是对话式 Agent Skill，重点输出 HTML、MP4、GIF、PDF 和可编辑 PPTX，并强调跨 Agent 使用。