需锚定真实场景定义状态图：先明确具体操作（如电商结算页点击“立即支付”），再列出所有可感知界面变化，区分原子动作与副作用，嵌入终端约束（如ios弱网超时分支）和用户特征（如老人模式tts播报），最后用视觉/交互动词描述状态及退出条件，排除非界面行为。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
你需要让通义千问把前端组件的交互逻辑准确转成状态图（Statechart），但直接扔一句“画个状态图”往往生成的是抽象流程图或UML草稿，根本没法对接开发；真实项目里，按钮点击后是否禁用、加载中状态怎么透出、错误弹窗关闭后该回到哪个节点——这些细节必须从具体使用场景里抠出来。
先锚定真实场景再定义状态
第一步：在提示词开头直接写明用户正在做的具体事，例如：“用户在电商App结算页点击‘立即支付’按钮，此时收货地址已选、优惠券已勾选、余额不足需跳转充值”。
第二步：列出该操作链中所有可感知的界面变化点，比如：“按钮文字从‘立即支付’变为‘支付中…’→底部弹出‘余额不足’toast→3秒后自动关闭toast→页面跳转至充值页”。
第三步：明确哪些变化是原子动作、哪些是副作用。例如：“按钮变灰”是UI反馈，“调用支付接口”是后台动作，“跳转充值页”是条件跳转——【状态图只描述UI可观察状态与触发条件，不画API调用】。
用角色+设备+网络环境锁定行为边界
方法一：嵌入终端约束
在提示词中加入：“用户使用iPhone 14运行iOS 17.5，当前处于地铁弱网环境（RTT＞800ms），支付按钮点击后若3秒内无响应，则显示‘网络慢，请稍候’重试按钮”。这会强制模型把“超时”作为合法状态分支，而不是默认忽略。
方法二：绑定用户身份特征
例如：“用户是65岁以上老人，系统已开启‘大字模式’，结算页所有按钮尺寸放大1.5倍，且‘立即支付’按钮旁固定显示语音提示图标（点击朗读当前操作）”。这时状态图里必须包含“图标点击→触发TTS播报→播报完成→恢复待机”的子状态流。
注意：不要写“假设用户网络正常”，真实场景里没有“正常”——只有“已测得丢包率12%”或“Wi-Fi信号格仅1格”。
把开发术语转成界面可验证动作
第一步：替换抽象词为视觉/交互动词
把“组件进入loading态”改成“支付按钮背景色变为#E0E0E0，内部显示旋转菊花图标，文字置灰不可点击”；把“状态回滚”改成“点击‘返回’后，优惠券勾选框恢复为原勾选状态，地址栏保持展开”。
第二步：标注每个状态的退出条件
例如：“‘支付中…’状态仅在以下任一条件满足时退出：① 接口返回success → 进入‘支付成功’页；② 接口返回fail → 显示toast并恢复按钮原始状态；③ 页面停留超时10秒 → 自动触发失败逻辑”。
第三步：显式排除非状态行为
加一句：“不绘制HTTP请求过程、不表示数据库写入、不描述Redux store变更——所有节点必须对应用户能看到或能触发的界面元素。”
