Case study · 对话
给对话产品一套可复用的打断、澄清和接管语言。
一套给对话产品用的 pattern library:打断、澄清、接管、引用。让 LLM 界面有自己的设计语言。
已上线2024 · 6 个月对话式界面系统Conversational UIFigma · Pattern library
概要
- 职责
- 对话 pattern 与界面语言,减少各做一套气泡。
- 时间
- 2024 · 6 个月
- 背景
- 每个对话产品都在重做输入框和失败态。
- 问题
- 等待、说错、接管没有共同语言。
- 方法
- 把静默、流式、引用和人工接管写成可组合的 pattern。
- 结果
- 新功能不再各做一套气泡,交互有可复用的骨架。
4
核心 pattern
1 个输入
不再各做各的框
可接管
模型说错时的出路
对话界面里的沉默,也是一种交互。
团队每做一个对话功能,就再画一次输入框、一次等待、一次「模型说错了怎么办」。我要一套语言,让 LLM 界面像设计系统那样被复用。
问题
气泡看起来像聊天软件,行为却不一致。有的能打断,有的不能。澄清有时是按钮,有时是又一轮空话。
方法
抽出打断、澄清、接管、引用四件套。每件有状态、文案槽位和失败出口。页面模板退后,pattern 上前。
系统
输入、流式、引用条、接管条共用一条时间轴。静默有自己的节奏,不拿无意义的转圈冒充工作。
工作流
新功能先对 pattern,再对页面。评审问的是「打断发生在哪」,而不是「要不要再做一个气泡」。
结果
三条产品线开始共用同一套输入和接管。设计评审终于能讨论任务,而不是组件打架。
复盘
对话产品的设计系统不是颜色,是失败时人怎么回来。pattern 要写接管,而不只写成功路径。