Unslop

资料核查于 2026 年 11 月 6 日。正文区分发布方声明与第三方体验，不代表 AIDreamHub 已完成产品实测。

它整理的是设计决策，不是再造一个建站平台

Unslop 由 Damir Sokolovsky 开发，是给编程 Agent 使用的设计审查技能。它在现有代码与前端技术栈中修改界面，而不是把页面搬进另一个托管平台。判断价值时，不应只问它能否去掉紫色渐变，而要看：主次是否更明确、操作是否保留、每个视觉决定是否与产品有关。

适合的起点是已经能工作的后台、应用页面或落地页，负责人也能审阅代码与截图。它不能替代用户研究、完整设计系统、无障碍检查和上线回归。有品牌规范时，应让规范约束修改，而不是为了看起来不像 AI 就换掉整套产品语言。

AIDreamHub 截取的官方项目页面，不是本地运行画面。

从审查到修改，顺序为什么重要

官方流程先找出问题与位置，再提出来自产品本身的设计方向，之后依次处理间距、颜色、图标、文案、字体、布局、细节、视觉素材和动效。文案会影响换行与字号，间距也可能解决原本以为需要增加装饰的问题；有顺序的修改，比同时改所有东西更容易回看与否决。

README 还提供不足十秒的方形改版过程视频。访问线上页面截图或制作这种视频需要 Playwright 和 Chromium，视频另需 FFmpeg。图片生成属于可选的外部服务，可能单独收费。过程视频能证明画面发生了变化，不能证明转化率、可用性或完成任务的速度提高。

独立体验提供了什么证据

日本创作者「まさお」在 2026 年 11 月 2 日的体验文章中，对比了普通 Claude 修改与 Unslop 修改。他观察到后台页面的颜色分配和措辞差异较明显，落地页的差距则较小；同时报告静态数字被更改。这是一位作者的具体案例，不是跨模型的受控测试，本站没有复现该次运行。

这带来一个可执行的要求：价格、统计数字、客户名称和业务承诺必须在任务里标为不可改。把问候标题换成明确日期，可能有助于定位；把收入数字改得更好看，则是数据破坏。视觉验收与事实验收应分开，不能用一张漂亮截图同时替代两者。

How to Use：从一个可回退页面开始

先阅读仓库中的技能文件，再安装到所用 Agent 的项目级技能目录。下方采用官方 Claude Code 目录结构，避免全局安装影响其他项目。操作前创建分支或其他可恢复副本；这些是整理后的使用说明，不代表本站已经运行该技能。

第一次只指定一条路由，要求先审查、再确认设计方向。补充用户是谁、主要任务是什么、哪些设计 token 应沿用、哪些数字不能动。完成后同时检查代码差异与截图。只有需要线上截图或过程视频时，再安装对应捕获依赖，不必把视频制作当成每次改样式的前置步骤。

git clone https://github.com/heydamir/unslop.git
mkdir -p .claude/skills
cp -r unslop/skills/unslop .claude/skills/

# Claude Code
/unslop this dashboard

后台改版，怎么验收才不是只看颜值

以订阅后台为示例：先冻结套餐价格、汇总金额、计费说明和按钮去向，在相同数据与视口下保存前后画面。至少检查桌面和窄屏，再走一遍键盘焦点、表单错误、空态、加载态和不可撤销操作。这是建议采用的验收方案，不是本站测得的 Unslop 成绩。

不要只凭首屏通过改版。颜色更安静，也可能让禁用态难以分辨；文案更短，也可能删掉必要条件。如果版本改变业务含义或让操作失效，即使构图更成熟也应该退回。

和普通 Agent 提示词、设计师审查怎么选

普通编程 Agent 已能处理许多明显的模板化装饰。Unslop 的增量是把诊断、方向和修改顺序变得可重复，应该用漏掉的细节是否减少来评价，而不是声称审美一定更高。若产品定位、用户研究或跨页面一致性尚未解决，设计师主导通常更合适。

想做改版服务，可以把交付限定为一个页面、保留功能清单、响应式截图与审阅后的代码差异。这样的范围比「任何 AI 网站都能变高级」更可靠。运营后台的高密度信息和营销页的低信息密度，需要不同判断；行业差异化应体现在这些任务约束里。

许可、费用与使用边界

仓库采用 CC BY 4.0。按许可要求使用、修改或分享技能时，需要署名 Damir Sokolovsky（@heydamir）并链接回仓库，不要误写为 MIT。字体、图片和外部服务还可能适用各自条款。

技能可获取，不等于 Agent 调用、生成素材和实施时间都免费。限定修改范围，执行依赖前先审阅，不要用虚构评价和数字填补页面。配套手绘图表达「像裁衣一样调整界面」，属于编辑示意，不是 Unslop 自动生成的效果图。

采用前常见问题

Unslop 能直接从零做网站吗？

官方重点是借助 Claude Code 或 Codex 审查和改善已有界面。建议从可运行的路由或已获授权的线上参考开始。新产品仍然需要需求、内容、实现与测试；一次视觉整理不会自动完成这些工作。

它会修改数字和业务文案吗？

编程 Agent 有能力修改文案与静态数据，独立体验作者也报告过数字改变。应在任务中指定不可改的值，并检查最终代码差异。截图好看并不能证明业务事实原样保留。

每次都要安装 Playwright 和 FFmpeg 吗？

README 将 Playwright 与 Chromium 用于线上截图或改版过程视频，视频另外需要 FFmpeg。这些是对应工作流的依赖，不意味着每次本地样式调整都必须生成视频。Agent 的运行环境与调用费用仍需另行准备。

核查资料

• Damir Sokolovsky — Unslop README / CC BY 4.0
• まさお — hands-on comparison, 2026-11-02
• Unslop — skill and references

继续寻找同类工具

• 设计工具
• 编程工具