帮你改网页的AI工具,为什么不直接动手?

设计师Damir Sokolovsky发布了一套叫unslop的网页改版指引。把它交给AI编程助手，也就是能读取和修改网页代码的AI工具，助手就能按步骤检查、修改页面。这种可以反复调用的任务指引，通常叫Skill。

它处理的是一个具体问题：网页功能做出来了，视觉上却装饰过多、间距不一致，文字也没讲清楚。

但unslop不会一收到要求就直接重做。按作者的公开指引，它先审查页面、提出方向，通常等使用者确认后才修改。这一步停顿，有什么必要？

图：unslop作者公开的界面修改过程前两帧，与其账号头像拼贴。界面和金额均为设计示例，不是客户经营数据。作者：Damir Sokolovsky，采用署名许可CC BY 4.0。

unslop先看实际页面，把发现的问题和所在位置列出来，再决定是局部修整，还是较全面地调整。

如果页面已经有比较成熟的设计，只剩少量问题，就沿用现有品牌和布局，只修检查中发现的缺陷；如果问题散布在配色、文字、图标等多个地方，才进入完整改版。页面本来就合适时，工具只提出少量建议，得到同意后再动手。

图：unslop公开指引节选：先审查、判断改动幅度，再提出方向并等待确认；原文有省略。作者：Damir Sokolovsky，采用署名许可CC BY 4.0。

例如，间距不一致，可以通过统一间距处理，不必连字体和主视觉一起更换。局部修整时，即使工具想到更大的改法，也先把它写进建议，而不是直接做掉。

unslop还默认保留原有功能、内容和区块顺序。要求页面更清楚，并没有授权AI顺手删掉产品信息、重新安排整站。检查结果决定改多少，保留规则则说明哪些部分不能动。

检查能发现装饰太多、信息不清，却未必能独自决定新的配色、字体和图片。

因此，unslop要求在编辑前说明产品做什么、服务谁、希望呈现怎样的气质，以及哪一两处内容应该成为视觉重点。已有合适品牌时，就沿着品牌继续做，不重新发明一套风格。

图：unslop作者提供的业务管理页面示例，把重要数据放在显眼位置；金额为示例内容，不是真实经营数据。作者：Damir Sokolovsky，采用署名许可CC BY 4.0。

这些选择会影响整页。比如，先确定要突出哪项产品内容，才能继续决定图片放什么、标题怎么排、哪些地方用醒目的颜色。否则，每个元素都可能单独做得精致，合在一起却表达不出同一个重点。

使用者确认的就是这些取舍。作者明确说明，方向后来再改，会牵动大量重做，所以默认在这里暂停；如果使用者事先已经授权直接执行，才跳过等待。它不要求每调一个间距都重新请示。

确认之后，工具再处理具体细节。文案排在字体和布局之前，因为标题长短会影响字号、换行和位置；图片与动效靠后，是为了适应已经确定的页面。

图：unslop作者提供的产品首页示例，展示主图、标题与产品预览怎样配合。作者：Damir Sokolovsky，采用署名许可CC BY 4.0；不是改版效果实验。

元初看重的是，这套安排把人的决定和AI的执行分开了。使用者先确认哪些内容必须保留、页面突出什么、准备改到什么程度，再让AI提出并落实具体方案。人不用盯着每个间距，但也不必等整页改完，才发现产品重点被换了。

实际使用时，可以先看AI列出的问题和改动范围：它准备删掉必要信息吗，是否打算改变页面重点？这些问题没说清，就先确认取舍。若只是按已有规范统一间距、调整换行，就让它继续做。

先确认方向，是为了把影响整页的选择提前解决。执行依据已经明确的细节，则可以放心交给工具。这才是那次暂停值得保留的地方。