返回博客

技术分享

AI × UI交互卡片工具执行

AI × UI:从对话到可操作的界面

自然语言负责表达意图,结构化工具负责执行,卡片让结果可读、可操作。

ISEA Team
更新于

“午饭花了 35 元,下午三点提醒我交材料。”这句话同时包含记录和后续动作。让 AI 回一句“收到”很容易;让用户看清保存了什么、提醒设在什么时候,并能继续操作,需要更完整的交互链路。

与海把对话、工具和界面分开处理,再用同一份任务上下文把它们连接起来。

自然语言先变成具体操作

模型需要识别记录类型、金额、时间和动作。必要的信息不足时,应先澄清;涉及“明天”“下午”等时间表达,要结合本轮请求的时间与时区。

随后,工具按明确的数据契约接收操作。模型生成的文字本身不会直接变成一条合法记录:输入需要经过边界校验,执行需要满足账号和数据规则,结果还要返回给当前会话。

这让我们能够分开回答两个问题:AI 理解得对不对,以及这次操作有没有真正完成。

保存与展示各有一份责任

记录工具负责写入并返回结果,展示工具负责把信息组织成适合阅读和操作的界面。展示出一张漂亮的卡片,不等于数据库已经写入;写入成功,也不一定需要一大段文字重复解释。

例如,支出可以展示金额和分类,待确认的导入可以展示预览与操作入口。界面保留用户需要判断的信息,把重复的叙述留给更简洁的反馈。

原生卡片与交互卡片怎样配合

原生卡片使用客户端已经支持的组件。请求声明可用卡片,服务端检查卡片标识与数据,再由客户端渲染。这样可以让特定交互沿用 App 的操作习惯。

另一类交互卡片提供更灵活的内容布局和交互表达。灵活展示仍需要服从平台允许的动作和数据接口,不能把一段界面代码当成任意数据库权限。

客户端不支持某种卡片、输入不符合要求或渲染失败时,应展示兼容提示。版本差异需要被明确处理,不能让用户对着空白区域猜测任务状态。

文件导入为什么需要确认卡片

批量导入可能一次产生很多记录。与海先解析、校验和准备完整结果,再让用户检查并确认写入。试解析成功只说明格式可以被理解,最终完整解析与写入仍有各自的结果。

确认步骤把“AI 已经理解文件”与“用户同意把这些内容加入记录”连接起来。取消时保持未写入状态;执行失败时报告失败阶段;重复提交则在支持的身份范围内复用回执。

界面应该回答的三个问题

好的 Agent 界面应让你快速看清:现在进行到哪一步,已经产生什么结果,接下来是否需要你操作。

对流式回复、工具运行和结果卡片,我们希望保持已显示内容稳定;状态变化提供轻量反馈,重要动作给出明确结果。真正需要保留的是操作的可理解性,而不是让每一次回答都变成复杂面板。

继续阅读:文件导入如何从预览走到可信写入。