Firstly, why are design systems important?

They make our work more consistent and predictable, whilst allowing our team to work faster.

We achieve more consistent and predictable solutions by not reinventing the wheel everytime. Creating systems empowers and aligns both design and development.

Having a strong system in place means solutions almost design themselves. These efficiencies allow us the provide more value to clients and spend more time working on the fun stuff.

How does Inlight think about design systems?

A design system starts with the Atom: the most divisible element. Think type, spacing, colour, containers, elevation and icons. Atoms provide the base level building blocks upon which our solutions are created.

These small number of atoms are merged together to create highly reusable Components. Connecting Components together creates Blocks which can be added to a page by a content author. If we want blocks to be bespoke and locked down, we create Templates (collection of blocks assembled into pages).

It's not just about designers.

When creating a design system, the design and development teams must work together throughout the process.

Recent tools like Figma, or Sketch + Abstract, allow excellent visibility into and through the design process, and we've welcomed design into the development workflow using things like Zeit to allow commit based deployments.

We've even found times when using our CMS platforms as a design tool have increased transparency, inclusion and understanding between design, development and content authors.

Then when we have early stage wireframes, we make sure we come together as a team to identify components, ask questions and land on the most sensible solution as a team.

Letting go (a little)...

If we make content author’s lives easier, the sites they manage are more likely to be kept consistent and up to date... but how can we do this?

Inlight makes conscious decisions about the level of control we offer. Too many options can be as dangerous as too few options. We keep our CMS simple and intuitive by letting authors manage content, not style. We lock down areas that, if changed, would devalue the expertise of the design team (primary navigation being an example).