「打字。回车。一份能交付的设计。」
我第一次看到这句话，内心 OS 是：好家伙，AI 吹牛的姿势越来越文艺了。
然后我装上去试了一下。
我错了。我道歉。
背景：设计这件事，程序员的永恒噩梦
你有没有过这种经历：
产品需要一个 App 原型，你打开 Figma，调了半小时字体，发现自己还停在空白画布上。设计师 deadline 卡在下周，你急得像热锅上的蚂蚁，最后只能 PowerPoint 拉个方块交差，被设计师看了一眼说「嗯，有内味了」（她的语气让你怀疑她在安慰一个幼儿园小朋友）。
或者更惨的情况：你自己就是那个「全栈」------产品、设计、开发全包，一个人扛着三顶帽子在原地旋转。Figma 的曲线钢笔工具让你恐惧，Canva 的模板让你尴尬，最后做出来的东西只能形容为「AI Slop 的工业产物」------紫色渐变 + emoji 图标 + 左 border accent，一眼就能认出是 AI 生成的，就好像在你脸上贴了个「外行」的标签。
huashu-design 这个开源 skill 就是冲着这个痛点来的。
它是什么？
GitHub 地址 ：github.com/alchaincyf/...
一句话说清楚：一个装进 Claude Code 的设计能力包，让你用说话的方式做出高保真的设计交付物。
安装只要一行命令：
bash
npx skills add alchaincyf/huashu-design然后在 Claude Code 里跟它说话：
objectivec
「做一份 AI 心理学的演讲 PPT，推荐 3 个风格方向让我选」
「做个 AI 番茄钟 iOS 原型，4 个核心屏幕要真能点击」
「把这段逻辑做成 60 秒动画，导出 MP4 和 GIF」
「帮我对这个设计做一个 5 维度评审」没有 GUI，没有拖拽面板，没有让你调贝塞尔曲线的工具------就是说话。
作者花生（花叔）在 README 里写了一句话我特别喜欢：「对不愿意打开任何图形界面的人，80 分的 skill 比 100 分的产品好用。」
诚实到令人感动。
能做什么？我来帮你翻译一下
| 你想要的 | huashu-design 交付的 | 大概等多久 |
|---|---|---|
| App 长什么样？ | 带真 iPhone 15 Pro 机身边框的可点击 HTML 原型 | 10--15 分钟 |
| 下周要讲 PPT | 浏览器里可演讲的 HTML deck，同时导出真文本框可编辑的 PPTX | 15--25 分钟 |
| 需要一段宣传动画 | 带 BGM、60fps 插帧的 MP4，还有优化过的 GIF | 8--12 分钟 |
| 不知道设计风格选哪个 | 从 5 流派 × 20 种设计哲学里推荐 3 个差异化方向，并行生成 Demo 让你选 | 5 分钟 |
| 想知道这个设计哪里烂 | 5 维度雷达图 + Keep/Fix/Quick Wins 可操作清单 | 3 分钟 |
值得单独拎出来说的是那个 PPTX 导出：它不是截图贴图片，而是真的用 html2pptx.js 读取 DOM 的 computedStyle，逐元素翻译成 PowerPoint 对象------也就是说，导出后你在 PowerPoint 里还能改文字位置。这种「不偷懒」的做法让我肃然起敬。
核心机制：它为什么不会做出那种「一眼 AI」的东西？
这里有几个设计决策很有意思。
1. 反 AI Slop 规则
README 里明确写了要避免的视觉「大公约数」：
- ❌ 紫色渐变
- ❌ emoji 当图标
- ❌ 圆角 + 左 border accent 的 info 卡片
- ❌ AI 用 SVG 画人脸（你懂那种诡异感）
- ❌ 永远是 Inter 字体
转而使用 text-wrap: pretty、CSS Grid、精心挑选的 serif display 字体和 oklch 色彩空间。这些细节的堆积，就是「设计感」和「AI 味」的分水岭。
2. 品牌资产协议（最硬的规则）
涉及到具体品牌（比如 Stripe、Linear、或者你自家公司）时，它不会「凭记忆猜颜色」，而是强制走一个五步流程：问 → 搜官方品牌页 → 下载资产 → 用 grep 提取色值 → 固化成 CSS 变量。
作者做了 A/B 测试（v1 vs v2，各跑 6 个 agent），v2 的稳定性方差比 v1 低了 5 倍。也就是说，加了这个协议之后，出来的结果一致性大幅提高。
3. Junior Designer 工作流
不会闷头做完再 show 你，而是：
- 先发问题清单等你批量答完
- 先写 assumptions + placeholders，尽早给你看（哪怕只是灰色方块）
- 填充内容 → 变体 → Tweaks 参数调整，分三次给你看
- 交付前 Playwright 自动跑浏览器验证一遍
理解错了早改比晚改便宜 100 倍------这句话每个做过大型需求的人都懂。
仓库结构：藏着不少宝贝
bash
huashu-design/
├── SKILL.md # 给 agent 读的主文档
├── assets/ # 预制组件
│ ├── animations.jsx # Stage + Sprite + Easing 动画引擎
│ ├── ios_frame.jsx # iPhone 15 Pro 精确机身
│ ├── showcases/ # 24 个预制样例（8 场景 × 3 风格）
│ └── bgm-*.mp3 # 6 首场景化背景音乐（！）
├── references/ # 子文档：20 种设计哲学详细库等
└── scripts/ # 导出工具链：HTML → MP4 → 60fps → GIF → MP4+BGM6 首场景化背景音乐这个细节......我盯着看了三秒。做个动画顺便配上 BGM，这个工具的「交付」定义比我想象的要完整得多。
和 Claude Design 的关系：开源文化的新姿势
花叔在 README 里大方承认了：品牌资产协议的哲学是从 Claude Design 社区流传的系统提示词里「偷师」的，然后蒸馏成结构化 spec，写成 skill 装进了 Claude Code。
他把这件事叫做「基于其他产品灵感的二次创作，是开源文化在 AI 时代的新形态」。
我觉得这句话说得挺准的。Skill 工程师是新时代的「蒸馏者」------把别人产品里最有价值的认知提炼出来，变成可复用、可分发的能力包。这件事本身比写代码更需要品位。
两个产品的定位差异也很清晰：
| Claude Design | huashu-design | |
|---|---|---|
| 形态 | 网页产品 | Claude Code Skill |
| 操作方式 | GUI（点、拖、改） | 对话（说话，等 agent 跑完） |
| 交付物 | 画布 + 可导 Figma | HTML / MP4 / GIF / 可编辑 PPTX |
| 跨 agent | 专属 Claude.ai | 任意 skill 兼容 agent |
Claude Design 是「更好的图形工具」，huashu-design 是「让图形工具这层消失」。两条路，不同受众，不是竞争，是互补。
局限性（作者自己说的，我来转述）
- 不支持图层级可编辑的 PPTX 到 Figma 导入
- 不支持 Framer Motion 级别的 3D / 粒子动画
- 完全空白的品牌从零设计，质量可能只有 60--65 分
这是一个 80 分的 skill，不是 100 分的产品。
我反而因为这段话更信任它了------能对自己的产品边界说清楚的人，通常对核心能力也做得靠谱。
怎么安装
前置条件：需要有 Claude Code 环境。
bash
# 一行安装
npx skills add alchaincyf/huashu-design
# 然后在 Claude Code 里直接说话
# 例如：「做一个 AI 写作工具的 iOS App 原型，风格简洁，4 个核心屏幕」跨 agent 通用，Claude Code、Cursor、Codex 都能装。
最后说一句
这个 skill 让我想起一句话：最好的工具是让你忘记工具存在的那种。
Figma 很强大，但我每次打开都先在工具栏迷失五分钟。huashu-design 的目标是让设计这件事退到背景里去------你只需要想清楚「我要什么」，剩下的交给 agent。
当然，它没法替代专业设计师。但对于「需要设计，但没有设计师」的独立开发者、全栈工程师、产品经理来说，这大概是目前最接近「用说话做设计」的开源方案之一。
去 star 一下吧：github.com/alchaincyf/...
你的 Figma 也许不会吃灰，但至少多了一个新选项。
作者花叔（花生）是 AI Native Coder、独立开发者，代表作包括小猫补光灯（AppStore 付费榜 Top 1）和女娲 .skill（GitHub 12000+ Star）。商用授权联系：@AlchainHust（X / Twitter）。