How Eventbrite saved 534 days of engineering effort with zeroheight

Like lots of other organizations, Eventbrite has gone through multiple different design systems. Some were started by passionate designers who yearned for more product consistency. Others were team efforts that included a few components and enjoyed limited amounts of adoption. But, none of those efforts quite solved the problems that a well-maintained, widely adopted design system promises.

In December of 2021, the company decided something had to change. And to ensure their new take on a design system would be successful, they began the search for members of a brand-new Design Operations team.

By February of 2022, the team was fully staffed, and they began work on creating a design system.

The team’s first goal was transitioning to a design system platform that would make it easy to maintain a single source of truth. After that was accomplished, DesignOps started working on bridging the gap between design and development and ensuring product quality.

Creating a Single Source of Truth

Other than suffering from poor adoption, the other attempts at a design system at Eventbrite had something else in common: employees lacked confidence in the information.

Mikaila furthered, “We knew we’d always need a single source of truth. That’s what Eventbrite suffered from the most…people not feeling confident in any information they might encounter.”

Since confidence was key, the Design Operations team focused heavily on making sure the information included in their design system, Marmalade, was complete and up to date. Every component would include accessibility information, a code snippet, usage guidelines, and additional information to help both designers and developers use it in their work. As an added bonus, the team even thought to include a “Wall of Fame” to showcase how the component was used in production.

Another thing the Design Operations team focused on was ensuring the design system was up to date and looked the part. For timely updates, zeroheight has been crucial. Mikaila furthered, “zeroheight is able to help us get the guidelines that people need to them faster than if we were to use an in-house tool. Non-engineers can use it, and we can update it instantaneously.”

zeroheight is able to help us get the guidelines that people need to them faster than if we were to use an in-house tool. Non-engineers can use it, and we can update it instantaneously.

With instantaneous updates, Eventbrite employees can rest assured that the information documented reflects the most current guidance.

Plus, the mere existence of a dedicated platform for the design system has helped get everyone excited and adopting the guidance. Mikaila details, “Having this platform where we can say ‘here’s the source of truth for this product’ makes it feel more real in people’s minds. If we had an area of Confluence within the organization, it’s just not the same as saying, ‘go to this custom domain, look at the branding, and you’ll feel like you’re somewhere different.’”

Finally, after multiple attempts, Eventbrite has a well-maintained design system everyone can feel confident in using.

Connecting Design and Development

“It was our goal when we started this project to not only make information readily available but also bring design closer to code and code closer to design,” states Katie Furtoss, Senior Content Designer at Eventbrite.

To ensure design and code were in sync, the team made sure everything had the same name in Figma as it did in code. And, of course, everything was documented in zeroheight using the Storybook integration.

Mikaila wanted to ensure “everyone was using the same language so they could push efficiency through faster as well as narrow down the handoff stage.”

So far, the results of reducing the divide between design and development have been enormous.

The team quantified the effect of Marmalade by first having developers estimate the time it would take to develop a component. Then, they measured the amount of time it took to install the component from the design system. The difference represented the time saved.

Mikaila furthers, “We measured success by engineering time saved. As of the end of February 2023 (just nine months after launching the design system in May of 2022), we had saved over 534 days of engineering effort.”

As of the end of February 2023 (just nine months after launching the design system in May of 2022), we had saved over 534 days of engineering effort.

Ensuring Product Quality

While focused on product team efficiency, the Design Operations team also set its sights on improving product consistency and accessibility.

The way to achieve this was simple: ensure every designer and developer at Eventbrite used the same ingredients.

Mikaila explains, “We always liked the idea of a grocery store where the things we are making are ingredients and recipes, and so all of the components are different ingredients that you put together into these recipes.”

For the Eventbrite team, the “grocery store” (their design system), helps team members create quickly. Mikailia continues, “If every chef at Eventbrite that’s trying to create a masterpiece for users had to thresh wheat or grow tomatoes every time they needed a pizza to solve their problems, that’s highly inefficient and over time that leads to so many bigger problems.”

Apart from empowering the team to move faster, using the same “ingredients” has also made for a more consistent, quality product. The design system team can rest assured that everyone is using components that are user-tested, accessible, and on-brand.

Continuing to Jam

Katie describes Marmalade as “how we jam together.” And, that’s not changing. In fact, Marmalade may now be even more important to the team.

Mikaila recalled, “Our team actually suffered from resource loss after a structuring. So, zeroheight has become even more important as a way for a largely non-technical design- based team to be the bridge between our more technical customers and the rest of our team.”

As the Eventbrite team continues to prioritize design operations, Marmalade is emerging as the company’s technical meeting place to ensure the product is top-notch while also helping to streamline the work of product teams.