页面慢不是工程师的锅：一个设计系统如何拖垮或拯救你的AI产品

大多数人以为性能和可访问性是工程问题，但这场来自 Figma Config 的分享给了一个反直觉答案：真正决定用户体验上限的，是设计系统的“地基”。更意外的是，设计师随手选的颜色、字体和组件复用策略，可能比你写的模型代码更影响用户是否留下。

最反直觉的一点：性能体验，设计师才是第一责任人

Tricia Cigna 在演讲中抛出一个让很多人不舒服的事实：用户对“快不快”的感知，往往在代码执行之前就已经被设计决定了。她给了一个清晰的心理学区间——1到2秒，用户觉得是“即时响应”；2到4秒，开始感知等待；4到6秒，用户意识到“机器在工作”；再往后，用户就开始“心理切换”，本质上就是走神、放弃、流失。

问题是，很多性能问题并不是后端慢，而是前端资源被设计阶段“悄悄透支”了：越来越重的插画、复杂的动效、不断叠加的字体和颜色变体。尤其是响应式设计，本来是为了解决多端体验，却常常变成“在小屏上强行加载大屏资源”的不负责任行为。

她的判断很直接：如果在设计系统的基础阶段没有把性能和可访问性当成硬约束，那你等于是在系统层面“预埋”了失败。对 AI 产品尤其如此——当模型推理已经够慢了，任何额外的前端延迟，都会被用户无情放大。

设计系统的地基：颜色、字体、网格，决定了加载速度

Tricia 把“数字化基础（digital foundations）”拆得非常具体：颜色体系、字体样式、栅格与模板、间距规则、图标系统。这些听起来像是设计规范，但她强调，它们本质上是性能工程的一部分。

一个关键例子来自颜色与组件复用。通过构建有组织、可主题化的颜色体系，组件在不同页面复用时可以被浏览器缓存。第一次加载可能会有轻微延迟，但之后的体验会明显变快。这种“设计模式级别的缓存”，不是工程师单独能解决的。

字体更是一个隐形杀手。她提到一个非常具体的数据：通过将字体家族和字重控制在最小集合，并整理出大约30个关键字体样式，他们把单页加载的字体文件数量减少了将近80%。这不是微优化，而是量级变化。

最后是响应式布局。好的网格和模板设计，能让 HTML 层级和 CSS 组织保持一致性，避免为了适配不同尺寸而引入大量冗余标记。这意味着：设计系统不是“视觉皮肤”，而是决定前端结构是否健康的蓝图。

可访问性不是“照顾少数人”，而是为所有真实场景设计

谈到可访问性，Tricia 特别强调一个容易被误解的点：不要只为“有障碍的人”设计，而是为“真实的人”设计。她举了一个极具画面感的例子——一位妈妈，一只手抱着孩子，另一只手提着购物袋，还要在手机上输入地址导航。这不是残障，这是日常。

因此，她主张在设计系统层面就内建可访问性目标：任何使用这个系统的人，都应该能“默认”做出可访问的组件，而不是事后补救。这一点对 AI 工具尤为重要，因为它们往往面对的是高频、复杂、跨场景的使用。

在实操层面，她列出了一组非常基础但常被忽略的设计要求：
- 明确可见的焦点状态，让键盘用户知道自己在哪里；
- 足够的前景与背景对比度，不只是为视障用户，也为阳光下用电脑的人；
- 不要只用颜色传达信息，错误信息要有图标或其他视觉线索；
- 表单标签永远不要消失，必填项和错误提示要清晰；
- 正确的标题层级，因为屏幕阅读器是靠它“导航页面”的；
- 高质量的替代文本，它的目标是“传达同等信息”，而不是敷衍合规。

她直言，这是设计师少数能真正练习同理心、走出自身视角的机会。

最后的警告：有系统，不等于有结果

演讲的收尾并不鸡血，反而很克制。Tricia 明确承认：即使你构建了一个可访问的设计系统，也不能保证最终产品就是可访问的。系统只能提供“可能性”，不能替代个人责任。

设计师、产品经理、工程师，每个人都要对“是否真正包容所有用户”负责。这句话放在 AI 时代尤其刺耳——当我们把越来越多决策交给系统时，更容易忽略边缘用户的真实体验。

她的潜台词其实很清楚：设计系统不是终点，而是一份长期的价值承诺。

总结

这场分享给 AI 从业者的最大提醒是：不要只盯着模型指标和推理速度。用户对你产品的第一印象，往往来自设计系统层面的“慢”“卡”“难用”。真正成熟的团队，会在设计地基阶段就把性能和可访问性当成硬指标，而不是上线前的检查项。一个可行动的建议是：回去看看你们的设计系统，颜色、字体、组件是否真的在“复用和缓存”，还是在悄悄消耗性能？以及——一个不太舒服但必要的问题：如果你闭上眼睛，用键盘或读屏器来用你的 AI 产品，你还能完成核心任务吗？

关键词： 设计系统， 性能优化， 可访问性， 用户体验， AI产品

事实核查备注： 需要核查：演讲者姓名 Tricia Cigna；所属团队 Dick's Sporting Goods Home Field Design System；字体文件减少近80%的具体表述；用户感知延迟的时间区间（1-2秒、2-4秒、4-6秒）；视频发布时间 2020-02-27