界面稿是「成品的样子」,不是「成品的描述」。你让模型画「一个登录页」,它会给你一张登录页海报;你让它展示「一个已经上线的产品」,它给的东西才有一张能照着描的网格。
本文只讲需求怎么写:写提示词前先定什么、官方哪些控制项对应哪个决定、改一个标签怎样不必重画整屏。
先确定这张界面稿是干什么用的
界面图让人失望往往跟模型无关:需求方要的是可编辑设计文件,拿到的却是一张图片。
- 生成的界面稿是位图,不是分层、可编辑、组件化的设计文件,官方也没这么说
- 因此它适合提案、落地页头图、封面与风格对齐——凡是「给人看」而不是「拿来搭」的场景
- 它不适合交付给开发,那里有人要把按钮挪四个像素
- 这个关键词下排前面的工具都是矢量编辑器,卖点恰好是图像模型做不到的事
先定用途。下面都建立在同一前提上:你做的是界面的一张图,不是规格说明。
用「已上线的产品」来写 Brief
六行胜过六段。先写下这六行,再翻译成一段提示词。
- 屏幕与设备——「一个手机竖屏界面」,写成名词
- 版式骨架——区域与顺序:「状态栏、标题、三行列表、底部栏」
- 元素数量——写成数字,别写形容词;「三行」和「若干行」出的是两张图
- 标签清单——屏幕上会出现的那几串字,除此之外都不要
- 配色与权重——几种颜色,哪个元素最大
- 排除项——不自造 Logo、不加多余图标、不写清单外文字;没要求就不画手机外框
你没写清的部分都会被替你补上,而「自造文字」是最常见的缺陷。
用宽高比与 Sketch 定画布
两个官方控制项承担了大部分版式工作。
- GPT Image 2.5 可用任意宽高比出图:用宽高比选择器,或直接在提示词里写明比例
- 就算选了比例,提示词里也再写一遍——一边描述「竖排单列长屏」、一边选竖版比例,就是让两者不打架
- Sketch 让你直接在 ChatGPT 里画图作为最终图的参考,是交代「哪个区域在哪」最省事的办法,详见用 Sketch 作画
- Sketch 是移动端功能;网页端就用文字描述版式骨架
- 四个方框的草稿,几乎总是胜过两句版式描述
如果版式是难点,就画版式、只描述内容。
屏内文字越短越好
这一代的文字渲染是官方明写的改进项,发布说明把「更锐利的细节」列为收益之一。但官方没公布任何准确率数字,每个字都是你自己承接的风险。
- 标签留在图里,解释留在图外:图注或正文承担说明
- 多用名词和数字,少用句子——「登录」「3 项」活得下来,十二个字的营销语通常不行
- 必须一字不差时,把原串写进提示词,再用清单重复一遍,让模型看到同一串字符两次
- 少而大的标签,比多而小的标签渲染得更稳
- 导航文案、按钮、字段名最容易看出错别字,要在原尺寸下再看一遍
如果文字本身就是主角,见 GPT Image 2.5 的文字渲染。
一组界面要像同一个产品
一张界面不难,难的是三张摆在一起像同一个产品。
- 先出第一张,再把它作为参考图喂回去出下一张,而不是重述产品
- 官方写得很直接:模型更擅长依据参考照片工作,特征细节更可能被保留
- 把变化收在一处——同一段提示词,每屏只改一行——不一致就能一眼看出来
- 这跟「让同一个角色被认得出」是同一个问题,见保持同一个人物
两个可执行案例:一屏移动端与一块仪表盘
两个 Brief 都用上面那六行。照原文跑,再一次只改一行。

- 移动端单屏(竖版、单列)。 提示词:「一个手机 App 界面,竖版 9:16。自上而下:细状态栏;加粗标题『今天』;三行等高列表项,每行左侧小方形缩略图、右侧两行短标签;底部通栏主按钮,文案『继续』。米白底色,一种强调色,浅灰细分隔线,留白充足,扁平矢量风格。不要手机外框,不要多余图标,除清单标签外不要任何文字。」按序检查:是否正好三行、标签有没有拼错、最大元素是不是那叠列表项而不是图标。
- 桌面端仪表盘面板。 提示词:「一块桌面端仪表盘,横版 16:9。顶部宽表头,左侧一句短标题;下方 2×2 四张等大卡片。每张:大号短数字、下方一句说明、一个简单折线图或柱状图。卡片说明:会话、注册、收入、流失。浅灰底色,一种强调色,细描边,留白充足,除这五处标签外不要任何文字。」检查四张卡片是否真等大、五处标签是否都在、有没有卡片被换成装饰。
两个案例都刻意少放文字:解释该在图外,不是图里。
改一个标签,不重画整屏
为了改一个错别字重跑整屏,版式就是这么丢掉的。
- 可直接在图片上添加评论做更聚焦的编辑,这是官方给出的「指向某一区域」的办法
- 第二条路径是不用选区工具,直接在对话面板描述要改什么
- 官方把局限写得很直白:高亮并不总是精确,编辑可能超出选中区域,每次改完都要核对相邻区域
- 撤销、重做与会重新开始的「取消」,正是「只改一个标签」值得一试的原因
完整流程见图片评论编辑。
界面稿仍然会翻车的地方
这几种要提前准备,任何提示词都消不掉。
- 屏内长文案:塞进去的散文越多,越可能拼错词
- 重复组件会漂移:挨个检查重复卡片,别只看整组
- 精确的品牌字标:生成的字标是「重画」出来的,不是真实资产
- 高精度修改:官方写明修改有时会溢出你标记的区域
- 小字号:低于大致图注尺寸的字,无论发布说明改进了什么,都还是碰运气
诚实的工作流是两个来回:先写 Brief 出图,再修文字。控制项见 GPT Image 2.5 总览。
常见问题
GPT Image 2.5 能输出可编辑的设计文件吗?
不能,它输出的是图片。分层、组件化的文件由矢量设计工具产出,OpenAI 文档没有相反说法。界面稿用于提案与视觉对齐,不用于交付开发。
怎么让三张界面看起来像同一个产品?
先出第一张,再作为参考图喂回去出下一张,每屏只改提示词里的一行。发布说明写明模型更擅长保留参考图里的主体。
每一个标签都要写进提示词吗?
要,逐字照抄,再用清单重复一遍。每个标签都写短,并在原尺寸下复核导航文案与按钮。
能只改一个拼错的标签、不重新生成吗?
这正是图片评论的用途。标出区域、描述要改什么,再检查周围部分——官方说明编辑可能超出选中范围。