生成美丽的用户界面
Cerebras博客文章探讨了AI生成UI的现状、常见问题与最新进展，并提供了8种实用方法来改善AI辅助设计，强调意图设定和快速迭代的重要性。
2026年5月8日，Cerebras发布了一篇由Sarah Chieng撰写、Sherif Cherfa和Halley Chang贡献的文章《生成美丽的用户界面》（Generating Beautiful UIs），深入剖析了AI在UI设计领域的现状、痛点与突破。
文章指出，人们对AI生成的作品普遍存在直觉性的怀疑，这种模式在写作中已经显而易见——比如破折号的滥用——而设计领域也正步其后尘。尽管最新模型能产出更优的界面，但仍需大量人工干预和“提示补丁”。总体而言，AI生成的设计往往缺乏人类设计师带来的深度满足感、愉悦或奇思妙想。
作者列举了AI生成的典型问题：基础提示词导致枯燥输出，例如一个用于电脑配件推荐网站的暗色模式提示，得到的却是经典暗色背景、大量卡片、图标、渐变文字等可预测的乏味结果。常见“AI设计痕迹”包括：一切看起来像SaaS仪表板（训练数据中SaaS产品占比过高）、卡片嵌套（卡片里套卡片）、过度编码和不必要的重构（要求改一个按钮却重写了整个组件树）、指令泄漏（实现指令变成可见文字）、构建成功但视觉异常（间距错误、移动端失常、组件不符）、缺乏构图感（元素间没有关联逻辑）。
然而，近期进展使得AI生成UI不再是噱头。Cerebras的Codex-Spark模型能达到约1200 tokens/秒，将一次提示到结果的往返时间从3分钟缩短到30秒，让用户可以快速尝试、丢弃和改进。视觉模型让AI能“看到”自己生成的内容，并据此自我迭代。更好的工具如shadcn/ui、Figma MCP集成和标准化设计令牌，为AI提供了可操作的约束条件。
文章强调，意图设定至关重要。最有效的AI辅助设计是将AI作为填补技能空白的中介工具，而非设计师的替代品。具体方法分为三大类、共8条实践：
- 使用shadcn/ui并连接MCP：先运行shadcn预设，让AI读取实际源码而不是凭空猜测。MCP集成使模型能查询实时组件注册表，避免过时的属性推断。
- 编码前决定设计：提前确定精确的十六进制颜色、字体系列、间距比例和布局逻辑，编码到Tailwind配置或设计令牌文件中。Figma MCP可直接读取Figma组件，减少猜测。
- 让Tailwind说“不”：通过严格的Tailwind配置和lint规则禁止任意值，强制AI使用定义好的颜色、间距等，避免偏离体系。
- 小步迭代：每次只做一个具体调整，如“按钮内边距增加4px”，然后立即查看效果。GPT-5.4的视觉能力进一步加速了“截图-描述-修正”循环。
- 先采访我：与其自己编写完整的样式指南，不如让模型通过提问来引导用户明确目标受众、页面目标等，从而生成更贴合需求的指南。
- 先生成选项，再深入：先要求模型给出多个粗略方向，选择其中一个并深耕细作。这种方法比从极端细节开始更自由、更高效。
文章还提及了其他具体案例，如用FigmaMake自动实现铝箔压纹效果，或利用Flora.ai生成高度定制化的设计模型照片。作者总结道，设计归根结底是另一种形式的视觉问题解决，AI的潜力在于丰富创意视角，而非替代人类。