如何让 AI 生成的页面更有设计感

“我上周差点被 AI 气到辞职。”

公司周五的技术分享会上，我站在投影前，面对着全栈开发团队的同事们。作为设计组的一员，我很少有机会在技术分享会上发言，但这次不一样——我们要聊的是 AI 辅助设计。

“真的，公司推行全栈开发后，我们设计组也要开始用 AI 做页面。”我调出自己的作品集，“结果你们猜怎么着？AI 生成的页面像极了我 2010 年做的 PPT 作业。”

台下传来会心的笑声。我知道他们都懂——那种看起来很完整却总觉得哪里不对劲的 AI 页面。

“那后来呢？”有同事问道。

我深吸一口气：“后来我想通了，不是 AI 不会设计，是我没教会它听懂我的话。”

第一招：先让 AI 给你建个游乐场

“作为设计师，我最怕的是什么？”我切换到下一张幻灯片，“不是 AI 做得丑，而是我根本不知道‘好看’长什么样。”

屏幕上展示的是我之前做的项目：docs/public/projects/animation-playground。左侧是整齐的菜单，右侧的 iframe 里各种效果轮番上演——文字霓虹、故障风、3D 浮动、粒子背景、鼠标跟随……

“以前我让 AI 做页面，只会说‘要现代感’、‘要设计感’。”我指着屏幕上的对比图，“左边是我用模糊词汇描述的结果，右边是我能说出具体效果名称后的结果。”

“作为设计师，我们学过色彩理论、排版原理，但很少有人系统学过‘前端能实现什么’。这个 animation playground 就是我的‘前端特效展厅’。”我演示着页面切换，“当你能说出‘我要 text 霓虹那种层次感，但不要闪烁；背景用 particles 但更轻一点’，AI 才真正听得懂你在说什么。”

“这对我们全栈开发特别重要。”我强调道，“设计团队用 AI 时，最怕的就是前端实现不了。有了这个游乐场，我一眼就能看出哪些效果是你们能做出来的，哪些是纯概念。这样我在设计阶段就能做出更 realistic 的决策。”

第二招：让 AI 采访你，但只给选择题

“游乐场有了，新的问题来了——选择困难症。”我展示着之前做过的版本迭代，“每个 demo 都挺好看，但把它们拼在一起就很容易变花。”

“这时候我做了一件设计师最擅长的事——用户调研。”我打开一个聊天窗口，“只不过这次被调研的对象是我自己。”

屏幕上跳出一个问卷：

“Q1：你的页面想传达什么气质？ A. 极简克制 B. 活力四射 C. 科技感 D. 温暖亲和”

“我选 A。”我现场演示。

“Q2：信息密度偏好？ A. 留白充足 B. 内容紧凑 C. 图文平衡 D. 数据密集”

“还是 A。”

十道题答完，AI 给出结论：“风格约束：极简克制，留白充足，动效轻微，对比柔和。建议在 animation playground 中选择 text-all 的简洁版，关闭闪烁参数；背景选用 subtle-grid，透明度调至 20%。”

“看到没？”我兴奋地说，“这不是 AI 在帮我做加法，而是在做减法。作为设计师，我太清楚这种感觉了——设计感往往就是‘知道要关掉什么’。”

“现在这套采访流程已经成了我们设计组的标准化流程。”我展示着团队文档，“每个人做页面前都要先过一遍选择题，这样大家的设计风格就不会五花八门，给前端开发省了不少事。”

第三招：去 Huemint 领一套色卡

“最后一招最简单也最容易被忽略。”我打开https://huemint.com/，“作为设计师，我深知配色有多容易翻车。”

“以前我让 AI 自由发挥配色，结果……”我展示着之前的失败案例，“主色选得很用力，灰阶不干净，强调色跑得到处都是。”

“后来我学乖了——不让 AI 发明颜色，让它先有套稳的色卡再落地。”我输入关键词“极简克制”，网站立刻生成一套和谐的配色方案。

“我把这套色卡转换成 CSS 变量，直接丢给 AI：‘按这个配色重构页面’。”我展示着前后对比，“结果你们猜怎么着？它把之前花里胡哨的渐变全换成了干净的灰阶，accent 色只用在按钮上，整个页面瞬间高级了十倍。”

“现在我们团队有套内部色卡库。”我展示着团队文档，“都是从 Huemint 生成的，按业务场景分类：官网用‘晨雾’、后台用‘石墨’、活动页用‘霓虹’。前端直接引用 CSS 变量，设计一致性提升了好几个档次。”

尾声：从祈祷到选择

分享会结束时，我总结道：“这三招教会我最重要的一件事——设计感不是灵感乍现，而是一连串明确的选择。”

“作为设计师，我们总以为好设计靠的是天赋和灵感。但当我开始用这三招，我发现当我能说出‘我要 text 霓虹但不要闪烁’、‘我选极简克制’、‘用这套晨雾配色’时，AI 才真正成为我的设计助手。”

我看着台下的同事们：“以前我对着 AI 页面发愁，总觉得‘它不懂我’。现在我明白了，不是 AI 不会设计，是我还没学会如何让它听懂我的选择。”

“现在，”我笑着说，“每当有同事说‘AI 做的页面好丑’，我就会把这三招发给他。因为我知道——设计感不是玄学，是可以被拆解、被选择、被传达的。”

台下掌声响起。我知道，从下周开始，我们公司的 AI 辅助设计流程，将会变得不一样了。