,

Designing at Scale: Part Two

How we’re creating cohesion out of 16 teams and 1,300 live pages with a design system.

For those of you who are just joining the fun, this follows “Designing at Scale: Part One”, in which our design team set out to answer the important question: What is the secret sauce that creates a cohesive web design experience? Now we know the answer: a consistent and dedicated investment in design systems.

As the lead designers on Square’s Market product design system, Bradley Ryan and Josef Khoo break down the complexity of their work into four focus areas: collaboration, decision-making, experience and team. In Part One, we concentrated on collaboration and decision-making. Our conversation continues with the remaining focus areas, experience and team.

Experience

When I asked Bradley and Josef what exactly experience means to a design system, they were quick to call out the metric used to determine success – make the design system so good that other teams really want to use it. Of course the end users, Square customers, are always in mind with design system adoption. But if the product teams don’t use or evangelize the design system, our end users will never experience it.

Not all designers have the same workflow. We want to create a design system that complements the majority.
Josef Khoo, Product Designer

The experience of the design system comes in different forms depending on the team member. For designers, it’s Figma libraries with supporting documentation. For engineers, it’s design tokens, code repos and, of course, documentation. Documentation, especially in this remote-friendly environment, is a high-impact requirement for designing at scale.

One area in which Bradley and Josef were able to quickly pivot was their delivery of that documentation. In collaboration with their engineers, they originally sought to have one spot for both design and engineering documentation. They quickly learned that even the most thorough documentation can go unutilized as their Slack channels started to fill with questions that had answers in documentation.

Teams at Square experience the Market design system in the form of design tokens, components and patterns. The design system team then leverages insights from product experiences to inform that system.

“If we were to ask 100 designers at Square, ‘by using Market, does it speed you up or slow you down?’ and they say, ‘slow you down,’ we need to reevaluate.”

– Bradley Ryan, Product Designer

In response to those Slack observations, the documentation evolved into additional work on newsletter updates, Slack messages, spreadsheets, presentations and the list goes on. Some of this work is duplicative but, maintaining that lens of empathy, Josef and Bradley continue to meet the users where they are. This provides a great experience for our customers, via the product, and for the internal teams that know those customers best.

Team

The unspoken alignment between Bradley and Josef is a pleasure to watch. The positivity and willingness to listen is contagious. At their office hours and monthly Market onboarding meetings, these two never fail to put each other in the spotlight and gush about the other’s contributions. They so clearly respect one another’s craftsmanship and opinions, which seems necessary for a team of their size. They operate as a small but mighty team of two designers, supporting hundreds of designers and thousands of stakeholders.

Our team, both designers and engineers, just get it. We don’t have any major roadblocks. We share the same vision.
Josef Khoo, Product Designer

Their trust for one another is similar to that of start-up founders. Being so in sync, Bradley and Josef are aware of each other’s strengths, when to use them and when to take a back seat to make the other person shine. As their team grows, these traits of alignment, respect for craft and trust are qualities that are harder to hire for. I would say it never hurts to actively seek out these traits in the interview process. Similarly, my team is growing, and with that comes the risk of moving away from those traits, or feeling tension and misalignment where there doesn’t need to be. As long as we all align on what makes a design system successful, those traits of trust, alignment and respect will naturally take shape.

Bradley and Josef make all this work feel effortless and natural – they’re truly pros showcasing their design expertise and strength. I’m left feeling confident that my team can replicate these best practices across our Marketing Web design system. With that comes a unique set of challenges and hurdles we can’t anticipate. Luckily at Square, there is a culture of collaboration and humbleness that can help us when the hurdles feel insurmountable.