让 Claude Code 变成你的设计团队——design-with-claude 评测

做产品设计最怕什么？设计师不在旁边，当你对着 Figma 改了三版配色、问了三次”这个间距合理吗”，Claude 给你的回复永远是一句万能的”我觉得可以再优化一下”。

今天挖到一个让我眼前一亮的 Skill——design-with-claude，作者是 imsaif。它本质上是一个塞进终端的产品设计师，不是一个人，是整整 45 个设计专家。

它到底能做什么？

先说最惊艳的功能：npx dwic-audit

这是它的自动审计入口，跑完直接给你一份设计诊断报告，覆盖 8 大维度：

• 颜色/对比度（WCAG AA 合规性）
• 字体排版
• 间距布局
• 无障碍访问（表单、ARIA、键盘导航）
• 表单设计
• 导航结构
• 动效设计
• 文案语气

报告直接写进 .dwic/audit-*.md，而且 exit non-zero on error——意味着你可以把它接进 CI/CD，每次提交自动检查设计规范不符合。

换句话说：不用再靠人眼 Review，机器帮你扫盲点。

45 个专家，想找谁直接叫

审计完发现问题？它会根据报告自动路由到对应专家，比如：

• /color-specialist —— 处理配色不符合 WCAG 的问题
• /typography-specialist —— 字体比例失调
• /accessibility-specialist —— 无障碍改造
• /design-critic —— 真实批评，不给你灌鸡汤，直接告诉你什么坏了、为什么、按严重程度排序
• /anti-slop-designer —— 专门识别那种”一看就是 AI 生成的模板脸”UI，帮你把 AI 味去掉
• /design-grill —— 像审讯一样跟你访谈，直到设计决策被钉死，后续 session 不会跑偏

每个专家都是独立可调用的命令，直接在终端里 Slash 调用，不需要开任何设计软件。

适合谁用？

独立开发者 / 全栈工程师：做 MVP 不需要每次都找设计师，但也不想交付看起来很廉价的产品。这个 Skill 能让你自己做一个 80 分的设计。

设计团队：可以把它的审计报告当作 CI 环节，自动化检测设计还原度，减少开发和设计之间的来回撕扯。

Claude Code 重度用户：直接在编码环境里拿到设计反馈，不需要在 Figma 和代码之间来回切换。

怎么安装

npx @agentskillshub/cli install imsaif/design-with-claude

或者手动安装：

mkdir -p ~/.claude/skills/imsaif-design-with-claude
curl -fsSL https://raw.githubusercontent.com/imsaif/design-with-claude/HEAD/SKILL.md 
  -o ~/.claude/skills/imsaif-design-with-claude/SKILL.md

重启 Claude Code 即可。

总结

design-with-claude 的核心价值不是给建议，而是测量 + 路由 + 执行的闭环。测量（audit）先跑，数据说话；路由让专家接手，不靠猜测；执行结果是可直接落地的设计改动建议。

设计师朋友可能要说”这不会抢我饭碗吗”——不会，它只是把你从”这个颜色对不对”的低级纠结里解放出来，让你有精力做真正需要品味的事情。

GitHub 开源地址：https://github.com/imsaif/design-with-claude

GitHub: https://github.com/imsaif/design-with-claude