Transcript
Chris S:
Hi, and welcome to the Design Systems podcast. This podcast is about the place where design and development overlap. We talk with experts to get their point of view about trends in design, code and how it relates to the world around us. As always, this podcast is brought to you by Knapsack. Check us out knapsack.cloud. If you want to get in touch with the show, ask some questions, or generally tell us what you think, go ahead and tweet us @TheDSPod, we'd love to hear from you.
Hey everyone, this is Chris, the host of the Design Systems podcast. This week we're doing something a little bit different. A couple of months ago I was approached by Christopher Claire, the director of design for the Facebook platform. He made a suggestion that we host a fireside chat about design systems and sort of their future at Meta with the blueprint team, that's their design system organization. And so we decided that we would host this as a fireside chat in front of a lot of the meta design organization and partners, and we developed a panel for it.
So we have a few folks from Meta and another Knapsacker, Andrew Roman, that were invited to participate in the conversation and have a great chat about design systems, their role at Meta and more broadly, the future of where this is all headed. Two quick things before we get started. First, this was in front of a live audience, so some of the audio is a little bit harder to hear than normal. Secondly, this is long, and so we decided to split this episode up into two parts. So be sure you stay tuned for part two next week. I hope you enjoy listening. Thanks.
Chris Clare:
I want to welcome Chris Strahl, who's the CEO of Knapsack and the host of the Design Systems podcast. It's one of my favorite podcasts. It's actually been incredibly helpful for me personally over the last couple of years as I've been negotiating a lot of conversations within the company. It's been such an amazing resource for me. So thank you Chris for joining and super excited for you to be here.
Chris S:
Likewise. Thanks for having us.
Chris Clare:
Yeah, we're excited to hear your thoughts, Chris. So with Chris is Andrew who manages the customer success at Knapsack, and Andrew brings this really interesting perspective because he's been working a lot with a lot of big companies who have been implementing and sort of making this shift towards a more system design approach and helping with that implementation. So really excited Andrew to have you here and to share some kind of thoughts about how people are really thinking about this outside of the walls of Meta. So welcome Andrew.
Andrew:
Thanks.
Chris S:
Yeah, we're excited about this.
Chris Clare:
Awesome. And then finally we have some familiar faces from the Facebook design side. First, Mitch, who's our head of blueprint, Dan, who's our design director and design system architect and someone who's been really deeply driving this over the years for Meta, including building our comic website, which was very systematically thought of, thought through. We have Adele who leads our design tools, AX and usability work, and again, been one of the leaders here really helping drive that kind of shift towards system thinking. And then finally Elizabeth from the content design team who's the content design architect who again has just been showing I think about just how important content plays in this role of unification and design system thinking. I actually think this is one of our biggest levers. So an amazing panel, I'll hand over to them in one second.
But I just wanted to give context as to why we made this happen. I reached out to Chris just after I took on this role as the head of the platform design team for two reasons. One, as I said, I was a huge fan because personally I think it's helped me kind of think about the way I've been approaching kind of the conversations, which as we all know and we talked about a lot today, I think it's one of these things where it's sort of a no-brainer in the industry right now, but it's still really hard to get people to think about this and shift perspectives. So I wanted to actually just reach out to Chris and say thank you for all of the material and for driving the podcast. So that was one thing. So thank you again Chris. But the other thing was before taking the role, I thought there's going to be things that I imagine are going to come up that get talked about again and again and again on Chris's podcast.
And I think sometimes we struggle to look externally. I think we often live in our own world in Meta, and actually this isn't a problem that we're solving on our own. This is really kind of a big sort of thing happening in industry. And every time I spoke to Chris, we had two calls, I came just so energized about both... The challenges actually become exciting as opposed to draining, which was like, I think this is going to be really great from this conversation, but also there's a lot of very practical things I think we can as thought leaders in this space start to be sharing. So that was how this kind of came about. I know Chris had worked with Eric from our team before. Eric's back from leave this week as well, which is very cool. So huge, huge thank you both for joining and to the panelists. With that, Chris, thank you so much and I'll hand over to you.
Chris S:
Awesome. Well thank you Chris. Beyond the same name, lots of similarities between our backgrounds and our ideas of design systems and where this industry is headed. And I just want to say a huge thank you both to our past guest, Eric, and to you for putting this together. Making me blush about your love of the podcast. Per your comment, when we were first chatting about this, the decision was kind of around how are we going to talk with the team? What's the form? What's the setup for this going to be? And I just really appreciate you being open to the idea of recording this and putting this on the show. So thanks very much. With that, kind of turning towards you all, obviously a lot of changes have happened inside of Meta recently and in particular Chris and sort of this new role and various other things that are going on around the organization. I wanted to hear first from you, how have things changed over the past year since I last talked to Eric and others that have been shaped by this reorg and shaped by a new set of priorities?
Chris Clare:
I mean, obviously it's changed a lot of the way we're thinking. The actual core approach for the app itself has moved to what we kind of refer to as being way more people focused, trustworthy, and unified. And that isn't just a design led thing. That's an approach that we're really driving all up across the business. And I think it is different to how we approached things in the past. I mean, Meta famously has always been kind of the move fast and break things approach. And when you start to take more of a focus around unification and system thinking all up, it creates tension, but really interesting tension there, which I think is actually sort of the space which is driving a lot of what we call foundational innovation here, which is like how do we start to innovate not just in the way we build products, but in the processes that allow for that move fast energy that we have as a company, but whilst doing it in a very efficient way where we're not tripping over each other, we're not sort of shipping our org charts to our users?
And I think that's been the biggest shift is just the kind of conversations there. The knock on effect of that has obviously been the organizational changes where we've moved to be way more sort of one unit again as opposed to lots of separate units inside Facebook. And then I think finally the bit which we're sort of working through now is then how do we ship the culture? And I think that again, they're all really exciting challenges, but they're sort of the three areas that we've seen.
Chris S:
I'm a real systems nerd, obviously. I started a company that's all about systems. And when I think about that unified, trustworthy people first set of priorities, I think about this as a framework for change. This is this ambitious moment that you all are undergoing and undertaking together that really looks on this framework of here's the change we want to make, here's our intention that we're setting, and then here's this realization of that benefit. And I want to kind of try to focus first on that visionary side of it. And I know Mitch in particular, you were focused on some of this organization-wide systems first principles. Why don't you kind of touch on that?
Mitch:
Yeah. As Chris touched on, a lot of this shift to a more unified experience is really kind of rooted in this desire to bridge these gaps between these silos that have existed for a long time. And I think what's really interesting about the Facebook competitive advantage is there's this social fabric that gives us that unique competitive advantage. We deliver social experiences, not just buttons or dropdowns or media tiles on a screen. And so as we start to think more holistically past the lens of a single user who's maybe watching a story or sending a message to these much more complex and richer narratives of maybe a new mother who's joining a Facebook community, making connections, discovering videos, and learning interesting parenting hacks, following a creator, discovering new products to help them on their journey through parenthood.
This tapestry of experiences is all still powered by Facebook. And there's this need for that to feel consistent, unified, and high quality. And so I think by even shifting the narrative of how we're approaching the products, you see this need to drive consistency. And there's a really good overlap between this system's first approach and building a really strong foundation to enable us to connect and experience in interesting ways that we never have before.
Chris S:
Got you. And so that's really using that intention of unification to have this realization for benefit for users. And I love that you really rooted that in user effectiveness. So what does an effective product look like? What does that experience look like? And as that experience moves from part of the Meta ecosystem into another, how does that feel unified in that approach? And so that breaking down of that siloing, how are you guys seeing that happening? What is the vision for what that looks like and how are you investing in that future?
Mitch:
Yeah, I think a really big kind of core investment is in the design system itself and then supporting that with a lot of great technical innovation. And I think Dan, if you want to touch on some of the really interesting key investments there, we can start to unpack that.
Dan:
Cool. Yeah, I think building on what Mitch and Chris covered already, the move to platform design as a team means we essentially three x the amount of designers overnight who are now closely tied and responsible for the design system. With this new team came an opportunity to rethink how we design our system in a more unified way, first by significantly expanding our component library. In the component or the product system approach, which Eric Lab actually covered in depth on this podcast in the past, teams created their own mini design systems specific to their product. And now with this larger unified platform design team, many of those same designers who already kind of had their pulse on the innovation and experimentation that was happening across the app can all help maintain and contribute to the core component library. So these designers continue to stay plugged in with their product teams participating in design [inaudible 00:10:29], experiment reviews, reviewing code, but technically sit as part of this larger team.
This helps create efficiencies since we're all sort of building and contributing to one taxonomy and one set of components and guidelines. This also sort of made us realize that we need to refresh and tighten our guidelines and foundations to remove any ambiguity out of designing a new component or a new variant or a new pattern, essentially taking the guesswork out of design decisions, like what border radius should it be? Or how much spacing should I use? And what icon sizes are a part of the design system? So in parallel to all of this, we also wanted to take the design system to the next generation. So we worked with our engineering team to build out essentially theming infrastructure that basically swapped out a plethora of hard-coded values across our components to point at these new foundations bio design tokens. And so while design tokens aren't necessarily a new concept, up until recently we really had only tokenized color foundations to support things like dark mode. So super excited about this new approach.
Chris S:
Got you. And so this foundation is this way of looking at things like tokens, things about looking at brand in such a way that you'll be able to build on top of that and really kind of realize that future intention where a lot of these decisions that you're making kind of over and over again and being just a part of the way that things get built. Is that really representative then of a more holistic approach overall to the idea of how the design system works within the Meta ecosystem?
Dan:
Yeah. I'd go as far as to say it's extremely holistic and all the way down to the content and the tone, which I think Elizabeth can chime in on.
Elizabeth:
So I'm going to talk just a little bit about content and content design as part of a design system. And we've been talking about how all of this is in service of the unification of Facebook. And one of the most important things, as you can imagine, is really bringing the content experience and the visual, the design experience together. And we have a big investment. We've had an investment over years of having content designers work on our design system. We have some incredibly talented folks that have done that, and we continue to invest in that because we know how important that is. So like product designers, like designers everywhere, we are making strategic UX decisions in service of our end users and also our internal teams. And that goes beyond the guidelines for the content, but really designing all parts of the system. So you all probably know content designers or you may, and you know that they are experts in information architecture and how to structure information. And as you can imagine, this is critical to a successful design system.
So I'll give a quick example about how we're doing this. I'm working on a project right now to add our most common content patterns backed by research into our design system. So for example, on Facebook, what does follow mean across Facebook? How does it show up? What does it look like on the screen? What's the right term for it? What's the system response when you get follow? How is it different from other actions that you take across Facebook? So basically all of the context the designers need to make the decisions instead of simply knowing what component to use, what's the wraparound experience for that? And that is something that content plays a really important role about. So that's an example of how we're sort of moving beyond how you think about our design system.
Chris S:
And we've alluded a lot to the role of content on the podcast, but it's rare that we get to actually talk to a team that has put content sort of as a cornerstone of this. And I mean, Andrew, I think you probably have some insights here into our thinking as it relates to content and design systems and the role it plays.
Andrew:
When I think about systems and when I see teams getting maximum benefit out of systems, it is much more about the systematic operation than it is about the Lego pieces or specific elements that we work with. And so I think content's a great example of that. How do we approach content in a similar way? Think about the priorities and the values when it comes to architecture and how we approach addressing our users' needs with content, that is all systematic work.
Even if the output, the content specifically on different brands is different, it's very similar frankly to thinking about your CICD workflow in engineering or how they support testing. Those should be parts of the system, especially in a complex org like Meta, Facebook, all the parts of your group. You've got a lot of diverse challenges and diverse types of users, but you're all also building product within an organization that has refreshingly aligned ideals. So I think content's just a great example and frankly a huge missing piece in a lot of systems. How do we think about that incredibly important part of the end user experience and get to those experiences systematically is just as important as how do we have an awesome button or nav element?
Chris S:
So you brought up something in that, Andrew, that I think was really good is the idea of it's great to have these intentions, it's great to understand the benefits of them, but one of the things that's really hard about doing this is when you think about the scale of Facebook or the scale of Meta, it really is kind of the elephant in the room. There's a huge amount of scale that has to be thought of as a part of this process and the use of this system. And with that comes some acknowledgement of that complexity.
But here we also have this real opportunity to lead. And what I mean by that in terms of leadership is Meta has been a company that has for a long time led a lot of the foundations of how we build the internet. And likewise, I think there's an opportunity here to think about leading some of the foundations of how we think about design systems. And I wanted to kind of turn it back to Elizabeth for a second and thinking about when we think about this future state within the meta design system within blueprint, how do you envision, first of all how this gets built? I think that there's this idea of where you're going from and where you're headed to and I'd love your perspective on the future here.
Elizabeth:
Yeah. And we talk a lot about this and, I mean, it really comes down to moving from what Chris mentioned earlier, moving from the siloed approach to a unified approach. And I think unified is a big word that you'll probably hear a million times in our answers here. But I have a great example. Years ago when I started the company, I was one of the founding designers on the marketplace team building, if you're not familiar, building our amazing commerce marketplace. And to build that, we were chasing success in a commerce realm. We were optimizing for things like product views and transactions and messages between buyers and sellers.
But doing that meant we had to deviate from a design system. We had to deviate from app unification because we were optimizing for commerce, for shopping, which we were competing with other commerce and shopping apps. So we created our own components, we created our own terminology and our own content systems. And all of that made sense in a commerce experience and was pretty awesome and allowed us to grow exponentially, but it was a bad Facebook experience. And I think what we're seeing now is that was wrong and we are righting the ship and we are making it a much better experience when you move throughout the app versus come in, dip in and use marketplace and go out. So that's where we're headed. That's our vision.
Chris S:
So we're going to go ahead and stop here. This is a nice transition point to part two of our episode, which will be airing next week. Stay tuned.
