ai处理图文任务需构建结构化提示词：先判别图文关系类型，再嵌入角色、目标、输入来源、输出约束、风险禁区五要素，规避猜测重点、数值误读、主观描述三类错误。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
当你需要AI准确理解一张截图里的报错信息、分析Excel图表趋势、或根据设计稿生成对应代码时，单靠文字描述容易漏掉关键视觉线索，导致AI反复追问或输出偏离预期。这时必须把图片和文字指令组合成一套可执行的提示词结构，而不是简单扔张图加一句“帮我看看”。
第一步：明确图文关系类型
先判断你手上的图和文字之间是什么关系——这决定了后续提示词的骨架。不是所有图文都要堆在一起写，错配关系会让AI陷入混乱。
方法一：图是主输入，文字是操作指令
适用场景：你有一张终端报错截图、Figma设计稿、数据库ER图，需要AI基于图做具体动作（修复、转代码、解释）。【此时文字不能泛泛而谈“分析一下”，必须指定动作动词】
方法二：文字是主需求，图是约束条件
适用场景：你要生成一段React组件代码，但要求样式必须严格匹配某张UI截图。图的作用是“校准标准”，不是让AI自由发挥。
方法三：图文互为补充，缺一不可
适用场景：你发了一张含手写公式的白板照片+文字说明“这是我在推导梯度下降收敛条件时写的，请指出第三步逻辑漏洞”。图提供公式，文字提供任务目标和上下文。
第二步：用五要素锚定多模态意图
无论哪种图文关系，都必须在提示词里塞进这五个硬性字段，少一个AI就可能跑偏：
① 角色：你希望AI以什么身份响应？
例如：“你是一名前端工程师，熟悉React 19 + Tailwind CSS”比“请帮我写代码”有效十倍。
② 目标：要AI完成的具体动作，必须带结果指向。
错误示范：“看看这张图”→正确示范：“从这张Chrome DevTools截图中定位导致页面白屏的JavaScript错误，并给出修复后的3行代码。”
③ 输入来源：明确告诉AI哪些信息来自图、哪些来自文字。
示例：“图中包含：1）控制台完整报错堆栈；2）Elements面板高亮的div节点；文字补充：该页面使用Next.js 14 App Router，error boundary已启用。”
通过 Codex CLI 生成图片，支持尺寸控制和批量模式。依赖：codex (npm)。代理默认启用。用 generate.sh 生成单张，batch_generate.sh 批量生成游戏 UI 素材，gen_size.sh 指定尺寸。所有输出保存至 ~/.codex/generated_images/。
④ 输出约束：限定格式、长度、技术栈等硬边界。
【若未声明输出格式，Codex可能返回自然语言解释而非可执行代码】
⑤ 风险禁区：明确哪些地方绝对不能动。
例如：“禁止修改package.json依赖版本”“不要重写useEffect内部逻辑，只调整return语句”。
第三步：规避三类高频翻车点
方法一：别让AI猜图里哪部分重要
直接用文字圈出关键区域。比如：“请重点关注图中红色方框内的TypeScript类型定义，忽略左侧导航栏代码。”
方法二：数值类任务必须拆解读取与计算
AI看图表能判断“柱状图A高于B”，但无法可靠读出“A=1278.45”。如果你需要精确值，必须分两步写：“第一步：从图中OCR识别横坐标‘Q3’对应柱体数值，保留原始小数位；第二步：用该数值参与后续计算。”
方法三：设计稿转代码时禁用主观描述
禁止出现“看起来更现代”“让按钮更有质感”这类词。改为：“按钮需满足WCAG 2.1 AA对比度标准，hover状态添加0.2s cubic-bezier(0.4, 0, 0.2, 1)过渡，padding值严格按图中测量的16px执行。”
第四步：实战模板套用
模板1（报错诊断）：
你是一名资深Node.js后端工程师，正在排查生产环境服务崩溃问题。图中是PM2日志截图，含时间戳、进程ID、堆栈末尾Error: connect ETIMEDOUT。文字补充：服务部署在AWS EC2 t3.xlarge实例，数据库为RDS PostgreSQL 14，网络组策略已确认放行5432端口。请输出：1）最可能的3个根本原因；2）每个原因对应的验证命令；3）修复方案代码片段（仅修改config/database.js中pool配置）。
模板2（设计稿转前端）：
你是一名React组件开发工程师，负责将Figma设计稿落地为可复用组件。图中是登录表单高保真设计稿，含邮箱输入框、密码输入框、提交按钮及错误提示区域。文字补充：项目使用React 19 + TypeScript + shadcn/ui，表单需集成react-hook-form v7.5+与zod@3.22校验。请生成LoginForm.tsx文件完整代码，CSS类名必须与图中样式完全一致（包括字体大小、行高、间距），错误提示区域需预留slot供父组件传入。
模板3（文档理解）：
你是一名金融合规分析师，正在审核PDF合同扫描件。图中是合同第7页“数据安全责任”条款扫描件，含手写批注“此处需增加第三方审计权”。文字补充：该合同适用中国《个人信息保护法》第21条，我方为数据处理者。请提取条款原文，指出当前文本与法律要求的3处不符点，并用红字标注批注位置对应的段落编号。
