AI做UI原型工具横评:Claude Design vs huashu-design,哪个更适合你?

Quote

打字。回车。设计稿，到手。

听起来像吹牛？我也这么想。

所以我装上试了一下——打开终端，说一句话。

15 分钟后，一个真实 iPhone 外壳里能点击的 iOS 原型出现在浏览器里。

今天带你看看 huashu-design 到底什么水平。

一、huashu-design 是什么？

huashu-design 是一个跑在 Claude Code 里的设计 skill（技能包）。

说人话：不需要打开任何设计软件，只需要用自然语言说你想要什么，它直接生成可交付的设计成果。

安装一行命令搞定，跨 agent 通用——Claude Code、Cursor、Codex 都能装。

二、能做什么，和官方 Claude Design 有什么不同？

它能生产 7 类交付物，说话就能拿到：

没有按钮，没有面板，没有 Figma 插件。开口就是正式交付物。

那和官方 Claude Design 有什么区别？

Claude Design 是 Anthropic 刚刚在 2026 年 4 月 17 日发布的新产品，由最新旗舰模型 Claude Opus 4.7 驱动，目前是 Research Preview 阶段，去 claude.ai/design 就能用。左边聊天、右边画布，说话就能出高保真交互原型，输出的是可运行代码，不是静态图。发布当天 Figma 股价闪崩，设计圈炸锅。huashu-design 走的是另一条路：

一句话：Claude Design 是更好的图形工具，huashu-design 是让图形工具这层消失。

Warning

它自己承认是「80 分的 skill，不是 100 分的产品」。需要 Figma 源文件、复杂 3D 动画、完全从零的品牌设计——这三种情况它做不到。

三、实战：用 huashu-design 生成一个跑步 App

先说明一下这次实操用到的工具组合：

好了，说了这么多理论，来看实际操作。

需求： 做一个跑步类 App 的 iOS 原型，要有主界面、跑步记录界面、数据分析界面，能点击切换。

第一步：安装（只做一次）

打开终端，输入：

npx skills add alchaincyf/huashu-design

等它装好，然后打开 Claude Code。

第二步：直接说需求

在 Claude Code 里输入：

做一个跑步 App 的 iOS 原型：
- iPhone 15 Pro 机身，要有灵动岛
- 4 个核心屏幕：首页、实时跑步、历史记录、个人中心
- 配色走运动感，橙色或绿色主调
- 屏幕之间能真实点击切换
- 顺便给我推荐 3 个设计风格方向让我选

它会先给你 3 个差异化风格方向让你选——不是直接出图，是先帮你想清楚方向：

第三步：等着拿结果

AI 会先问你一些确认问题（这是它的「Junior Designer 工作流」——先对齐需求，避免做错了重做浪费时间），然后开始生成。

大概 10 到 15 分钟后，你会拿到：

• • 一个单文件 HTML，用浏览器打开就能看到真实 iPhone 外壳里的 App
• • 3 个不同风格方向的 Demo（极简白、运动橙、暗黑科技感……）
• • 屏幕之间的跳转逻辑，点击底部导航真实切换

我选了 A 方案 Athletic Dark（深色底+燃橙），出来的 4 个屏幕长这样：

想要更精细？继续迭代

拿到初稿后，还可以继续说：

• • 「帮我把配色换成 Nike Run Club 那种风格」
• • 「跑步记录页面加一个实时心率显示」
• • 「帮我对现在这个设计做 5 维度专家评审」

我说了句「换成 Swiss Grid Pro 风格，极简克制」，它直接把整套原型重新生成了一遍：

它会继续迭代，直到你满意为止。

道理讲完了，该你了

三件事，现在就能做：

1. 今天就装上试试

npx skills add alchaincyf/huashu-design

装好之后，找一个你手边真实的设计需求试一下。哪怕只是给公司内部工具画个原型，体验一次「打字出图」是什么感觉。

2. 不知道说什么，就用设计方向顾问

需求模糊的时候，直接说：「帮我做 XXX，推荐 3 个设计方向让我选。」 它会从 5 大设计流派 × 20 种设计哲学里挑最适合你的，并行生成 3 个 Demo 让你比较。

3. 有品牌资产，一定要提供

如果你做的是真实产品，告诉它你的品牌颜色、Logo、设计规范。它有一套「品牌资产协议」——会强制去搜你的官方品牌页、提取真实色值，不会凭空猜。这一步能把质量从 65 分拉到 85 分。

Quote

AI 时代最贵的不是工具，是你愿不愿意打开它、说第一句话。huashu-design 已经把门槛降到「说话」这个级别了——剩下的，看你了。