AI 做的网站太丑？把这段提示词粘给它，让它对着获奖网站自己改

zhiyun Blog2026-10-242026-10-24

事情的起因

X 网友黄赟发帖求助：做了几个站，全是 Codex 给的默认风格，丑得自己都不想用，问有没有能提高网站设计审美的书。博主爱出海（@ai_chuhai）的回答是：不用读书——把一段提示词复制粘贴给你的 AI，它就能自动改好。原帖 2026 年 10 月 23 日发布，8.9 万浏览、1504 人收藏，本文拆解它的结构和用法，提示词见下文「怎么用」一节，可直接复制。

这段词的结构拆解

这段词写得像一份给机器看的「协议」，由三部分组成：

目标（OBJECTIVE）：把页面做到获奖级（award-tier）视觉标准；验收条件是所有检查维度上「再无可见的改进空间」；
检查清单（CHECK）：8 个维度全部按获奖标准要求——排版、留白、视觉层级、色彩、动效、微交互、响应式、原创性；对照基准是 Awwwards、Webby Awards、FWA 三大设计奖的获奖作品；
自查循环（LOOP）：完工后按清单逐项对照，发现差距就修补（PATCH）并重新进入循环，直到挑不出差距才结束。

说白了，它不是在教 AI 审美，而是给 AI 立了一套验收标准加一条「不达标不许交工」的纪律。

怎么用

下面这段是本站按原帖思路整理的可用版本，点代码块右上角的复制按钮，整段粘贴给你的 AI 就能用；原帖全文链接在文末。

请按获奖级视觉标准，重新设计并优化当前页面。
 
【目标】
把页面做到 Awwwards、Webby Awards、FWA 获奖作品的视觉水准：第一眼就要有高级感，而不是“能看”就行。
 
【检查清单：按下面 8 项逐项对照，不达标就改】
1. 排版：字体搭配、字号层级、行距、对齐方式是否克制统一；
2. 留白：元素之间、区块之间是否有足够的呼吸感，不拥挤、不空荡；
3. 视觉层级：第一眼先看到什么、其次看到什么，顺序是否清晰；
4. 色彩：主色、辅助色、中性色是否协调，有没有廉价感和杂色；
5. 动效：过渡和动画是否克制、自然，有没有多余和卡顿；
6. 微交互：按钮、悬停、点击反馈是否细腻、一致；
7. 响应式：手机、平板、桌面三种宽度下布局是否都完整、不错位；
8. 原创性：整体观感是否像获奖作品的原创设计，而不是模板拼凑和默认风格。
 
【自查循环】
改完一版后，按上面 8 项逐项自查，列出每一项的差距并修补，修补完重新自查；直到 8 项全部找不出可见差距，才算完成。每一轮都要告诉我改了哪几项、还剩什么问题。
只改视觉呈现，不改页面原有的内容结构和文案。

复制上面这段提示词；
在你让 AI 做站或改站的会话里整段粘贴（Claude Code、Codex、Cursor 等均可）；
让它先改一版，再按词里的自查循环迭代，留意它每轮动了哪几个维度；
人工验收：自己打开页面看观感，别全信它的自评打分。

丑话说在前面

这段词的本质是「验收标准 + 迭代纪律」，不是审美本身。它比一句「帮我改好看点」有抓手得多——多数 AI 改站的问题不是不会改，而是没标准、改一版就收工，这段词正好治这个。但最终效果取决于模型本身的设计能力和它能看到的上下文，同一段词在不同模型上差别很大。本站未亲测，建议先拿一个练手页试一轮，再决定要不要纳入日常工作流。