Chris Strahl:
Hey everybody. It's Chris here with Davy Fung. He's the manager of design systems at Meta, and was formerly at Disney Plus/Hulu. Really excited to have a chat with you today Davy. I'm looking forward to diving into some things around the history of the design system you manage, some of the org design and, honestly, the breadth and the scope of apps you're able to work with and support.
Davy Fung:
Yeah. Thanks for having me, Chris.
Chris Strahl:
One thing before we really get started, I wanted to just give you a chance to give a quick plug, really loving the Design System's Office Hours. Tell us a little bit about that.
Davy Fung:
Yeah, so we spun up, my co-host PJ and I, a podcast called Design System Office Hours. Surprise, surprise, it's about design system. So, if you're interested in hearing more about that, follow us on Spotify, Apple, or wherever you get your podcast. It's an open conversation, much like what we're doing here. We try to find a topic that we just like to really dive deep on for about 30 minutes. So, we've talked about things like documentation, Figma not being a design system is going to be our next one, hot topic, but then other things like project management. And then our first episode was a good one, just about design management and the lens of design systems. So, it's a conversation between two practitioners and it's just a really good excuse to be able to talk to my friend on a weekly basis. And we've been very inspired by your podcast, Chris, and the idea of storytelling, and having these open conversations about soft skills and how to influence in this space.
Chris Strahl:
Well, love that you guys are adding more content to this community. It's very much needed. Everybody go check it out. Onto the design system work, so Disney Plus, Hulu, large scale streaming application. This is something that exists across a huge variety of platforms. Tell me a little bit about the design system's story, maybe a brief history. And I think that what is actually the more interesting piece of this is not as much what the design system is, but what it isn't. So, maybe dive into that for a quick second for me.
Davy Fung:
Yeah. So we had started, I would say what we call our lowercase d, design system. We started in managing component libraries from the jump. We started development of Disney Plus in 2018, and we instantly had gotten adoption to work in this sort of manner. So, I think a lot of the conversations about adoption getting buy-in, our previous design lead on our team was able to do that for us. So, we're operating very much in a platform design framework, where I was managing the web component library and two members on my team, that are still on my team now, had managed the living room device platforms and mobile. And it was very much federated. It was federated all up through launch through 2019, and I think what really elevated the practice.
And when something is federated, we don't see it as a practice. We see it as aspirational. This is what we want to do. We want to get this off the ground and see where it goes. We were able to spin ourself up under the guise of a design ops team and my mentor, Bailey, who's now at Twitch, she was the first member of this design ops team and we saw this as a unique opportunity to spin ourself up as a horizontal team supporting design systems full-time and we were able to do that in 2020.
Chris Strahl:
That's awesome. So, the evolution there is really like, "Hey, we were a bunch of people making coded components for different platforms," into this idea of like, "Hey, we need to broaden this viewpoint." And the broadening of that viewpoint, the avenue for that for you guys was design ops.
Davy Fung:
Yeah. 100%. And there's even specific nuances when you have three different people working on similar things like the naming and the taxonomy of our components were similar, but not identical. Our type ramps were similar, not identical. Same with color. And those were, ironically, I think, the two things that we wanted to hone in on post-launch, cleaning that work up and seeing how we could unify this across three platforms once we set our team up.
Chris Strahl:
Yeah. I'd be curious how you solved line-height?
Davy Fung:
Line-height is a little bit of a skeptical one. There's a few other ones that I think-
Chris Strahl:
I'm kidding.
Davy Fung:
That are also a bit spicy. Spacing is one, when you're going across small screen sizes to large. So, we really found that if we could really hone in on typography tokens and color tokens, we thought that we'd be able to get most of the way there to the path of success.
Chris Strahl:
Right. And this is actually, I think, one of the really cool parts here, is you guys have dozens of platforms that are ultimately represented by, like you said, living room devices, by native apps and native mobile for Android and iOS, and then a web experience as well.
Davy Fung:
Yeah.
Chris Strahl:
There's not a lot of common threads between those different platforms. And so where was that common ground that you found?
Davy Fung:
Yeah. Type and color is certainly that. There is, I think, a big conscious effort while we were developing Disney Plus to maintain the same color ramp across television, mobile and web. There are some nuances that we were allowing designers to partake in which really just goes around just the differences in how colors are interpreted on a television versus mobile. But we really wanted to, after launch, really test the hypothesis on whether we could just utilize one color ramp. Two years after this point, in 2020, we're now looking at the same idea on the Hulu design systems. And they have the same problem that we had two years ago where they had a color ramp that was just a smidge different across the platform area. So, I'm finding a lot of confidence and I'm finding a lot of validation in some of the ideas that we were trying to bring up two years ago.
Chris Strahl:
Definitely. And so what you're talking about a lot with this is like, "We have a pretty serious set of constraints because there's not something other than tokens that's truly cross-platform here." And you have a bunch of different teams that all have to figure out how they're going to leverage a common design system or, at least, a common structure for a design system. Tell me what that looks like. What is the way that, that work happens, where you have things that are specific to web, you have things that are specific to native mobile, you have things that are specific to living room devices, but there is a common core, at some level, that ultimately allows you to take your identity for your streaming app, your brand, and then replicate that across platforms in a way that is systematic? Talk to me a little bit about the particular construct there, about how that's built.
Davy Fung:
Yeah. I could talk a little bit about how we got the conversation started too. And I think when we started centralizing ourself under design ops, that gave us a voice very easily. And I think, previously, when we were a federated design team, we were just this rag tag of folks, just really interested in pushing this work forward, but there was-
Chris Strahl:
The insurgents.
Davy Fung:
Yeah. The insurgents. And we were there and I think we also had a seat at the table, which is a silly metaphor, but I think that, that is extremely meaningful to mention because it brought us up into this senior manager design leadership tier. So, we were there, we were participating, we were able to advocate for ourself. So, one of our first orders of business that we developed was we wanted to have this, let's say, it's like a Jedi Council of design system and the design engineers, right? And so we have seven client engineering teams. I had to write them down, so I don't forget. There's PlayStation, Roku, Xbox, the team that supports smart televisions. And then there's the common ones that most of you all are familiar with, Web, Apple, and Android. And this team meets weekly. And the goal of this was to discuss this token strategy and see how we could extend it.
There's principals and leads and design system enthusiasts that are in this meeting. And we're able to talk about how we could align on this token strategy. And you did mention web. Web, luckily, I think, is a team that we've been super in the fold with, in the pocket, and we've been able to, you mentioned line-height, we've been able to extend some of the design tokens to support things like line-height, spacing, and other things that the other six teams are not ready to bring into the fold, but we have a lot of good thinking there.
Chris Strahl:
That's awesome. And you guys have this common set of design tokens that expresses it as a platform agnostic, brand agnostic set of themes?
Davy Fung:
Yes.
Chris Strahl:
And so talk to me about those themes and how you take this Jedi Council, which by the way, I love the on-brand analogy metaphor, tell me how this Jedi Council thinks about the idea of creating these thematic things and what that really represents because we've heard in the community a lot the story of design tokens, oftentimes told through the lens of Spotify and their team and what they were able to accomplish with them. I'm curious, though, how you guys think about this in a much newer app architecture. You guys only existed since 2018, that's a relatively short timeframe. Talk to me about what themes has really enabled for you.
Davy Fung:
Yeah. The story and the pilot starts off with this application, Star Plus. We launched Star Plus in August of 2020, and their theming really took in effect when we were expressing the mandate that we're going to be building this regional specific Latin-American application built on the foundations of Disney Plus. So, what does that mean? I think, very simply, when we were discussing this design leadership is we're going to make a general audience application that has different content and we're going to be turning a blue app to a orange app. And, at one point, we would then also decide, we need to turn this orange app into a pink app. And that was a little bit of a detour when we were developing the token strategy. But I think where we were set up and the thinking to move away from this brand-specific token architecture, we were able to flip our brand, even in-flight, from orange to pink.
And when I say it is built on the foundations, there's, I think, obviously, different content types that are represented in this app. There's live content, which Disney Plus at the time did not have. There is different variants of metadata cards that were new. But the whole scheme of this thing is we want to be able to develop components and patterns that may be launched on one particular app, but can be extended across the suite of apps that we support. So, that's Disney Plus, Star Plus, and Hulu. So, I think that was a little bit of the challenge of the thinking, as well, that if we're really able to think about building components and patterns in a platform agnostics way, a Hulu component can be brought over to Disney Plus, and that should be no problem with theming.
Chris Strahl:
That's actually pretty incredible because you're not just saying that a Hulu component can be brought to Disney Plus, you're saying a Hulu component that's present across seven different application teams can also be brought to seven different application teams at Disney Plus. There's almost another order of magnitude of complexity here around, it's not just about like, "Can I get this innovation that happens over in this one app over to this other app?" It's, "How do I get this ecosystem advantage that I have over in Disney Plus over to this other ecosystem that ultimately represents a really broad application space?"
Davy Fung:
Yeah. I think the fun in this is something as atomic as, let's say, badging. I'm going to create a custom badge to hold timestamps or states of metadata. So, Disney Plus and Hulu both have things that air either live or things that we want to mark as a new or premiering content. In this time, right now in 2022, we don't need to reinvent the wheel. We have three versions of these badges. It's really in our best interest to start uniting and bringing one badge spec together. So, I think, when we start thinking about if you are a Disney or Hulu designer, the opportunities it's extremely immense these days, because you're going to be possibly designing this badge spec that could work across all three of our platforms or all three of our brands.
Chris Strahl:
Right. And the ability to basically take an innovation that happens in one place because the power here is, "Yeah, sure. It's great to be able to say like, 'I'm going to design something in one app and be able to spread that to other apps.' " But there's a lot of research that goes into that, right? There's a ton of UX research, a ton of thinking, a ton of really smart people that put their heads together and say like, "This is the best streaming experience for our users." And the ability then to take that same effort and bring it to another application ecosystem or another part of the ecosystem and say, "We get all of the benefits of that thoughtfulness and that research and that time spent really designing that experience across a much broader platform," that feels like a huge force multiplier for design. And that seems to be a big part of the reason why design ops is so important to this effort for you, is getting that reach through that design ops team.
Davy Fung:
Also in design ops, specifically, it gives us the opportunity to say, "We need to do this specific initiative to empower us to then work in the same spot." So, this will be, probably, the first and only time I'm going to mention Figma specifically, but Figma was where all of the Hulu design system, their components, and their templates was living. Disney and Star, when we were looking to bring our teams together, we're not there yet, so we utilized our influence and design ops to say, "This is the time. We want to be coworking in the same space. We want to be jamming together in a common canvas. We need to get our shit out of sketch and get into Figma."
So, we're in the same playing field. And in order to be able to execute this cross-brand strategy, we need to be in the same spot. So, we were able to quickly put that strategy together, rebuild a lot of our core components in Disney and Star, and we're at the space now where we spent the better part of last year doing that and we're at a good space now where we're able to traverse components across brands.
Chris Strahl:
Yeah, that's awesome. And so, design ops is really the lever that you guys use to help that cross-organizational change really happen because, presumably, design ops inside of your organization is very cross-functional or very cross-brand where it's looking at design, as a whole, for Disney and saying, "These are the places that we have the opportunity for efficiency or effectiveness gains in the way that we think about design." And that represents the lever that the design system team has been able to use to really make this cross-platform capability happen.
Davy Fung:
The other very, very important aspect of design ops being able to push this forward is it does create a push towards other program managers and other managers coming into the fold and adopting our office hours. So, I think we are in a much better spot where we feel that we have that voice. We are able to inject ourself into the conversation. And I think one very big part of the process, I think, has improved since we've been in design ops as well is we've been working alongside feature designers as they're iterating, and through this discovery process. So, they'll hit us up and ask us, "What do you have in terms of this component or this pattern?" Or they'll have a specific component that we start with, and this is the ire of design system folks is that, that's when you detach, but we're all good with that.
Yeah, you detach and then let's try to see what sort of variants you need to create. And then we're trying to really work in this micro-agile space with design in parallel, and as they're working through their ideation, we're building variants and it's a very agile process and that is somewhat new for us. We used to be in a spot where we were more on the production side, we would pull in and codify components deeper in the process. But that idea of spiking at the end just wasn't something that could scale when you're working on three brands simultaneously.
Chris Strahl:
Yeah. And you guys had to reach a level of maturity where you could prove that all of that was going to work. And then now that it works, the next evolution is being able to flex as new needs are presented to you all. And, ultimately, that's a contribution, right? When somebody is saying like, "Hey, I have this need in a design space or an engineering space to build this particular thing." And they come to you with your trench coat full of components and you say, "Hey, that doesn't exactly match anything that we got here," that gives you an opportunity to understand and identify that as a new need. And that feels like product management for your design system.
Davy Fung:
It does. Yeah. And this plug towards Design Systems Podcast episode, there's a lot to learnings when you talk to Maya from REI as well. And I think the product ownership in design systems also is a fairly new space on our team. I would say, I serve a few hats, I wear a few of them. I'm the design system product owner, I'm a people manager. And then I formally did come from a feature design background working on this team. So, I very much know what the requirements and what a successful spec may look like. I have a very good idea, based on working with the Jedi Council, what will be accepted by engineering. We have a very good idea of that.
And we try to utilize our office hours in the sense where, because we know that any improvement, any contribution can be improved across three brands, we really try to shed the light on that. So, if you're trying to create a new list component and we see that, possibly, a list component on a different brand may have gone stale, that's an opportunity to drive alignment across all three. So, from a feature designer point of view, we hope that they get pretty hyped up on that.
Chris Strahl:
Yeah. I like you bring up the idea of staleness as well, right? One of the things that I think is really hard for people in the design systems landscape is to take that point of view of, "Maybe what's in my design system isn't the right thing," and to think about actually culling a part of it in favor of new ideas and fresh concepts. I think that, because design systems haven't really still around for all that long, people, maybe, haven't quite reached the cycle in their maturity where that's a common practice, but I definitely see that steering, that Jedi council, taking that long term multi-platform view and then evaluating that and what ultimately represents a feature view and thinking about that more broadly across the different platforms. So, that gives you this opportunity to say like, "Yeah, all right. So, somebody that's building a feature has done this new thing. Is that conceptually better than what was ultimately represented in the design system now for all the different platforms?"
Davy Fung:
Yeah. The other thing to note is also, three years ago, we were just designing this component of this pattern for one brand, so it wasn't in the mind of extending beyond possibly just the regionality and international flavors of this. And now we're in the space where there's extreme ROI with wanting to align typography. Specifically, our very good case study is because of the typography updates and our unified type ramp across all platforms, we were able to spin up our Asian Pacific versions of our app with limited deltas line-height variables is the one that what sort of drove that.
Chris Strahl:
We'll always get you.
Davy Fung:
Yeah. But we needed the type ramp and we needed this platform agnostic thinking to even be in this conversation, to be able to spin up regional specific apps. So, we're very proud and we hold ourself in this high level and we're very fortunate that we have a good amount of adoption and the feature designers are willing to come jam with us and chat about how to extend and get their contributions in.
Chris Strahl:
Yeah. And to say nothing of the fact that you guys didn't have to build an entirely new app for Latin America. That's a pretty incredible case where you're basically able to say, "Hey, we took a player and we went from blue to orange." It's a very simple way of saying, "We didn't have to build a new streaming service." Likewise, like saying, "I was able to create a localization in APAC that is able to support a tremendous amount of internationalization as well as a bunch of meta for that." That's a pretty huge accomplishment. Both of those things basically made it, so you didn't have to build an entirely separate app ecosystem. That's a huge amount of ROI because I'm not going to ask you to quote me how much it cost to build Disney Plus, but it's obviously in the multiple millions of dollars range to build a streaming service. And to not have to do that again is incredible.
Davy Fung:
Yeah. Just the swag on time. So, it took us, and this is just public announcement data, it took us two years, roughly, from when we announced that we were going to start building this Disney [high-spot 00:20:49] service to when we went to market. It took us less than a year to spin up this Latin-America version of Disney Plus. I think it was about nine months or so. And it was really just theming, extending of components, and building on top of the foundations that got us there. So, for our engineering team, it's a huge pat on the back and we take a lot of pride in that.
Chris Strahl:
Well, and it's a remarkable strategic accomplishment for the organization. If you're an executive and you're sitting there thinking about like, "What is my strategy in Latin America or what is my strategy in a new market or a new product?" You now have this arsenal that you come equipped with that basically says, "My time to market is less than half based on the fact that I already have one of these platforms up and running." And that's an incredibly compelling way to think about, "Strategically, where do I go with my product suite?" And that's a huge competitive advantage and a whole lot of power that you're able to wield by basically saying, "Our time to market and our ability to reach a market more quickly than our competitors is really strong and really advanced."
Davy Fung:
Yeah, that's right. And when I was trying to articulate and explain this theming strategy when we were in-flight, I very much explained it as the DoorDash and Caviar strategy. Caviar was an application that was acquired by DoorDash and, in the interest of not maintaining two separate apps that do very similar things, they brought it into the fold and executed this via theming. So, Katherine and her team at DoorDash told that very good story, and this is our story about how we turned a streaming app from blue to orange.
Chris Strahl:
That's amazing. Yeah. Well, thank you for sharing. I think that's an incredible window into the value of design systems and how even thinking about something as simple as type and color represents a huge ROI across an ecosystem. I want to dive in, just a little bit more specifically, into the role of design ops in this. That sort of small to big story of, "Hey, we were this federated team of feature designers that ultimately united under the design op's landscape and ecosystem." What really drove that from the design op's perspective, instead of, say, the broader digital team or engineering. I think that people are often surprised, and we encounter this a lot at Knapsack, where the people that we love to talk to most are design ops people because they get it. But people are often surprised that, that's a lot of the driving force between design systems, investment and adoption.
Davy Fung:
We currently sit under a design VP. I see a future where we could either sit in designer engineering and I think that's another podcast altogether. One thing that I think was very valuable getting into design ops is that it not only elevated the practice. So, the design system program, which encompasses, obviously, the component libraries themself, but there's a big part of this that's design system community, which it allowed us to be very open about how we work with the designers, how we could gather feedback from designers and then also engineering as well. It allowed us to feel comfortable spinning up things like the Jedi Council and being able to tap engineers on the shoulder without having something that is incredibly fleshed out and thought through. We would be able to spike things and be able to get immediate feedback in. Design ops brought that. The other more tactical thing from a people management and career growth standpoint was some of the designers on our teams were more traditionally like production designers, and we don't use that word anymore in the org because I think...
Chris Strahl:
I get why. It's one of the things that I start to passionately drive at is the idea of production design and whether or not that makes sense in a modern context.
Davy Fung:
Yeah. So, we took out three letters from that role. They're product designers, and they're more involved in the strategic thinking of how to extend design systems. So, they've been doing this all along, but I think when you're pinned as a production designer, you set yourself up for being at the end of the funnel. And that's something that we felt passionate about for moving and shifting on its head.
Chris Strahl:
No, I love that. I love the idea that you recognize that people's roles were going to change inside of the organization and you guys intentionally made that change and you made it in the right way. And it's not surprising that design ops has a role in that, right? I think that design ops organizations everywhere are slowly starting to, maybe not even slowly, but are really starting to look at that production design role and starting to view how they can change that because it's not about like, "Let's bake a bunch of pixel perfect comps," it's about like, "Let's figure out what the most effective efficient way of expressing intent is."
What I am encouraged by in that conversation is that you guys have managed to foster this cross-disciplinary relationship with your engineering team, largely led by the design ops organization. I view that as something that is still catching on in design ops practices, the recognition that designers are making engineering choices and engineers are making design choices and the need for the collaboration around those things.
Like you said, the ability to tap somebody on the shoulder and say like, "Hey, I'm doing this thing that is going to affect performance, is that okay or how do we manage this?" And having that really collaborative conversation, because design is not just how it looks, it's how it works. If you're an engineer and all of a sudden the performance impact of what you're doing is affecting page loads or perceived performance by users, that's a design choice. And the recognition of that is something that I'm starting to see, and that's really exciting.
Davy Fung:
I love the title, product owner, because it's a very flexible title. Who's to say engineering is not a product owner or designer ICs are not product owners? We're all, at the end of the day, on the same business team. We're developing applications in collaboration with each other. And we may not be in a squad, I know that, that's the mythical thing where we have this cross-functional team, but we could still make huge strides by working closely together in these working groups or Jedi councils.
Chris Strahl:
Yeah. It sounds like you guys are, if not in the promised land, just a couple of steps away. I think that you've really thought about the new version of how you build product and really embrace that as, not just a theoretical way of working, but actually a way that you've designed your organization around. And I think that's key in this and it's not to be undervalued is we're not just talking about this notional idea of like, "Here's a process map that shifts the way that we think about building product." We've actually redesigned the organization around these new workflows that allow us to take advantage of reuse and take advantage of this ability to spread innovation between platforms. And that, to me, that's the special sauce. It's great to talk about the future where we build product differently. It's totally different to have bold leadership that says, "No, we need to reorganize around this."
Davy Fung:
Just to bring this back to this podcast is, I think one of the biggest things that I've gathered from listening to past episodes is, there's no one size fit all. So, we like to tell our story because it's an extremely complex platform, lots of platforms, lots of constraints. But thinking about the other guests that have been on here, Microsoft has its own versions of constraints, Vista has its own. And each story is slightly different and what works for us may not work for Vista, may not work for Microsoft. So, I think that's always a very exciting thing for me to hear all the different ways that we could accomplish this work together.
Chris Strahl:
Well, thanks. That's exactly what this podcast is about, is getting those stories out there so people can learn from each other around how we're building these and really changing the way that we think about creating apps. One last thing, seeing how far you guys have come, seeing this evolution, it's inspiring, it's interesting, what do you view as the next step? Where does this go from here? And what's the next evolution in the way you guys are going to think about your design system?
Davy Fung:
Yeah, there's a very interesting notion about using the design system community and the space and the role, specifically, to expand as a designer. We have designers that have gone throughout our team that have come in as a junior designer and we were able to up-level of them to a senior role just based on the scope and the viewpoint of what we're working on is tremendous. So, it's this ability, as a designer, if you're able to work with us, we could take and extend a pattern that you have with you across three different brands, seven different platforms. And, I think from a designer growth perspective, that there's designers that may only have experience with working on, let's say, web or mobile. And because of our maturity level, in terms of the types of templates and components that we have, we're always going to be able to give you a good starting point. We're always going to be able to give you and teach you how to design for, say, living room devices, which it seems like a mythical thing, but it's really just a 1920 by 1080 frame. There you go.
Chris Strahl:
It's all a fixed view port size, though.
Davy Fung:
Exactly. It's fixed view port. The scrolling is different. But we have a lot of patterns and templates adopted already. So, if you were able to think about design career growth from the design systems lens, you're going to be able to build any number of things across any number of platforms. The world is your oyster in terms of where you can go and in terms of just design practice and craft.
Chris Strahl:
Well, and I love it because I think that, that's the next evolution in the way that we view product design, broadly. I think that we're going to start to teach that, we're going to start to really live that as organizations, as we start to move into this world where design and engineering are converging in terms of disciplines. And we're starting to get a lot more systems focused about how we approach this stuff. I've always viewed it as like, "Hey, we're shedding these vestiges of print and thinking about that adoption of print into the digital world. We had to start somewhere and that's where we started and it made sense, but I think we're getting to the point now where we're starting to realize that a lot of the practices and methodologies that we brought from print into the digital space don't fit and the new ones that we're looking at based around how we think about beyond just the product we're working on, how we think about an ecosystem, how we think about broadening our idea of what the digital medium is capable of, it's so cool.
Davy Fung:
And then just think about that the term product designer or UX designer, it's not that old. We're in a very new space that continues to evolve and the more we could think platform agnostic and tool agnostic, I think that, that's really going to set up our designers to really succeed in the future.
Chris Strahl:
Awesome. Well, Hey Davy, thank you so much for being on the program today. Check out the Design Systems Office Hours Podcast, and would really love to have you back in a couple of months to continue to jam more about where all this is headed.
Davy Fung:
All right. Thank you so much, Chris.
