Selling design systems

The more experienced I get with presenting my design solutions to a problem, the more I learn that my audience doesn’t see it the way I do. In my head, this modular UI system I made is perfect. It can scale to accommodate a nearly infinite amount of content, it can work even if one or any of the buttons need to be removed, it flexes to fit text strings of any language, and it can dynamically adapt to the constrained widths of mobile viewports without sacrificing its very intentional layout. To me, this is a well-designed UI solution.

But my audience doesn’t see it this way. They look at it and immediately react with what they’ve been known to give feedback about from their past experiences. They comment on the weight of the title and the visual imbalance between the body copy and the thumbnail image. They make remarks about the button styles being off in terms of consistency within the UI. While great points, they all seem to be completely missing the bigger picture. They’re not thinking about scalability or future-proofing the design so that it doesn’t fall apart down the road.

What I’m trying to sell them on is a “design system”, a solution that fits most of the things that it expects to get thrown at it and handles it gracefully. For this, my audience needs to imagine scenarios in their head about where the design could fall apart. And I have learned that it’s very difficult to ask your audience to look into the future of the product and have them visualize how it will change with evolving mobile devices and adapt to new user behaviors.

So how do you sell design systems? How do you convince your stakeholders that even though this may not be the most visually striking or aesthetically pleasing thing out there, it will work in a hundred different scenarios? One strategy is to simply explain it. Just say out loud that it will take in content where a description copy doesn’t exist and still “look right” because the ratios and spacing between the headline, thumbnail image, and description text were very intentionally chosen in a way that doesn’t break the visual balance of the whole if one of the components is missing.

Even better, show examples of those situations. If anything, it will get them to get a handle on minimizing the number of scenarios where things like the description text are missing. Mock-up the design in all these various scenarios to show the world how your design will change. This is also helpful for the engineers building it so that they understand how the system should flex to fit all the different variations that will be thrown at it.

Another tactic is to show alternative concepts that don’t scale well in order to sell the one that does. Just mock up some of the early concepts you had sketched out and immediately scrapped because you knew it wouldn’t work. Do it for the sake of showing to the audience that it indeed, does not work. You’ve already gone through the process and eliminated hundreds of potentially bad ideas before pursuing them because you knew they wouldn’t work. But your audience doesn’t. So just show them that it doesn’t, which ends up working in your favor because your original solution looks better in comparison.

The best strategy I’ve found so far, however, is to start with explaining the problem out loud. Before jumping to the designs, start with the constraints you were working within. Start with the potential pitfalls of the product and content strategy considerations that you had to deal with. This will get your stakeholders to acknowledge the existence of a problem before being distracted by the design solution that handles it. If you’re lucky, they might even commit to eliminating some of the problems for you, which in turn can make your life easier. Once everyone has been informed of the problem space we’re working in, only then do you start talking about your process of exploration where you take them through the possibilities in the solution space. You can walk them through the decent ideas that you started out with and then hone in towards the stronger final concepts that you actually want to spend the most time talking about.

This has worked with the most success so far because the audience is properly primed to expect everything with this kind of cognitive flow. They won’t expect to see beautiful imagery in the mockups because you’ve set the expectation that bitmap images will not handle well with the resolution of the device and will cause complications with network speed. They won’t expect to see beautiful animations because you’ve already explained to them the problem with the device OS not being able to properly render complex frame-based motion. They will expect to see strong typography because you’ve explained that content is what draws the viewer’s eye, not supplementary images or animations (as per user research). They will expect to see loading states and empty states because you’ve explained beforehand the issue with slow loading content and the occasional issue with content timing out and not loading.

This way, your audience sees what you want them to see. You don’t want to put on a theatrical performance to get feedback on the character casting only to have your survey respondents complain about the lighting on the stage or the props being low-quality. It’s all about using your audience’s limited attention span to your fullest advantage. Most people don’t even know what a design system is. They’re used to seeing the quick UI treatments to a problem and want to move full-steam ahead with it. It’s your job to convince them of the potential issues with accelerating too fast too quick without looking at all the warning signs that you’re speeding by. Convincing business leaders to adopt scalable design systems is what separates a good designer from a great one. It even makes the designer’s life easier (along with the rest of the team) because you don’t have to worry about making specific exceptions for niche use cases, as you’ve already designed the UI to scale properly for it.

Design systems are a thing that are just now catching on, and I hope to see more companies leverage them to their advantage. The importance of them has been growing rapidly to keep pace with the rate of content creation online. It doesn’t make sense any more to make a UI and change it every three months. The earlier you can foresee the use cases and solve for it beforehand, the easier your life will be down the road. The quicker designers and business leaders adopt design systems, the better all software will work.