交互管的是行为 | 设计交互 | 做产品

交互管的是行为

信息架构决定东西放在哪，交互决定用户在上面怎么动：点了什么、发生了什么、出错了怎么办。

你会遇到的现象

• 界面画出来了，但一交给别人做，细节全靠问

• 做出来能跑，一到边界情况就露馅：超长文本、必填没填、网络断了

• 让 AI 照着截图做，它只还原了长相，行为全是它自己猜的

原型图能传达信息和功能长什么样，但传达不了「怎么用」。按钮点下去发生什么、什么时候不可点、输入框最多能填多少字，这些都不在画面里。你不写出来，做的人只能猜。

它管什么

这一块要说清楚什么

页面流程 页面之间怎么跳、跳转条件是什么、从哪进来又怎么回去

内容布局 每页有哪些模块、各模块的内容形式、不同状态下显示什么，以及字段说明（是否必填、类型、长度、默认值、提示文字）

操作与反馈 每个元素能被怎么操作、操作后系统给什么反馈、有什么限制条件、错误操作怎么处理

三块里最容易漏的是第二块的字段说明。字段长度和必填规则不写清楚，做出来的表单在真实数据面前一碰就碎。

原型图能传达「长什么样」，传达不了「怎么用」

画面里看得见的

布局 · 有哪些字段 · 按钮在哪

画面里没有的

点下去发生什么

什么时候不可点

最多能填多少字、必不必填

出错了、网络断了怎么办 你不写出来，做的人只能猜

最容易漏的是字段说明：长度和必填规则不写清楚，做出来的表单在真实数据面前一碰就碎。 颜色、字号、间距这些外观决策不用写在这里——交互说明只管行为和规则。

还有一条容易忽略的：在画的过程中要形成闭环，每个页面都要能说清怎么进来、又怎么回去。断头路在原型阶段看不出来，上线之后用户只能退出重来。

七类要说清的事

在原型上做标注时，这七类最值得写。写全了，交给谁做都不会跑偏。

类型例子 词语概念自造的词要解释。「快捷入口是一个用于快速访问常用功能的按钮，点它直接跳到指定页面」 设备差异「底部导航栏在 iOS 上用固定标签样式，Android 上用滑动标签样式」 字符限制「昵称限 10 个字符以内，只能包含字母、数字和下划线」 元件类型与优先级「评论内容是多行文本，优先级高，需要突出显示」。单行还是多行、输入框还是搜索框，都要写 操作结果「点击点赞后按钮变为已点赞状态，点赞数加一」 页面状态「购物车有三种状态：空、有商品、异常」 必填必选「用户名、密码、邮箱为必填，填完才能进入下一步」

颜色、字号、间距、形状这些外观决策不用写在这里，交给视觉那一层处理。交互说明只管行为和规则。

还有一条容易忽略的：**在画的过程中要形成闭环。**每个页面都要能说清怎么进来、又怎么回去。断头路在原型阶段看不出来，上线之后用户只能退出重来。

给 AI 的话

把这七类写进需求，AI 就不用猜行为了。

复制 PROMPT · 交互说明 做这个页面：[页面名和用途]

界面结构：[描述，或附截图]

交互规则，请严格按下面执行，不要自行发挥：

• 字符限制：[每个输入项的长度和允许字符]
• 元件类型：[单行/多行、输入框/搜索框/下拉]
• 操作结果：[点击每个按钮之后分别发生什么]
• 页面状态：[列出所有状态及各自的触发条件]
• 必填必选：[哪些必填，未填时按钮是什么状态]
• 入口与返回：[从哪进来，怎么回去]

另外：

• 颜色、字号、间距按项目现有设计系统，不要新造。
• 上面没写到的行为，先问我，不要自己决定。
• 实现完成后，逐条对照上面的规则做一次自检， 告诉我哪几条你确认做到了、哪几条有偏差。

最后一条是低成本的验收。让它自己对照清单报告一遍，比你逐个点过去快。

接着看

四态齐全 七类里的「页面状态」展开。空、加载、出错、正常，AI 默认只做最后一种。

列状态清单 把七类里的状态和操作结果做成一份可以逐条勾的清单，写代码之前先过一遍。

页面地图 「入口与返回」那一条的全局版本。地图画完，闭环检查就是数一遍连线。