Phone: 07730 653 548
Blog

Atomic design; meet content design

Applying atomic design principles to content design

A lot of my clients are talking about ‘scaleable’ systems. This is often a development term, used to describe a way a system can grow depending on traffic or workload that is required of it. It’s also used to describe:

  • resourcing (as in agile teams)
  • networks
  • processing or server demands
  • individuals workloads
  • design systems
A screenshot of a web page, with the title; 'Readability', which is also included in the picture header. The logo for Nationwide Building Society  logo sits in the top right corner.

Being able to scale work, systems and processes up and down without compromising on quality is a pretty handy. But it’s more than just a development term; a scalable approach is an age-old tool for user centred designers. 

Atomic design in design systems

Atomic design is one method used to create scalable design. Of all the UCD disciplines, atomic design is principally used in UI design. It’s a simple concept, mirroring chemical equations from the structures of life itself. You start with the smallest thing (atoms), then two or more of those atoms join together in a certain way to create molecules, which are entirely different from the individual atoms that created them.

These molecules then scale up again into something bigger and more complex, but fundamentally, everything has been designed from the same simple atomic building blocks.

I love this concept because it lends itself so beautifully to what we do and supports stronger, more consistent designs. And if experience has taught me anything, its that consistency breeds familiarity; and familiarity nurtures trust from your users. 

Embedding content design in atomic design

As I was working with a large organisation, the ‘voice’ of the company had already been set. Again, this provided the fundamental guidelines on how we should write. However, as more and more unique patterns were created, we started to see discrepancies in the way content was written. That’s when I began developing the content design guidance of the design system, from the molecular level up.

Working with the interaction designer, we designed, tested and developed every single pattern. It seemed sensible to being user research with the patterns and not at the atom level, because:

Defining the language for each pattern

Patterns were things like date of birth entry fields, name fields or adding addresses. Each defined pattern had a single purpose. They comprise atoms like defined headers, hint text, input fields and labels.

These patterns had defined content, which was completely fit for the single purpose of the pattern. If the purpose of the pattern evolved or morphed in certain instances, we then looked at the wider user cases and the potential to create a band new pattern. This meant that, throughout the entire site, the address input pattern would always remain the same, no matter which team in the organisation was designing it. 

A content-first approach

This isn’t new stuff. Scaleable designs and design systems have been around for a while. But after a decade of working with words and tech, I can tell you that content often comes last. It’s the little brother to UI and is often overlooked (or not invited at all) to the ‘big table’.

By embedding content design principles into the very foundations of design systems, it protects the often under-appreciated discipline of content design and ultimately, creates a much more user focused starting point for companies.