产品经理需将抽象交互逻辑转化为文心一格可精准渲染的视觉画面，分四步：①锁定不可替代ui锚点；②用解剖坐标描述交互状态；③绑定真实设备与系统语境；④适配评审场景输出指令。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
产品经理需要把“用户点击收藏按钮后弹出带动画的确认浮层”这种抽象交互逻辑，转化成文心一格能精准渲染的视觉画面，否则生成图会缺失关键状态、动效示意或界面层级关系。
第一步：锁定不可替代的UI锚点
在提示词开头直接写死1～2个界面中不可替换的视觉元件，例如“顶部导航栏含返回箭头+‘商品详情’标题+右上角空白收藏图标”“底部固定悬浮购物车按钮”。【漏掉任意一个，AI会用训练库中最常见的通用组件补全，比如把收藏图标换成分享图标】
不要写“有导航栏”“带按钮”，必须写出具体位置、文字内容、图标状态（空心/实心/带数字角标）和相对布局关系。
这一步操作起来很简单，直接把Figma或Axure里的组件命名抄进去就行。
第二步：用解剖坐标描述交互状态
把“点击后弹出浮层”转化为可测量的空间关系：
① 写明触发源：“收藏图标被手指轻触瞬间，图标内缩0.8mm并叠加#FF6B35微光反馈”；
② 写明浮层位置：“确认浮层从图标正下方垂直升起，底边距图标下沿3px，宽度占屏幕72%，高度固定88px”；
③ 写明动效特征：“浮层入场使用缓入缓出贝塞尔曲线，0.24s完成，伴随轻微放大（102%→100%）”。
AI不理解“弹出”“动画”“确认”，但能识别“垂直升起”“距下沿3px”“0.24s”“缓入缓出”——这些是它训练数据里高频出现的物理参数。
第三步：绑定真实设备与系统语境
方法一：指定设备壳体与系统风格
写“iPhone 15 Pro真机截图视角，深空黑机身，iOS 18半透明控制中心未展开，状态栏时间显示14:22”。不加这句，AI默认渲染无边框纯色背景，无法判断浮层是否适配刘海屏安全区。
方法二：强制约束视觉权重
在提示词末尾追加“界面元素清晰可见，图标像素级锐利，浮层阴影深度3px、模糊值2px、透明度92%，禁止毛边与虚化，所有文字使用SF Pro Display字体”。【不写字体名，AI大概率套用思源黑体或默认无衬线体，导致设计稿与开发落地不一致】
第四步：适配评审场景的输出指令
小红书/飞书文档评审用图：添加“画面左侧留白20%，右侧预留标注区域（灰色虚线框），浮层内部用橙色箭头指向‘已收藏’文字，并附小号注释‘点击后触发Toast’”。
开发交接图：写“纯白背景，无阴影渐变，所有UI元素按1:1像素比例建模，底部标注尺寸：浮层高88px、圆角6px、按钮宽120px、间距16px”。
这一步不用改参数，直接把需求写进提示词里，AI就能识别“标注区域”“像素比例”“圆角6px”等指令。
