Beyond isolation: Harmonizing products in a design ecosystem

JJ Rogers at Watermark

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 at 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.

Chris Strahl: Hey everyone. Welcome to the Design Systems podcast. I'm your host, Chris Strahl. Today I'm here with JJ Rogers from Watermark. JJ, welcome to the program. Why don't you tell us a little bit about yourself?

JJ Rogers: First off, thank you for having me, Chris. I am director of product design at Watermark and have the pleasure of serving a team of 10 product designers across what we're building as a suite of products. Watermark has a number of SaaS offerings for the higher ed market in assessment and accreditation course evaluations, institutional effectiveness, student retention, to name some, we have over 1700 schools now, so we serve community colleges. We have a lot of four year public and private colleges and universities using watermark and one design system to support them all.

Chris Strahl: Gotcha. So one of the interesting parts about this conversation is it's going to be really focused on this idea of what happens when products collide that may or may not be on the same design system or even have a design system. Thinking about your product ecosystem, watermark has grown a lot by acquisition, and so you have this idea of, Hey, I have this suite of products and I have at the beginning some sort of integration of them of experience or workflow, but then I have another product that I need to bring on. What does that look like and how do you think about that problem space?

JJ Rogers: Well, I would say the first thing that we evaluate is, for me it's how is the product currently made? Who are the players? How did it come to be? And then thinking about it from a user experience perspective, where do we see room for improvement and where's the opportunity? Usually because they're coming under watermark, that opportunity is via some sort of integration with some of our other products so that we can provide more value.

Chris Strahl: So when you think about this, you think about it as first, what can I integrate from the products at a pretty deep level? What features or what workflows can be touched and used? Is that all you think about, or do you also think about this from the experience standpoint of what makes this feel like a watermelon product?

JJ Rogers: Yes. I would say it's not the first thing, but it definitely is a part of the process. And like I said, since I am interested in how that product came to be, do they have a designer on their team? How is this product set up? How is it laid out? Because when we think about integration, we're thinking about similar menu structures and larger layouts that will ultimately or could be someday connected. So we want some sort of consistency there. So yes, the design system piece is a big part of it for sure.

Chris Strahl: So when you're thinking about that application of the design system, are the products that your team acquiring, are they largely absent a design system? Do they have their own design system that you're then integrating? What does it look like in terms of the state when you first get your hands around these experiences?

JJ Rogers: The last product we acquired, it definitely did not have a design system. I don't have all the histories and the years in which they were founded. I believe the last one was, I want to say 2012 is when it was founded, but did not have a design system. Definitely was more modern, had a more modern stack than some of the other products that we acquired. I believe the earliest would've been 1999. So we did have some older interfaces, older experiences that required more design expertise to, in some ways actually rebuild.

Chris Strahl: A lot has changed on the web since 1999. I'd say that's probably the most true statement I've made on this podcast. But when you're thinking about that, is that a rebuild? Is that like, Hey, we need to take the ideas and the concepts and maybe the backend of this system and rethink it in the context of the design system? Or is it more like we need to create some sort of reconciliation of what should be adopted or should use the design system versus what should remain as essentially legacy?

JJ Rogers: Those conversations? It's really is about trade-offs. It's really thinking about what can we accomplish within the next one year? What can we accomplish in three years and even further out? So when we're thinking about design system adoption, well what does that mean? First and foremost, if we acquired a product and there's no designer creating those experiences, but we're going to continue to invest in that product, the first thing we want to do is get a designer working on that product or in that product space to make some of these decisions that you're talking about. And through having a designer working on that product, we can make evaluations on areas that we think are really good candidates to adopt some of our components. Some of our layouts, I guess I should start off, we do a sort of light pass where we do adopt basic typography color. Some of them are simpler foundational elements of our design system, but to fully embrace what we set up within the design system, which all the way down to content guidelines. I mean, that takes someone really dedicated to ensuring that that can happen.

Chris Strahl: That's almost like a service you offer then where you have a company that you've acquired and then you basically come in and you say, Hey, you haven't had a design person design minded individual. Look at this. You haven't had a focus on design. We're now in this situation where you're going to adopt a bunch of changes to your interface anyway, let's think about how you can be a part of the design system.

JJ Rogers: Yes, that is definitely accurate and it can be challenging. It has been challenging in the past too because it's an investment financially, and we want to make sure that there is going to be return on this investment. So my job is to really help tell the story of what that return on investment could be is that we are seeing, oh, there's an onboarding experience is really poor, or implementation times are very high for this product. That's something we need to work on. I think the story that everyone likes to hear is, oh, we can advance this product by, like I said, integrating with other products and creating shared value. Now this piece of data that might be useful to faculty, which are in this product, they can see it over here. So showing that, oh, yeah, we can present that over here and because now these products are going to be linked. We want the experience to be linked. We want there to be a similar experience for the faculty member that may be lugging in across multiple products.

Chris Strahl: Interesting. So a lot of the decisions that you make about how far you go with the design system are really representative of user workflows. So hey, there's this common group of users that will use similar features in disparate products. And so that kind of story needs to come before the decision to actually harmonize it with the design system.

JJ Rogers: In my experience, that story is very important for continuing to have design support on these specific products. We have seven products right now, and like I said earlier, only three products have fully adopted the design system. So we're still in that process. We've recently had a designer take the lead on a new product. They're currently not using the design system, but as she's designing that product, she's thinking about how can I take some of these components and actually use them on this new product, or how can I bring in this new layout, which maybe isn't something that this product has traditionally used, but it's something that the users could benefit from and start to kind of layer in. Some of those designers who have worked in the design systems are kind of thinking in the design system fundamentals and what we've established as, Hey, these are the guidelines and these are the standards that we set up. So when they move on to a new product, they kind of automatically sort of take them with them whether or not they're actually using the components and patterns that we've established or not. So it's kind of a weird kind of middle ground there.

And then one of the big barriers too is getting the actual frontend components. And once the team is ready to make that investment and say, Hey, we're going to use these frontend components, so not just the design patterns that are great and the standards that you guys have set up, but we actually want to use that, then we really get cooking and we can really start replacing large sections of the product.

Chris Strahl: Where have you gone the furthest with an acquired product? Do you have a product that has been a part of the ecosystem that you brought in that you would say is fully using the design system? And what kind of process do you go through to get there? I think that I have a clear understanding of the beginnings, but what does the middle and the end look like?

JJ Rogers: Yeah, we do. I mean, this is kind of an aside, but our design system really did start from a new product. We were building an innovation that wasn't through acquisition, and we were able to start from scratch. But the first product that we really retroactively applied this system to was via. It was formerly called Via. Currently it's student learning and licensure. And we started off with an audit. We went through visual language and accessibility, evaluating all of that, coming up with a plan for how we would replace different components. We had done the kind of foundational makeover, but then we went in and did components, large navigational structures that came from our design system and just kind of growing from there. You are thinking about atomic design in a way too. The product naturally was divided up in a few different ways. One of the ways it was divided up is we had a very separate administrative experience. We had a very separate reporting experience. We had another experience that was more faculty and student oriented. So to start to finish, when we would call ourselves completed, it was, oh, we're completed with the student experience here maybe in this module that we have.

Chris Strahl: So the product itself had segments, and those segments each have their own sort of implementation progress because when you have a new product or you have something like that, it's its own distinct thing. It has its own login experience, it has its own experience for this part of the user or this function or feature. It's not all one thing. It's actually got its own segments even within that product itself.

JJ Rogers: Right, exactly. And so we were able to divide it up by those segments and the end users that those were designed for. So a student experience is very different from a faculty experience or from an administrator. And so we were able to segment it by persona as well, and that is how we did it. But that product is completely start to finish, has adopted the design system.

Chris Strahl: So do you then market that as something that you do either within the organization or within the strategic side of the company, like that corp dev practice?

JJ Rogers: Our most recent acquisition, the end of 2021, the design system was established at that point. And so I think that acquisition was the first acquisition where we did talk about our design team, what we offer, and the design system as a part of that sort of as a service. I mean, I don't know. I wasn't in those meetings in terms of how detailed we got in terms of actually selling it as a service. This is something that we're definitely going to do. It's something that we know we want to do. We have to think about the strategy of, well, what do we gain by doing this and how efficient fast we do it. Again, like I said, the integration aspect is a big piece of that too, is how soon does this really need to integrate with some of the other experiences that we have?

Chris Strahl: But the idea that this creates value both for you as an organization and for the company that you're acquiring is interesting because I think that oftentimes we don't think about the harmonization of product as the thing that is easily solvable or the thing that we have a clear solution for in an m and a scenario where everybody always talks about, Hey, we're going to buy this product and then we're going to figure out how to make it work with the rest of our product suite at some future undetermined point. And it seems like, well, it's not exactly the same plan every time. There's a playbook that you all have that represents a path to integration value that I think isn't very common in enterprise software.

JJ Rogers: And with earlier stage companies, they're very aware of their gaps in terms of accessibility, in terms of where they're maybe not seeing usage that they want to or where they're needing to support the product more. So I think it does kind of naturally lend itself to, Hey, this is something that we can also through adoption of our design system, everything that we roll out, we have the accessibility in there. We've tested some of these larger guidelines and standards that we have.

Chris Strahl: That's awesome. And accessibility seems like one of those anchor points where you can basically say, Hey, look, we need to make sure that your product meets accessibility guidelines that we ourselves have set out as important or essential to the business.

JJ Rogers: Definitely within higher ed, for sure, clients can request AV voluntary product accessibility template. Essentially, we're sharing, Hey, here's all of the accessibility issues that we've discovered. We know where the issues are, the number of issues and our plan for remediation as well.

Chris Strahl: What other anchors do you have beyond accessibility?

JJ Rogers: Well, I mean, a part of adopting the design system is ensuring that we can continue in a human-centered approach and that we are going to have designers support the experience from here on out, because historically, these companies didn't have dedicated design talent associated with the products. I think that's kind of a big one, is along with the design system is a dedicated designer as well.

Chris Strahl: So are you often the first time that there's been professional design applied to a lot of the companies that you're bringing on?

JJ Rogers: Yes.

Chris Strahl: What must that be like? What does that feel like? And I mean, does the expectation that there's some adherence to the design system, does that make that easier or harder,

JJ Rogers: The expectation that, wow, here's a product? Yeah, I mean, if we just acquired a product and we didn't have to think about harmonizing that with the design system, I think it would be easier to just solve those problems on that product and make it a better experience. But yeah, now we're thinking about, okay, beyond just this one product, I mean, it is great to be a system, a product system. So not even just design system, but a product ecosystem. We do want our end users to feel like they are on a watermark product. And so thinking about it at that level is great anyway. And so now just saying, okay, well now you actually have a system with guidelines that you can apply to. I think it's harder to get the adoption, but it's easier for designers to think in terms of the design system once they have been working on it.

And I'll say too, and this may transition the topic a little bit, but as the design system has matured and our design organization has matured along with it in the last couple years, we've made a concerted effort to be able to hire junior designers. We're not a big team of designers, like I said, 10 designers, but we weren't always in a position to I think, have the support for junior designers and have the right structure and all that. It's something we really wanted to do. And now that we are in a place to do that, you have to think about training designers who really have maybe just gone through some programs. So prior to watermark, I taught at General Assembly for a year, which is a 10 week bootcamp, drinking from a fire hose, we're going to transition your career, whatever you were to now learn about ux. What is ux? What is this? I designing software now and the whole process, research, interaction design, visual design testing. And so a design system can really be a wonderful training tool for someone to learn to think in systems and also learn about just good patterns, good interactions that are tested and are working and consistent.

Chris Strahl: So what I'm hearing is, okay, so you have these new products that you bring on. You bring them on segments. You look at them from what needs to be integrated first and trying to be very user-centric about that. But then also when you think about the actual application of the design system, yes, that's harder than just solving the immediate problems that you see within that product. But ultimately it's better because of a commitment to accessibility, because of a commitment to probably performance as a part of this as well. All these other various different things that represent systematic value between products, not just within that product. And then you also get this benefit of being able to, for the first time ever, really look at a program that helps you build the kind of design resource that you want by hiring the right people by easily being able to showcase to them, this is the way that we think about product and product design,

JJ Rogers: Right? And then being able to grow the designers and grow the products that are design team supports. Now you have designers who are very familiar working within a system. We recently completed our content guidelines. We have our foundational elements. We have like 23 components. We completed a bunch of documentation around different layouts in the last year, I want to say. And so now that designers have learned these and not just have read the documentation, have actually applied this on products, it's easier for them to now go to a new area and say, okay, we want to follow the same principles. We want to bring over some of those guidelines and standards here. Let's evaluate it and see what we can do.

Chris Strahl: Interesting. So the application of this as a service or as something that you can then provide to other organizations and other products, how does that work in a leadership level conversation? Because I can see myself sitting down with a VP of design or a VP of platforms and describing to them, we're going to do this thing that is harder, but has this network effect benefit across all of our products and all of our people that we hire? Is that the conversation that you're having or is there some subset of that that's about brand consistency or accessibility consistency that really sells that through or cements that in the mind of somebody that's making that strategic decision that this is an important investment in our company's strategy?

JJ Rogers: It's hard. It's hard because you have the history of a product being successful without it and being acquired.

Chris Strahl: This isn't always been this way. It's only been this way recently.

JJ Rogers: And so they were acquired. They were successful enough to be acquired. They have clients using it, and so why now do we have to do this thing? That is a hard piece of it. I mean, I think there's this standard, this is what a design system can offer. We have now coming from a place of principles and personas and shared language and rules and organization, and the consistency piece is great. One element that I think helps our case a lot too is looking at competitors and some of the competitors design systems within the higher ed space. There's not a lot, but you can look at some of the LMSs that are well known and yeah, just see, this is a very mature design organization, so if they're your competitors and this is what they're doing, so let's take a look over here and see if it's something we want to do.

Chris Strahl: Yeah, let's make sure that we're keeping up with that design value that exists in the industry.

JJ Rogers: Yeah, that's one way I can think of. I mean, the biggest thing is, and I really have no numbers to prove this, but is efficiency is well, it is going to be more efficient for us to design on your product using this system. Yes, it is going to be a hurdle initially, but it's one of many hurdles. We're not the only hurdle they have to overcome when they're being acquired or they're really trying to, like I said, integrate with some other products, get set up. Maybe on the same, we have an initiative to get our products on the same administrative platform, so system administration. And that really requires configuring the products in a way that they can now all align to the system so that we can have shared objects. That's also a really big undertaking as well

Chris Strahl: When you talk about hurdles and not being the only hurdle. I definitely feel this personally that one spoke to me that oftentimes I'm convincing people as a part of the sales process, like why we're just one of many hurdles. And I think that one of the hardest parts is yes, but you're in new hurdle is what I get back a lot, a hurdle that we'd never thought we had to cross before. And when I think about it that way, that's right. Design systems are a new concept, they are a new thing, but you can see that the price you pay for that hurdle has such a huge return in what you just said, the ability to integrate on shared platforms, the ability to have consistency and efficiency, not just within that app, but between applications as well. And I think that there's a lot of proof points that are absent in people's minds about how this abstract thing in this abstract concept can really prove out so much return. What do you say to people that ask about that inside of your organization when they say, will this be worth it? What do you point at and say, no, absolutely. This is, and this is why we do it this way.

JJ Rogers: It's part of our marketing is that we have a unified suite. It's a unified suite of products. It's not just point solutions and well, what does that mean? I mean, yes, it does mean some of the integrations that I talked about, but it also does mean that the experience feels consistent for end users and that they don't feel like, oh, they're going to adopt very, very separate point products. They may have been that way historically, but the advantage of getting a product at Watermark is that you are going to have more consistency among the experiences, and clients can point it out. I mean, customers can point it out. It's like, oh, this feels very different. And one of the things we can do too, and again, this isn't necessarily just the design system, it's also, Hey, we're going to bring a designer on to solve some of these issues, is look at some of the usability that absolutely needs to be improved. And the formula for fixing that is, well, we have solved that maybe over here using the design system as well.

Chris Strahl: How do I bring that piece of innovation? Or how do I bring that solution from this place? I solved it before into the new place,

JJ Rogers: Right? Yes.

Chris Strahl: And design systems are awesome at doing that.

JJ Rogers: Yeah,

Chris Strahl: I think that's really cool. So I used to work on SAP software a long time ago, so if anybody from SAP is listening to this podcast, it's probably not a commentary on how software is done now, but it used to be that every time SAP acquired something, everybody that was in the consulting space for it would go, oh, shit. There's going to be a bunch of things that customers are asking for that don't feel at all a part of the core product, at least for the next year or two. And so when you think about that from the customer standpoint with Watermark, I'm sure the customers are able to identify when there's new experiences that aren't totally harmonized yet, but how long do you think that it really feels like it goes from being something that is its own distinct nonunified experience to being more part of the unified platform? Is that on a scale of years still? Or is that something that happens more rapidly with the design system?

JJ Rogers: Yeah, I think we're getting better at being more rapid. We're also getting better at not thinking about it. It has to be a switch that it's suddenly turned on. I think the earlier product that I talked about that has completely retroactively adopted that there were some experiences for particular users that we did kind of turn on a switch. And going forward, I think after a product has kind of adopted some of the foundational elements, it looks like watermark. It looks like our design system.

Chris Strahl: It's a branded experience that has some unification,

JJ Rogers: Right? And that kind of gives it enough that we can really start going in and updating experiences, various sections, things like that. But yeah, in terms of timing, that is a great question. I think we're still on more than a year right now, but it's also because like I said, we're not just trying to completely change everything. We're being very strategic about, well, what part of the experience do we want to improve? Maybe there's even something new. It's an innovation that we're adding to this, and so of course that will include anything that we've learned in our design system and include those patterns and standards. But it's not just looking at what we have today. It's also as we're in development.

Chris Strahl: So jj, I want to thank you for sharing so openly about the way that you've thought about design systems. Is this sort of strategic crowbar to sort of open up the door to working with these other platforms. So I just want to say that it's interesting to hear about how you think about this as a service model for bringing new products built elsewhere into your ecosystem, and that's really cool.

JJ Rogers: Thank you. Yeah, we're very proud of our design system. We actually today just launched a blog on our design system so that we can start sharing one of our values is transparency and so that we can publicly share some of the stories and lessons learned from working with it.

Chris Strahl: That's awesome. Well, thank you again for being on the program. This has been the Design Systems podcast. I'm your host, Chris Strahl. Have a great day, everyone. That's all for today. This has been another episode of the Design Systems podcast. Thanks for listening. If you have any questions or a topic you'd like to know more about, find us on Twitter @theDSpod. We'd love to hear from you with show ideas, recommendations, questions, or comments. As always, this pod is brought to you by Knapsack. You can check us out at Knapsack.cloud. Have a great day.

Get started

See how Knapsack helps you reach your design system goals.

Get started

See how Knapsack makes design system management easy.