A Component’s Journey Through Design, Code, and Documentation

Wednesday, 11th – 12:10 PM

Design systems emerge from all sorts of frameworks, yet web components promise a future of reusability across them all. No matter how you’ve been making systems before, integrating this approach into your design system workflow requires you to up your game. Testing? Check. Accessibility? Check. Architect flexible sizing, theming, and responsiveness? Check.

During this session, Nathan and Kevin will demo how to a designer and developer pair to deliver a new web component to a growing catalog. Using existing visual style, buttons, headers, and icons, we'll design and code a card component on stage. We’ll work in tandem to scaffold up design assets and code in real time while synchronizing naming and API. We'll adjust design tokens, slot content, run tests, "unexpectedly" break things, demo accessibility, cope with ShadowDOM, author doc, and release the component. Buckle your seatbelts and get ready for a ride on the system express!