Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Wait a second …

Was “dummy” text not what you wanted to see when you clicked on this article? Well, trust me, it’s not what your copywriters, content teams, or clients want to see either. Why? Because no matter how beautiful, organized, efficient, or consistent your design system is, if it wasn’t developed with actual content in mind, there will always be some growing (or shrinking) pains.

Have you ever developed a design system that you yourself were tasked with populating? With net new content? Content you wrote?

The answer is probably not, because design and content mystifyingly seem to be relegated to their own lanes with little crossover and maximum frustration for both groups. I, however, in a hybrid role have experienced this phenomenon and learned that it’s the lack of understanding of the other team’s process and pain points that can cause even the most empathetic, human-centered designers and content teams to resent each other.

But there’s another way to approach the creation of a design system that helps me as a designer understand the role of content (and the content team) in the process from start to finish.

Align before you design

Designers and writers might not be able to work together at the start of a project. They may be working client-side and agency-side or on entirely different teams with little opportunity for collaboration. So while the content itself might not be ready in time for a content-first design approach, it can certainly help define the types of modules you’ll need in your design system.

Write down ideas on stickie notes to help define the types of modules you’ll need in your design system.

For a digital transformation project, research into clients, their goals, and their existing content needs can essentially create your module punch list. Do they have video content? Do they provide thought leadership articles? Do they have a calendar of events to showcase? Will there be bite-sized content teasers that lead to more full-scale content, or is what you see what you get? It’s helpful to set up interviews with subject matter experts or, ideally, a subset of existing users to help you gain insight into how content plays a role in balancing business goals with user needs.

For brand new launches where content has yet to be written, it’s helpful to understand what a client or brand plans to create for the Day 1 launch and for the future. A big lesson in designing with content is to not let the needs of the fewdictate the needs of the many. Design a system that is flexible enough to accommodate the most and the least fleshed-out version of the future content.

Fun fact: Lorem ipsum has been used as placeholder text since the 1500s, which means it’s been creating unrealistic expectations about appropriate content length for designers for more than 700 years!

Don’t cage your content

After content research gives you a sense for the content needs, design flexibly for content types and length. While a designer might want to showcase two different typestyles in a module’s headline and subhead, a writer might not appreciate having to create double the copy if it isn’t essential to the story. While that same designer might think something with two short sentences looks best, content strategists, writers, and clients might need a paragraph or more to get their point across. Retrofitting content to inflexible modules that were designed with placeholder copy and based purely on aesthetic decision making is one of the most frustrating situations for both writers and designers. But as I’ve learned, this can be avoided:

  1. Think “bite, snack, meal”: This approach to content helps accommodate the visually clean modules designers strive for and allows writers the chance to still tell the full story. Hand-raisers who are particularly interested in that content can click and uncover more and more progressively, and users for whom the full content isn’t relevant won’t be inundated with copy.
  2. The “rule of three” is great until you need four: Rules are made to be broken. Designing modules that are flexible enough to give equal priority to 2, 3, 4, or more similar pieces of content don’t require your writers to pare down their lists.
  3. Think outside the content box: Content contains multitudes. It shouldn’t be restricted by arbitrary character limits that were determined without actual content in mind. Try designing modules where varying lengths of text aren’t contained in shapes, or explore modules where image sizes respond to the length of text.
  4. Best practices still apply: The goal is design flexibility that doesn’t become restrictive on content and content that doesn’t break down the modules designed. But never create so much flexibility in your module design that you’re abandoning the best practices that have worked well in the past. Editing consumer-facing copy length is still critical; I’m just suggesting that character limits be soft limits created by content teams and not hard limits created by designers.

Fun fact: Lorem ipsum is derived from a Latin text by Cicero that is more than 2,000 years old. It touches on the themes of pleasure and pain (like the pleasure designers feel when they edit their dummy text to have line breaks in all the right places, and the pain a copywriter feels when that’s not how real words and sentences work).

Design invites them, but content keeps them

There’s a rumor going around that good design is invisible, and I don’t believe that for a minute. I do, however, believe that design isn’t the reason your users are there, and it’s important for us designers to remember that. The beauty of design systems is that they’re a library of flexible modules that help content come to life in the service of telling your client’s story. They function so you don’t have to design a full page first and then shoehorn the content into it. We all know by now that isn’t the best way to approach the telling of that story, no matter how great it looks.

Teams use sharpies and tape and stack the paper modules on top of one another, telling the story first and arranging second.

In fact, my team often creates blank versions of our design system modules to bring with us to client meetings and workshops. We first talk about outlining the most important information on the page, and then we select a few modules that might be the right place to bring that content to life. We pull out the Sharpies and tape and stack the paper modules on top of one another, telling the story first and arranging second. We let the content determine the design and not the other way around, and that approach has eliminated a ton of friction between teams and even made engaging with our clients more of a collaboration. After all, the development of design systems is typically an agile process—why shouldn’t the writing and the client collaboration work in a similar fashion?

I’ll leave you with this final advice. If after reading this article, you and your teams are still dead set on using lorem ipsum, I ask you this one favor. Please, please, please remember to swap it out before launch. The only thing dumber than “dummy text” is forgetting to remove it!