To improve consistency across our family of apps, engineers have built a large number of reusable components. But how do designers communicate to engineers which component to use? How do you keep the look consistent across our various frameworks? How do you make sure that documentation stays up-to-date? The way we always do: by building tools. Sriram from the Design Systems Engineering team talks about how their org solves the design-engineering handoff problems and improves the overall UI quality of Facebook apps. They work on a suite of tools that spans from providing access to our components directly in design tools like Figma to metrics that tell developers about potential quality issues in their surfaces. Tune in to learn directly from Sriram how we attempt to solve design at scale.

Links:

• F8 Refresh: https://www.f8.com/
• Flipper: https://fbflipper.com/
• Facebook Open Source on YouTube: https://www.youtube.com/c/FacebookOpenSource
• Storybook: https://storybook.js.org/
• InVision Design System Manager: https://www.invisionapp.com/design-system-manager
• Figma: https://www.figma.com/

Timestamps:

• Intro 0:06
• Interview 2:39
• Outro 30:17