Some upcoming gems are hanging out in the Lab:
Design work has begun on the next round of components:
One of Gusto’s most common building blocks is now available in Workbench. Card has been given an “opinionated” makeover to create distinct content regions that make Cards easier and more predictable for our users. The new Card improves on accessibility by allowing heading levels to be customized according to the page context.Panel is designed as a more flexible counterpart to Card. It also meant to create a visual separation between groups of content, but it lacks a box shadow and doesn’t use predefined content regions.
We recently released the
Heading component, which empowers engineers to create proper heading hierarchies using typographic design
tokens. In other words: it’s now easier to build accessible page structures that can be styled as the
designer sees fit. An
h2 no longer needs to look the same—it can now be styled using any
of our typographic tokens meant for headings.
- Lab components have been moved from the Workbench Web UI Kit to their own file.
- We’re making changes to how we structure components in Figma. Check out the Loom videos for Card and Panel to see how it works.
- The “Ideas” page was removed from the Workbench Web UI Kit. Future explorations will instead live within their corresponding design proposal files.
- Detailed release notes are now available with each update.
Reach out to us in #design-systems with any questions.
Design Systems started out the new year with a new designer. Josh Cusick joins us from Microsoft and brings a fresh perspective on managing design assets in large systems. He is currently working from Seattle, but will soon relocate to Florida. Say hi! 👋
Design Systems is hiring a Senior Product Designer. Know someone who might be interested? Send them our way!
In January we added Algolia DocSearch to the Workbench website, allowing you to quickly and easily find what you’re looking for. Let us know if you see some confusing results and we’ll get them tidied up.
Check out Link testing docs
- We fixed spacing guidance (and examples) between form fields from 24px to 12px
Lab is our prototyping environment where we publish experiments that we test amongst ourselves and with specific early adopters. Components in Lab frequently undergo changes to design and the underlying API, making them less stable and not suitable for widespread adoption. That said, we’re always looking for teams willing to partner with us and kick the tires on our latest ideas, so reach out to us in #design-systems if you see something you’d like to try out.
Have questions? Want to propose changes or additions to Workbench? Need other support or advice on using the system? We’re here for you!
- Reach out in #design-systems
- Office hours are held Wednesdays, 1–2pm Pacific
Warmest regards,Team DS • Ben, Brad, Daniel, Eric, Jordan, Josh, Juliann & Lise