SrP-Skillsskill gazette & source index

community skill

Huashu Design

HTML 原生的设计 skill,3-30 分钟交付高保真原型、幻灯片、动画、信息图。内置 20 设计哲学 + 5 维评审 + 40 种风格库 + MP4/GIF/PPTX 导出,Agent-agnostic。

communitysingle filedesignhtmlprototypeanimationslidesmp4-exportagent-skill

Huashu Design 花叔设计

HTML 原生的设计 skill,在你的 agent 里打一句话,3-30 分钟拿回一份能交付的设计——高保真原型、幻灯片、动画、信息图。不是「AI 做的还行」那种水平,是看起来像大厂设计团队做的。

来源

适合什么时候用

  • 需要快速生成可交互的 iOS/Web 原型,带真机边框和多屏切换。
  • 需要制作演讲幻灯片,导出 HTML deck + 可编辑 PPTX。
  • 需要创建产品发布动画,导出 MP4 + GIF + BGM。
  • 需求模糊时想要设计方向建议,用三套顾问逻辑直接出 3 版视觉方案。
  • 需要对已有设计做专家级 5 维度评审。

核心能力

能力交付物典型耗时
交互原型单文件 HTML · 真 iPhone bezel · 可点击10-15 min
演讲幻灯片HTML deck + 可编辑 PPTX15-25 min
时间轴动画MP4(25/60fps)+ GIF + BGM8-12 min
设计变体3+ 并排对比,实时调参10 min
信息图印刷级排版,可导 PDF/PNG/SVG10 min
设计方向顾问三套逻辑并行,直接出 3 版真实视觉5 min
5 维度评审雷达图 + Keep/Fix/Quick Wins3 min

设计哲学

  • 40 种 HTML 原生风格库(网页 20 + PPT 20),纯 CSS 无需生图。
  • 三套互补设计顾问逻辑:秒数轮盘(20 选 1)+ 现实参照获奖站 + 最佳设计师哲学。
  • 内置 20 条设计哲学 + 反 AI slop 规则,确保产出不像模板。

安装

npx skills add alchaincyf/huashu-design

跨 agent 通用——Claude Code、Cursor、Codex、OpenClaw、Hermes 等均可。

使用示例

「做一份 AI 心理学的演讲 PPT,推荐 3 个风格方向让我选」
「做个 AI 番茄钟 iOS 原型,4 个核心屏幕要真能点击」
「把这段逻辑做成 60 秒动画,导出 MP4 和 GIF」
「帮我对这个设计做一个 5 维度评审」