The hardest part of collaboration when building digital products can be the coordination of numerous details. Do your content and UX teams have the right systems in place?
Published on Aug 5, 2021
UX designers and content planners benefit from having a common foundation upon which they can deliver a great experience for customers. Without such a foundation, work will be fragmented and uncoordinated, and projects will progress more slowly and be less cohesive. How can teams meet the challenges of coordination? With systems.
Content used to be simpler—but more rigid. Organizations had one website around which all content was planned. Now they have many websites and new channels. They must coordinate many teams and tools to offer the right content in different scenarios. Compared to the past, teams have more decisions to make now. Fortunately, the emergence of content and UX systems is leading to new and better practices that can deal with more complex needs.
Systems supporting the planning and management of content and UX resources have become more important as enterprises adopt a headless approach to content management. Headless CMSs provide unprecedented flexibility in how content is created, delivered, and accessed. To get the full benefits of this flexibility, enterprises need systems in place that make available the right content and design elements as they are needed.
Systems are the building blocks of your content and design, providing a foundation upon which many user-facing assets can be generated. They allow UIs and content to operate at scale.
Kristina Halvorson, the well-known content strategy consultant, refers to “systems design” as a foundation of content strategy. She says: ”Systems design is the process of defining the architecture, modules, interfaces, and data for a system to satisfy specified requirements. We’re interested in creating repeatable systems—both for machines and for people—to ensure content integrity over time and allow us to create, deliver, and manage content according to consistent standards and meaningful outcomes.”
In a similar vein, the user experience community has been focused on the value of design systems in promoting sustainable design operations.
Systems supporting content and design offer many benefits:
Systems provide efficiency and reliability. They promote maturity in content and design operations.
In an earlier post, we looked at how both UX designers and content planners use many of the same requirements methods to plan for user interaction needs. Because they rely on the same kinds of requirements, it often makes sense for their development to be jointly owned.
When it comes to the systems that support the development of digital products, responsibilities don’t seem to overlap as much. The specific support systems tend to be created and utilized by either the UX or content team. Yet they shouldn’t be seen as having value to only one team. Both content and UX teams depend on a wide spectrum of systems.
Distinct systems can have similar goals. For example, both designers and writers develop and use style guides. These design and content style guides are different in their focus, but similar in their intentions. Both provide rules that encode decisions on how to present text and visual elements to users. By having these rules, the design is delivered efficiently, and results are consistent.
Systems are shared resources. They influence downstream activities for both content and UX work. Content and UX teams should understand how each other’s work will influence their responsibilities.
UX teams focus extensively on the presentation of content rather than the content itself. It’s the role of content teams to plan what content will be available to present to customers.
But given the collective scale of their work, content and UX teams can’t manually produce each screen one by one. Both need support from systems that will coordinate numerous details.
As UX teams rely more on design systems, some are recognizing the value of connecting these design systems to the structure of the content that will be displayed. To capitalize on this relationship requires some knowledge about how content is managed within the CMS. With headless CMSs, the organization of content is transparent and adaptable, which opens up many opportunities to shape the user experience.
UX teams should become familiar with two major content systems that will influence their work:
These two systems work together to structure and manage content so it can be available to users in different contexts. They determine what content will be available for users to access.
A content model determines how the content will be structured within the CMS. In a headless CMS, teams define how they want content structured into content types and elements that are available to different user interfaces through an API. One content model can govern the content that’s supplied to many different UIs.
The content model is typically created by content strategists working with the developers who will be implementing the CMS. UX designs aren’t generally involved since it’s not a user-facing system. But the content model influences the work of UX teams in ways that may not be immediately obvious.
The content model defines the content’s structure, which determines what content elements are available and influences how that content can be presented. The more structure there is, the greater the flexibility in how the UI can offer content to users. The content structure will determine many UI issues such as:
In short, UX teams can’t get far designing screens until the content model is established. They need to know where content elements come from and what their characteristics will be.
A taxonomy is a hierarchical set of terms used to classify content. Authors and developers use taxonomies to manage and deliver the content, while users rely on taxonomies to access the specific content they seek.
Because the taxonomy works closely with the content model, content strategists and managers should take the lead on its development. Since the taxonomy can support external users, the input of an information architect can also be helpful.
For UX designers and front-end developers, the taxonomy influences their responsibilities in many areas:
When organizations use a headless CMS, their content is decoupled from its presentation. That means that the content can be presented in many ways, not just one way. Organizations can offer many different versions of their content.
The content team should be aware of the support systems that shape how users encounter and use the content they are planning. Two important systems that influence the presentation of content are CSS and design systems.
How the content gets presented to users is determined by code. The properties defined in Cascading Style Sheets (CSS) control the content’s layout and can influence its behavior. The “styles” for headings, boxes, and other screen elements work as a system to specify how the content is rendered. CSS allows content to be separated from its presentation. With the introduction of features such as the “flexbox” module, CSS has evolved to provide increased flexibility in how content can be displayed.
Content planners and writers don’t need to become experts on the details of CSS. But they should be aware of how a CSS implementation can sometimes affect the usability of the content, especially when the content will appear on widely divergent platforms.
Content planners should know whether the expected space for specific content elements will be adequate for the messages that will need to be presented. Will the available content fully display within the available space on the screen, or will it overflow? Many display elements (image dimensions, text containers) can be resized, but in some cases, text and image content may need differently sized variants. Content types may need fallback elements, such as a short heading or a thumbnail, when space is limited.
In recent years, many large enterprises and high-growth firms have developed design systems to scale up their design work. They’ve needed to move beyond single-channel templates they’ve used in the past for web page layout.
Design systems document the rules and rationale for how content will display and behave across different channels. They provide additional governance and context to the CSS and other code that renders the content. In addition to providing documentation, design systems support the reuse of components and layouts. They can be implemented within design tools such as Figma or Sketch and front-end frameworks such as React or Vue. A robust design system reduces manual coding and makes implementation decisions more transparent to the whole team.
Design systems standardize components such as banners, heroes, and cards that present content. They can also present patterns that address contextual situations, such as what to display in cases of “empty states” or errors.
Content planners should consider how various content types within the content model will connect design components within the design system. Specifically, they will want to know:
While UX teams have driven the development of design systems, some enterprises are expanding their design systems to include content. They may include the content style guide as part of the design system. Sometimes they will include content patterns that provide advice on reusable wording for messages or labels.
The content designer Michael Haggerty-Villa notes: “Getting the design and content teams in your company engaged in your design system is key to its success.”
Collaboration between content and UX teams in the development of design systems is still relatively new and can grow even further. By working together, content and UX roles can:
The goals of content and UX systems are similar. Design systems enable the reuse of screen components, while content models enable the reuse of content structures and items. CSS and taxonomies are global resources that can be applied to different channels.
Systems make collaboration easier. Everyone knows how various details will be handled and can plan accordingly.
What if we told you there was a way to make your website a place that will always be relevant, no matter the season or the year? Two words—evergreen content. What does evergreen mean in marketing, and how do you make evergreen content? Let’s dive into it.
Lucie Simonova
Aug 29, 2022
How can you create a cohesive experience for customers no matter what channel they’re on or what device they’re using? The answer is going omnichannel.
Zaneta Styblova
Mar 10, 2022
In today’s world of content, writing like Shakespeare is not enough. The truth is, there are tons of exceptional writers out there. So what will make you stand out from the sea of articles posted every day? A proper blog post structure.
Lucie Simonova
Jul 22, 2022