Design

The secret to connecting designers and developers

by

on

View all posts

Most tech professionals use some form of design system, whether that be a sketch library, design tokens, or style guide. When optimized, design systems have incredible potential.

However, designers and developers often think about them differently. And when your team doesn’t see eye-to-eye, it can lead to less-than-optimized processes and outcomes for everyone.

Related: 6 tasty ways for designers and developers to collaborate better

To help uncover a common understanding about building and maintaining design systems, DesignBetter.Co invited Brad Frost, author of Atomic Design, to lead an international group of designers and developers through a full-day workshop in Amsterdam.

Our diverse group commiserated over common challenges, compared workflows, and learned a lot. We listened intently as Brad gave us the inside scoop on design systems, sharing his own valuable insights on the best practices and most practical tools.

Together, we discovered a golden path to improved collaboration.

Design systems workshop

DesignBetter.Co’s design systems workshop with Brad Frost

So, what’s a design system?

Brad taught us that a design system is the story of how your organization builds its products. The base upon which everything else grows.

For designers, a design system means a sketch library or brand guidelines; something to anchor creativity. For developers, it’s more likely to mean coding standards and documentation that guide precise work.

Imagine what can happen when we break out of those silos. In his definition, Brad includes design standards, documentation, and principles along with a toolkit of UI patterns and code components to achieve those standards. A comprehensive design system not only describes the product, but the process of how it comes to life. It can be as rigid or flexible as you need it to be—as long as it suits your product and unique style of work.

“A design system is the story of how your organization builds its products.”

The benefits of a living tool

Dynamic systems improve cohesion and productivity, make testing easier, and serve as a future-friendly foundation for your work to flourish. When a design system stops being a static document, you’ll see improved quality in your products.

Westpac’s did, and they reduced their production effort by 1600%.

ExxonMobil as well: They launched over 100 new web applications in 18 months.

Maintenance is key

Setting up a design system is one thing, but maintaining it as an active part of your workflow is another. The workshop highlighted this as a common challenge that many experience. So how do you make sure it stays up to date?

Design systems workshop

Brad speaks with workshop attendees

One way, Brad suggests, is by assigning different tasks to design system makers and users. Makers are responsible for maintaining the ecosystem; they keep a bird’s-eye view. Users, on the other hand, provide a ground-level perspective. They coordinate with makers to ensure the system addresses their needs. Both should come from different departments to reflect the diversity of your team.

To keep with industry best practices and real-world performance, design systems need to be current. To this end, design system users can propose changes by adding, removing, or modifying as needed.

Related: The value of investing in design systems

For every type of change, there should be a plan in place. When adding new patterns, check if you can re-use another generic pattern that exists. The process for removal is similar; when patterns are rarely utilized, ask why. Make sure you establish a plan for removing patterns and suggesting alternatives.

The path to success

Brad said that building a design system is like building a plane while you’re flying it: “Surround yourself with people who are okay with that.”

The key here is to make sure that your team is on board with the dynamic nature of the process. A tailored, collectively-understood design system will bridge the work of designers and developers.

And this can’t help but improve your product.


Learn more

Inspired by the work of leaders who have gone through the design system journey, DesignBetter.Co captured insights and first-hand experiences in Design Systems Handbook. Don’t miss it!

Author

Roxanne Allard
I am a UI designer, blogger and design system enthusiast. When I’m not playing with my dogs, I create websites and apps that help companies solve problems and realize their full potential. I’m also passionate about connecting designers and developers to help them better understand each other.

Join over 3 million designers

Who get our content first.

No sales pitches, no games, and one-click unsubscribe.

Over 3 million designers
get our newsletter
every week

Find out why

Get awesome design content in your inbox every week

Just like over 3 million of your fellow designers do.

Plus get 3 free downloads, just for signing up.

Give it a try—it only takes a click to unsubscribe.

Thanks for signing up!

You should have a thank you gift in your inbox now—and you'll hear from us again soon!

Prototype better experiences with InVision

Just like over 3 million of your fellow designers do.

I agree to InVision's Terms of Service.

Want a free t-shirt?

Join the 3 million+ designers who get our newsletter weekly for your chance to win!

We hate spam as much as you do, and you can unsubscribe anytime.

Double your chances to win!

Tweet and automatically get a second entry

Tweet Now

No Thanks

Stay in touch!

We share news, freebies, and more on Twitter.

Follow us