如何在规模上衡量设计系统
The Uber Rider app launches features simultaneously on a global scale, changing details across hundreds of screens using thousands of feature flags. It is no longer possible for any designers, engineers, quality assurance, or product managers to fully visualize every single user flow. Uber needs an observability system of similar scale for measuring design quality to prevent subpar user experience, especially when it comes to adopting the existing UI libraries and accessibility best practices packaged under the Uber’s Design System, Base. Without such an observability system–let’s call it Design System Observability–it could be too late when Uber learned through complaints and public media about the end users who would suffer confusing onboarding rides, inconsistent layouts, and frustrating voiceovers/talkbacks sessions.
Uber Rider应用程序在全球范围内同时推出功能,在数百个屏幕上进行细节更改,使用数千个功能标志。任何设计师、工程师、质量保证或产品经理都无法完全可视化每个用户流程。Uber需要一个类似规模的可观察性系统来衡量设计质量,以防止次优的用户体验,特别是在采用Uber设计系统(Base)下的现有UI库和无障碍最佳实践时。如果没有这样一个可观察性系统,让我们称之为设计系统可观察性,当Uber通过投诉和公众媒体了解到最终用户遭受困惑的入门乘车、不一致的布局和令人沮丧的语音反馈/回话时,可能为时已晚。
Design System Observability consists of two main components: an eye and an ear.
设计系统的可观察性由两个主要组成部分组成:眼睛和耳朵。
It is often hard to tell by the naked eye the differences between the design specs handoffs and the final implementation in the actual apps.
通常很难用肉眼区分设计规范的交接和实际应用中的最终实现之间的差异。
Figure 1: Designer-eye challenge. Without the marking, very few could tell the “Confirm your pickup spot” sheet and the back button implementations (left) were not up to Base design hand-off (right).
图 1:设计师眼睛挑战。没有标记的情况下,很少有人能够分辨出“确认您的上车地点”表单和返回按钮的实现(左侧)与 Base 设计交接(右侧)不符。
Figure 2: All Base UI library components were marked as green while one-off custom components were marked as red. This helped both designers and non-designers see what can be made with Base.
图2:所有的 Base UI 库组件都标记为绿色,而一次性自定义组件则标记为红色。这有助于设计师和非设计师看到使用 Base 可以做什么。
At Uber, we strive to reuse components if they have already been built. Hence, it has become critical for us to measure this very important metric c...