Bye Purple! A redesign powered by local & global design system layers at Spotify, with Smith & Tyce

🎧 listen to Episode #09 with Smith Schwartz & Tyce Clee from Spotify sharing the story of their design-system-powered redesign for Ads Manager.

Read on for a peek into the episode.

Spotify’s ad platform just got a serious glow-up, and Smith and Tyce are here to tell us how they pulled it off. Smith Schwartz, Product Design Manager, and Tyce Clee, Engineering Manager, walk us through the redesign of Spotify Ads Manager—why it was needed, how they used design systems to make it happen, and what it took to get buy-in. Smith and Tyce tell us about the shift from a playful UI to a more data-dense, enterprise-friendly experience, how their local design system worked alongside Spotify’s global Encore system, and why storytelling (not just metrics) is key to selling design system work internally. Plus, how a simple name like "Bye Purple" helped them drive alignment and make the redesign a company-wide priority.

🎧 Listen to Bye Purple! A redesign powered by local & global design system layers at Spotify, with Smith Schwartz & Tyce Clee — #09 (56min)

💖 On Theme is a brand new podcast, so if you like what you're hearing, please hit subscribe on your favorite podcast platform, leave a rating or review, or share the show with someone! I love hearing your thoughts and questions, so to text the show or message me on LinkedIn and let me know what you think!

Elyse:

So we've been talking about the engineering side. But Smith, what about from the design side? How are you talking about the way that both Encore, the global design system and your local design system, have been supporting your designers. And how that has been improving the product that your product designers are working on?

Smith:

Yeah, sometimes I'm really frustrated with the term design systems. It's a little bit of a misnomer. It's a noun and really it should be a verb. It's a thing that we do. It's a way of working. It's a strategy, it's a plan. It's all these things wrapped up under this umbrella that makes it sound, to somebody who does not know, like it's just this little thing that we did one time, like, oh, it's a little design project. There's a little bit of internal work you have to do against that sometimes.

But the way that we work with Encore is, we definitely take a yes and model. Anything they build or design or release, we use all of those things. It's really nice as a local system, honestly, they have done a lot of that heavy lifting for us, so what we get to do is come in and build the specialized parts and pieces that we need to build our features.

And so we really build things that are specialized to enterprise B2B platforms, and primarily the ads business, right? Encore releases a lot of great components, but we were finding that there is a bit of a gap in terms of designers knowing what to do with them. So we can put form components all over the page, are we aligning them horizontally or vertically like this, this card has them laid out this way, but this card has them laid out this way.

Elyse:

Your design language.

Smith:

Yeah, we've invested a lot in frameworks and patterns this cycle. We've invested a lot in content design and content frameworks and tone of voice. And how does the tone of voice impact our visual presentation? And thinking about information architecture, thinking about user journeys and really getting into, you know, the gnarlier, meatier, bleeding edge of what a design systems team typically gets to do, we get to do, because we're built upon Encore. Because we have that strong foundation to stand on, we're able to go a little further and deeper into the reaches that a typical design systems team wouldn't get to do.

Right now we're in the midst of some really meaty page layout, information architecture, problems to solve at the systems level. It's really a, a pretty fantastic vantage point to sit from, and I'm super excited about that work.

It's gonna be super fun to release.

Elyse:

I think that's really the future of design systems. I think design systems are more valuable than ever. And not in the way that they were five or ten years ago, but we're still thinking about how do we actually build really good UI? How do we standardize our design language, how do we explain, what makes good UI for our team, for this product, and how do we share that?

Setups like y'all are describing are really the way that design systems are gonna show that value in the future, that we can actually share across our design and engineering team for the specific product, you know, our IA, our page layouts, our responsive tables, form flows, and button alignment, and these more complicated design language things, when you already have your core foundational components solved.

So what are some of the ways that y'all are doing that? Can you give me an example of something, especially that really blurs that design eng boundary, you know, you mentioned page layouts. How are you actually sharing that?

Smith:

It's a conversation that we're always having, right? Like, is the juice worth the squeeze on actually building something? Or is this just going on the doc site somewhere? Is this just guidance or is this something we need to actually enforce through code? And so, you know, we're working through that in a number of different levels. Like thinking about we're calling like our level three, level four navigation, which would be on that page detail level, like your breadcrumbs and how do you get back out to your L2 nav?

Tyce:

I was hoping you'd bring that up because that was an unexpected win at a global level.

So those components were built, and I'm not joking, they were built so well, and shared in a design crit with the Encore crew, that instead of being shipped only in our product, the conversation was like, we'll put that in the local system 'cause other enterprise people might want it. So we're like, okay, sure. And then the Encore team were like, you know what? Just promote it all the way to core, because the whole company could benefit. We don't have this.

Now the reason why that worked I think it's because the designers that worked on that were so on the Encore train, that it was built and designed in a way that just looked like it belonged in Encore. And then our engineers built it in a way that it belongs in Encore. So the way that we structured it, the React and the prop methods, and the way that we managed our state, was more or less like 98% of what Encore would've done anyway. So right now, we are actually in the process right now of releasing that at the highest level.

Now that's such win for us, but it's a win for the company.

🎨🎟️ Into Design Systems is May 25-28. Get your ticket at intodesignsystems.com/ontheme

Into Design Systems is back with their annual virtual conference, May 28-30, 2025. Get your ticket now for three days of practical, hands on sessions showing the what, why, and how of design systems. This year, the conference is focused on developer handoff, accessibility, multi brand theming, and governance. You'll get hands on knowledge you can put to use at work immediately, files and resources to take away, and hear from very well known industry speakers. Get your ticket and support the podcast by supporting our generous sponsor!

See you next episode!,

Elyse