Inside and out — part two

Designing the objects that orbit your design system

Part one of this article discussed the decision-making process involved in determining what goes into your design system. Equally important is identifying what stays out — these are the satellite components that orbit the elements within.

How do you design satellite components?

When approaching a satellite component, consider the elements that you already have. There is no need to reinvent the wheel when your design language is already well established. Your fundamental elements such as colour and typography should be determined by your design system, so start with these as a base.

Building upon this, consider the details that make your product look like your product. What border radiuses are you using on your buttons? What animations and interactions are you using to convey brand tone?

Once you have a design solution in a sharable state, open it up for conversation and critique with your broader team. If you have people dedicated to working on your design system, vet your design with them to ensure that new paradigms won’t compete with old ones. Allow other team members to share similar use-cases with you and consider how you might adapt your design to better suit theirs, or make a business case for both of you to meet somewhere in the middle.

Socializing your satellite components

Everyone on your team has an equal stake in your project, so make sure that they have the space to give feedback on your decisions. The best way to approach these conversations is to share them early and often—then share them again. As a globally dispersed team at Zendesk, we use collaboration tools such as Dropbox Paper, Invision, and Sketch to document our concepts and asynchronously collect feedback over different timezones. We’re always experimenting with new tools that help us gather feedback in the most accessible way. Currently, we’re having great success using Abstract in the later stages of a project and RealtimeBoard in the earlier stages.

When this data is gathered and documented, our team will make the time to sync via Zoom and discuss the requirements in more detail. This might happen in the course of our weekly design critiques in each region, or as an agenda item in one of our experience syncs. We’ve identified common experiences among our family of products, and leaders of each experience oversee the design developments within their area.

It’s incredibly important to ensure that many people see your satellite components as soon as possible before they are implemented. While a design system sets your team up for scale, socializing the designs you work on outside of this often leads to collaborative projects with other team members. On a large design team, you can’t afford the time or ego to design in a vacuum.

Using design principles to ensure alignment

Just as you need clarity and consistency when adding to your design system, you need this among your satellite components. Adhering to a common set of design principles in your work can reduce ambiguity and ensure that your design team is making decisions in a consistent way across all features of your product.

Design principles go beyond the look and feel of your product, they are a guiding light — designed with and adhered to by your practitioners of design. As penned by Julie Zhou in 2015: “Good principles are solid. There is a weightiness, a certainty behind them. What looks right, what feels good — these are superficial things.”

Implementing shared design principles is a proven method to empower your team to make key decisions. Principles work to ensure that the integrity of your design system is maintained even outside of its boundaries.

__

It should be clear by now that both the elements inside and of outside your design system share equal importance. Satellite components should be built using the foundational details of your design system and never designed in isolation from your broader team; share early and often.

Keep in mind the evolving nature of your product in relation to your design system, as both need to grow and adapt in order to reach success.

__

Started from the top, now you’re here. Check out design.zendesk.com for more thought leadership, design process, and other creative musings.