3 分钟交切图：GPT Image 2 把 UI 从灵感图做成可编辑资产

为什么这次不一样

图面原话写得很直：不只是画图，是生产素材。左边便签三条：更懂中文、更像设计师、直接出素材。中间那条箭头才是重点——从灵感图到可交付 UI 资产（分层资源）。

三刀能力，对照着用：

底下一行流程也写死了：prompt → screen → refine → layers。别指望一句提示词同时完成构图和像素级细节。

3 分钟四步

口诀跟图底虚线框一致：整体先对 → 再抠细节 → 最后交付切图。

1
平台：
2
页面：
3
风格：
4
主色：
5
关键元素：

1
请设计一个【平台】的【页面】。
2
风格：【风格】
3
主色：【主色】
4
关键元素：【关键元素，逗号分隔】
5
要求：中文文字清晰可读；界面具备真实 App 的导航 / 卡片 / Tab 结构；输出适合后续分层（背景 / 组件 / 图标 / 文字）。

1
只修改底部导航的图标样式，其它布局、配色、文案全部保持不变。

1
只把主操作按钮改成暖橙色高亮，卡片与顶栏不动。

1
只校正标题字号层级（更大标题、更小辅助说明），不要改版式结构。

外卖商家详情页完整示例

工具箱底部示例组合 verbatim：iOS + 商家详情页 + 暖橙 + 底部购物车。下面按五字段填满，可直接粘贴开跑。

1
请设计一个 iOS 外卖 App 的商家详情页。
2
风格：现代清爽、偏餐饮食欲感，信息层级清楚
3
主色：暖橙
4
关键元素：顶部商家头图与评分、菜品列表卡片、优惠标签、底部固定购物车栏（含合计与去结算）
5
要求：中文文字清晰可读；顶栏 / 内容卡片 / 底部栏结构完整；适合后续按背景、组件、图标、文字分层导出。
6
禁止：文字乱码、控件挤成一团、把整页画成海报、一次塞多个无关页面。

精修可以接着丢：

1
在上一版基础上，只加强底部购物车栏的暖橙高亮与「去结算」按钮对比度，其它区域保持不变。

交付时二选一：分层 PNG 直接给前端；或导入 Figma 把购物车、菜品卡做成可复用组件。

提示词速查表

先看整张工具箱，再按下表取词。

1
iOS + 商家详情页 + 暖橙 + 底部购物车

避坑：五条就够卡住质量

图面「避坑小贴士」五条，照做：

1. 一次一页 —— 多页同屏生成，结构和文字都会糊。
2. 校对字号 —— 模型偶尔把辅助说明写得比标题还大，过一眼层级。
3. 给品牌色 —— 不写主色就容易落到默认蓝紫；暖橙、品牌 HEX 写进提示词。
4. 复杂页回 Figma —— 多状态、长列表、设计系统对齐，分层进 Figma 再组件化。
5. 商用看授权 —— 出图能用 ≠ 账号/平台条款允许商用，交付前自己核。

再叠一句四步纪律：一次只改一个点。结构还飘就回头改需求，别在精修里 simultaneous 改五个地方。

认清你要的是灵感还是切图

GPT Image 2 在 UI 这条线上，值钱的不是「又一张好看的手机框」，而是：字能读、结构像真 App、层能拆开交给人或前端。三分钟四步够你验证方向；真要进生产，复杂页回 Figma、商用核授权，这两步别省。