The Industrialisation of Product Design

How do design systems impact our creativity?

Published on
The Industrialisation of Product Design

I read a discussion recently on Designer News that discussed the impact of Design Systems on the creativity of the modern designer. If you’re new to the world of digital product design, a design language is a set of rules and patterns that guide consistency and cohesion when designing a product interface. As such, a design language system (or just design system) is a set of tools or instructions to assist creatives in actually implementing the visual language.

Anyway, the discussion started off with a simple question:

Design Systems have done a lot to mature the practice of digital product design. The merits of building systems are clear, but the proliferation of design systems surfaces the fear that we won’t be designing thoughtful experiences. Rather, we’ll simply be connecting predesigned blocks of content and applying preset behaviours that may or may not be appropriate to the solve the problem at hand. Is this something that you’re thinking about?

The opinions of design systems range from a necessary evil to a foundation of great design, but the first and most obvious problem some designers have with them is idea the belief we’re losing our core as designers by distilling the concept of design into a series of prebuilt, rigid blocks.

But here’s the thing: systematic and reusable design is not even close to a new concept. The block model for designing websites has been around for quite a while. Ever since the release of Startup Framework 4 years ago, marketing designers have been looking for an easier way of constructing landing pages. Founders and companies started looking to buy component kits instead of hiring designers and over time, the complexity and aesthetics of these kits improve. Some of the better web UI kits can be found on Great Simple.

It’s been the same way for code — SMACSS was released around the same time and has paved the way for all manners of methodology surrounding modular and scalable CSS, most notably Atomic Design by Brad Frost. Meanwhile, the JavaScript community has started creating libraries for building reusable components, like React or Polymer with CSS Modules, as a way to proactively guard their front-end codebase against inconsistencies.

Atlassian’s new design system is incredible.
Atlassian’s new design system is incredible.

The fact of the matter is that we’re moving to modular, reusable design regardless of whether you think it’s a good idea. The benefits of design systems become more apparent with scale and at this point, not believing in the future of design systems is just a nice way of saying you love technical debt and scaling issues. It’s all just a part of trying to become more efficient.

Having said that, I actually do think that much of a design system should be “predesigned blocks with preset behaviours” — it’s important to remember that with design systems, you’re designing for a product suite at a component level. Your buttons and inputs should have the exact same functionality.

Design systems at their best should actually promote more creativity — they’re about helping you focus on the bigger picture rather than re-laying the foundations every time. Good design systems are catalysts for consistency, not an immutable list of commandments.

Furthermore, creating a design system for your product is no way a static or one-time process — breaking down your product suite into components allows for greater focus on the individual elements that support your platforms. Isolation of components allows for evolution through deviation, constraints through principles and allows you to put more effort into the “secondary” attributes such as security, accessibility, reliability and trust.

Just take a look at Google — they’re experimenting and A/B testing wildly experimental new concepts so they created Material Design to create the groundwork for their experiments and products. Every time they learn something about their components from their use in the wild, they come back and implement a fix or a new feature in the material design library.

Google's Material Design System
Google's Material Design System

That being said, a designer’s ability to be creative with a design system depends wholeheartedly on the culture of the workplace — design leads should create an environment where designers are encouraged to experiment beyond the boundaries of their design system to find better alternatives.

At Palantir, we had a great culture of encouraging experimentation. Blueprint was envisioned as the foundation for our product interfaces so we could spend more time on the interesting problems like figuring out the experiences of object traversal, node graphing and document viewing.

When you remove the need for designers to craft a basic user interface, they’re able to focus on solving problems and designing completely new components which could later become part of the design system.

Some of Palantir’s Blueprint library
Some of Palantir’s Blueprint library

So have a think about how the components of your designs system tie in to things like your user’s intents, goals, activities and behaviour. Look at your data — how are customers using your components and does it reflect that in your interaction design? How effectively do your components translate to code and to what extent are they scalable, modular and granular? Most importantly, what do these components feel like when you use them? Have you thought about accessibility, reliability and security?

If you’d like to learn more about design systems, Alex Pate maintains a list of design systems published by companies and how they stack up.