
智能客服中台 · 多轮意图路由
把意图识别、知识召回与话术生成拆成三条异步流水线,磨砂卡片实时回显每一步耗时,方便定位瓶颈。
把模型推理、数据编排与前端网页设计收进同一套玻璃拟态语义层:半透明磨砂卡片承载状态,渐变透出的冷色光晕指示算力流向,动效交互只做必要的呼吸与淡入。目标是在 6 周 内交付一个可上线的模块化 AI 平台骨架,首屏可交互延迟控制在 1.2s 内。
按业务切面组织,同一底座切换标签即可查看不同场景的落地参数,避免为每个项目重写一套前端。

把意图识别、知识召回与话术生成拆成三条异步流水线,磨砂卡片实时回显每一步耗时,方便定位瓶颈。

视觉模型输出缺陷掩码后,前端用半透明色块叠加原图,硬阴影描边标出超阈值区域,支持一键导出复核清单。
五项能力全部以模块化设计交付,接口契约先行,前端只消费统一的状态枚举与事件总线。
支持 DAG 式流水线,单次调用可串联 3~12 个节点。
统一 backdrop-filter 模糊与内高光描边,风格一致。
冷色系渐变只做低饱和点缀,控制对比不刺眼。
动效以淡入上浮为主,去除急促弹跳与闪烁。
断点覆盖 1600 / 1024 / 640 / 380 四档。
从需求确认到灰度放量,五步走完,每步都有可验收的交付物与量化门槛。
输出 1 页场景卡:目标指标、样本量、失败兜底策略,与业务方逐条确认。
定义请求/响应 JSON Schema,字段命名统一 snake_case,错误码收敛到 12 个以内。
先出 3 个关键页面稿,再抽成玻璃拟态组件,令牌化间距与圆角后进入开发。
并发 200 路压测,P95 延迟目标 ≤ 400ms,超阈即回退到降级模型。
先放 5% 流量跑 48 小时,错误率低于 0.5% 再按 5%→25%→100% 阶梯扩量。
平台迭代与样式规范更新记录,供前端与算法同学同步节奏。
新增令牌桶限流,单租户默认 120 QPS,突发可借用 20% 余量;限流命中时前端展示柔和的等待态而非报错弹窗。
组件库 v3 发布玻璃拟态卡片新增 4 档模糊强度,统一 -webkit- 前缀写法。
动效降级策略上线检测到 prefers-reduced-motion 时自动切换为静态呈现。
冷色系配色校验工具自动检查强调色覆盖面积,超过 10% 即告警。
响应式回归测试每周跑 320px 至 2560px 共 12 档视口的溢出检测。
六条可直接抄进项目备忘的做法,覆盖视觉、性能与兼容三个维度。
同屏嵌套 backdrop-filter 超过 2 层会让中低端设备掉到 30fps 以下;只让最外层卡片模糊,内层改用半透明纯色叠加。
把强调色限定在按钮、激活标签与关键数字上,单屏彩色面积 ≤ 10%;用 oklch 明度差而非提高饱和度来拉开层级。
所有配图放进固定宽高比容器(封面 16/9、场景图 4/3),加 object-fit:cover 与 loading="lazy",避免加载时布局抖动超过 4px。
淡入上浮取 0.3~0.6s、ease-out;Ken Burns 类缓慢缩放周期设 20s 以上;务必补 prefers-reduced-motion 降级,否则阅读体验受损。
backdrop-filter 必须同时写 -webkit-backdrop-filter;background-clip:text 要配 -webkit-background-clip 与 -webkit-text-fill-color:transparent,否则 Safari 上文字消失。
grid 列用 minmax(0,1fr),子项加 min-width:0,容器设 overflow-wrap:break-word;380px 以下字号下调一档、内边距收到 8~12px,确保无横向滚动。
来自已经上线的团队,关注点集中在交付速度与后期维护成本。
“把视觉层和推理层解耦之后,改一次配色不用再动后端,样式回归从两天压缩到半天。”
“玻璃拟态让状态面板好读很多,灰度放量阶段我们靠这套卡片一眼看出哪个节点在拖后腿。”
“响应式断点覆盖到 380px,值班同事用手机也能改配置,这是最实在的一点。”
按接入深度分档,均含设计令牌与组件库源码,可按需叠加私有化部署。
先拿走设计令牌与组件清单,再决定要接哪一层。我们在 48 小时内回一份可执行的接入评估。