How we design

Designing CMS friendly design systems

Designing for CMSs in a systematic way improves the quality, consistency and speed of our work — provided we collaborate as a team and always keep the CMS user in mind!.

How do we approach designing CMS friendly Design Systems at Inlight? Read on to find out...

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

Enjoyed reading this article?

Maybe others will find it useful too. We'd love it if you let them know via your social networks

About the authors
Harley Donaldson
Design Director
Harley Donaldson | Design Director

Harley is an award-winning design director with over 15 years experience. Equal parts visual, UX and product designer, Harley sees no distinction between how something looks, works and the value it brings to people. Harley has a knack for designing beautifully simple interfaces and solving complex user journey problems.

Ailsa Currie
Studio Experience Manager
Ailsa Currie | Studio Experience Manager