设计师别再熬夜重画了——让 AI 先给你出 3 个方案对比看看

做设计最费时间的阶段是什么？不是画第一版，是改改改——领导说「再来一版」，然后你熬夜肝了三个方案，结果对方说「还是用第一版吧」。

我现在发现了一个工作流，彻底把「改方案」这件事变得很轻。

它的工作方式

当你丢给 Claude 一句「帮我画个登录页」的时候，这个 Skill 会先不急着画，而是反问三个问题：

• 感觉——「你想要什么氛围？冷静、极简、像 Linear 那种？」
• 参考——「有没有你喜欢的 App 或网站？」
• 核心动作——「这个页面用户最主要做什么？」

问清楚之后，它会同时生成 2-3 个完全不同方向的可交互 HTML 方案，你可以直接在浏览器里切换对比，选中意的继续深化，不喜欢的直接丢掉——反正只是草稿，不心疼。

什么时候用它？

这个 Skill 叫「sketch」，意思就是速写本模式：

• 「帮我看看这个界面能怎么改」
• 「给我 3 个不同排版的首页」
• 「这个功能放哪更顺眼？」
• 「A 和 B 两种布局哪个体验更好？」

它不是让你直接出最终稿的——是帮你在上代码之前，先把设计方向搞清楚。

不适合做什么

• 直接要生产级代码 → 用 claude-design
• 要做完整落地页 → 用 claude-design
• 要画流程图 → 用 excalidraw

背后的牛项目

这个 sketch 技能来自 Hermes Agent——由 NousResearch 开发的一个开源 AI Agent 框架，GitHub 已经攒了 24.6 万颗星，是当前最火的自增长型 AI Agent 之一。

Hermes Agent 打包了 152 个 Skill，sketch 只是其中一个，但它解决的问题很具体——设计探索阶段的高成本。有了它，改方案的循环从「熬夜重画」变成「点两下鼠标」。

怎么安装

在 Claude Code 里直接运行：

npx skills add NousResearch/hermes-agent --skill "sketch" -g -a claude-code -y

安装完说「sketch this screen」或「给我两个布局方案」就自动触发。

设计师和 PM 值得试试——它把设计沟通成本降了一大截。

https://github.com/NousResearch/hermes-agent

GitHub: https://github.com/NousResearch/hermes-agent