Design Systems

Product Design is a continuous and an iterative process.

Managing design improvements on the go and handing off newly minted designs to the development teams gets very tricky especially when the team handles a complex product.

• Screen-wise or page-wise design and development handoff is too rudimentary. What worked for simple websites, doesn't work for large products. An application is far more dynamic and complex. A number of interconnections and states must be considered.
• It gets extremely difficult for designers to explain all the application states and responsive variants in a document using static mockups for the development teams.
• Design iterations are hard on development teams. They get blocked by design teams. If they proceed without final designs in place typically inconsistency creeps in.

In a nutshell, managing design at scale is a nightmare.

Moving from page-based approach into a component-based model (atomic design) optimised design-developer workflows. But reusable components alone wasn't enough.

With component libraries in place, multiple sources of truth existed in many places (design tool, code, documentation) and without a governance model it was hard to improve the reusable components. This gave birth to a new way of working: Design Systems.

In a nutshell, a design system is product (scalable and repeatable system) that serves products. It can't be treated as a one-off project.

A design system is a time and energy intensive proposition. It requires a dedicated team to maintain and upgrade. It takes training for the product team to adopt and adapt to the design system. So for simple and one-off projects, a design system is not needed. Just a pattern library is good enough. Creating a design system for every project is like killing a mosquito with a bazooka.

A design system must include both tangible and intangible aspects of building scalable complex products (code, philosophy, libraries, principles and guidelines).

Whenever we build a design system for ourselves or our clients, we ensure it contains design language, design tenets, documentation, style libraries, component libraries, a sandbox to play around, best practices and a governance model that helps in managing the system.

Design system is a perfect example of Gall's Law.

John Gall said every complex system that works was invariably created from a simple system, and that every complex system that was created from scratch as a complex system always breaks and fails and cannot be patched to work.

A good design system helps in operationalising and optimising design efforts in a large organisation. Without good governance, a great design system can become unwieldy collections of components and code that makes product teams lives a living hell.

🥂 to design systems!