preston.so

Immersive Content and Usability is the first-ever book on immersive content and spatial content design, available now from A Book Apart.

Writing

Your CMS's AI story needs to bridge content, design, and code

March 24, 2026

Content, design, code. These are the mainstays of any content management system (CMS) worth its salt, despite the ebbs and flows of individual vertices of that triangle over the years. Without a good, cohesive story for all three, you can’t have good digital experiences.

In the early days, it was all about design: what you see is what you get (WYSIWYG) and drag-and-drop tools at the expense of both good taste in design and good maintainability in code. Then, content: well-written copy, well-structured models, and well-designed editorial experiences defined websites as they began to venture off the web and onto our phones. After the cloud revolution, it became about code: developers wanted experiences that matched their ideal workflows.

As I've written before at length, CMSs are unique among software because they operate at the intersection not only of content, design, and code but also of the people who produce all three artifacts: editors, designers, and developers. But what happens when organizations increasingly give these responsibilities over to generative artificial intelligence (AI) to free up resources or find new efficiencies?

Up until recently, most AI feature work in CMSs has focused on discrete atomic elements that often don’t see eye to eye and remain fragmented due to limited context and control. For instance, we’ve seen CMS vendors work diligently to implement generated text, generated images, and other generated form fields such as content summaries, alternative text for accessibility, and search engine optimization (SEO) metadata. In turn, we’re seeing generated design systems begin to see adoption, as well as massive use of generated code and copilot tools like Claude Code and others.

Just because AI is becoming an increasingly pressing concern in the CMS industry doesn’t mean that the baseline requirements of CMSs go away, especially in visual headless CMS, the category of systems that deliver content via a decoupled architecture but also enable full editorial control over the presentation layer. In fact, reconnecting headless clients typically written in JavaScript with visual editing tools is now a prerequisite for visual headless CMSs that are capable of juggling content, design, and code. And today, this also means going hand in hand with an AI feature set that is aware of and involved in all of these concerns.

In this article, I want to dig into how we’re thinking about these problem spaces at React Bricks, a visual headless CMS whose team I’ve just joined as Chief Commercial Officer. I recently had the privilege of sharing these views at EvolveDigital Toronto 2026 in my talk on how AI can work for everyone in visual headless CMS. The headless conference I help run, Decoupled Days, will also cover these subjects in our new talk track on emerging technologies and AI in Montréal in August  (yes, we’re headed to Canada this year!). Our call for presentations is open until April 1st, and early-bird tickets are on sale. I’m also excited to connect with other folks interested in how React and Drupal are approaching these issues at a birds-of-a-feather (BoF) session I’m running at DrupalCon Chicago 2026 this afternoon.

How the visual headless CMS evolved

All content management systems today involve a delicate balance between developers speaking in code, content editors speaking in content, pages, and layouts, and AI speaking in structure and context—when we give AI enough to work with, that is. These days, the visual headless CMS has emerged as the paradigm that works for both developers working in modern approaches and content editors living within the CMS.

Today, developers increasingly demand headless architectures that work with, not against, their ability to control how an organization’s brand guidelines and layouts tie into their projects. For a while, it seemed as if headless CMSs were actively working against the goals of content editors by overprioritizing the developer at the expense of user-friendliness and visual editing capabilities. But that equation has shifted over time.

The evolution of the CMS has been a story of tradeoffs, a constant balancing act between optimizing for developer experience and optimizing for editorial experience. More recently, as headless CMSs gave developers unprecedented freedom, we’ve seen the pendulum swing back in the favor of editors, to accommodate visual editing in order to fend off site builders like Webflow and Wix on one end—and to give content editors back the visibility and power they once had over how content looks in lieu of abstract and impenetrable form fields that, for many accustomed to prior approaches, represented glorified data entry.

The shape of the CMS to come

Many of the headless CMSs that emerged in the late 2010s and early 2020s got one key aspect of visual editing wrong by focusing solely on the dimension of visual preview. Rather than empowering content editors through in-place and contextual editing, as had been the case with monolithic CMSs like Drupal and WordPress, they instead obligated editors to take an additional, unnecessary step of seeing their content in context only after filling in form fields in a sidebar.

Visual site builders like Wix and Webflow presented the opposite problem: a sleek administrative interface for content editors with maximum flexibility and drag-and-drop capabilities, but without the constraints respecting fealty to design systems and brand guidelines. Where headless CMSs gave developers too much control and took power away from content editors, site builders gave content editors too much control over design decisions and how content appeared on the other side.

The shape of the CMS to come honors the emerging grand compromise in the industry across content, design, and code: making true visual editing possible with both flexibility in terms of user-friendly visual editing and control in terms of faithfulness to design systems and key organizational guardrails. In React Bricks, for instance, developers can build components in React, now the most popular declarative JavaScript framework, that reflect the way they want to work. This enables inline visual editing with key limits in place for editors to reflect the way they want to work, honoring the organization’s desired shape for how digital experiences should look and operate.

In React Bricks, the atomic unit for content is manipulable bricks that gracefully tie together code, structure, and visual editing. Developers architect how individual bricks are configured and presented in both the editorial interface and the front end, while content editors can use bricks to compose pages however they see fit. Via React’s concept of props, developers can give editors key levers and switches that modify presentation of these components within brand constraints.

Toward a shared common ground for AI

React Bricks co-founder and CEO Matteo Frana has long spoken about the need for a common ground that facilitates healthy collaboration between CMS personas and, increasingly, agents that value a good agent experience (AX). At present, many artifacts generated by AI don’t represent an optimal common ground for collaboration because they remain immutable and uneditable after each prompt. Images need to be regenerated if you aren’t happy with the result, and vibe-coded packages remain something only developers can dive into. Non-specialists need to prompt again and again to achieve a satisfactory result.

In his talk “UX, DX, and AX for content management systems” at Decoupled Days New York 2025, Matteo expressed his opinion that the new common ground across AI and CMS needs to be visible (“everyone can see it”), understandable (“everyone can understand it”), editable (“everyone can modify it directly”), and editable iteratively (without increasing “information entropy” with each new revision). Adhering to these principles allows for AI output to remain predictable, which is of paramount importance to stakeholders.

This is particularly relevant within the headless CMS context as full page generation becomes a popular use case. It’s a unique problem space that needs to synthesize not only the content destined for a page but also the context of the page in a site’s information architecture and how that content will be presented on that page. And this gets at one of the key tensions between visual headless CMS and “pure” headless CMS (where the concept of a page is philosophically less relevant). In a “pure” headless CMS, AI grapples with isolated fields without a clear understanding of how they come together to form a unified whole.

React Bricks treats pages as a first-class concept, because emerging AI conventions are following in the footsteps of editors in doing the same. Artifacts like routes.md, a Markdown rendition of each page on a site, and llms.txt, a kind of sitemap for AI crawlers, will soon be automatically generated in an upcoming release of React Bricks. As AIs continue to communicate with one another via these artifacts and also via metadata and AI-optimized content, the importance of CMSs that can intelligently bridge content, design, and code only grows.

Conclusion

An event photographer at EvolveDigital Toronto 2026 remarked to me that my demo of React Bricks, showing full page generation within the context of a CMS respecting both the standard design system and other content present in the site, hewed closely to Aidan Foster’s own compelling talk on fully generated pages in Drupal Canvas, which I enjoyed very much. It only goes to show how much importance practitioners are giving this essential bridge linking content, design, and code. It isn’t long before CMSs will need to be capable of generating entire sites spanning this bridge as well.

And conferences are increasingly attuned to this fact as well. Join me in Montréal this August 6-7 for Decoupled Days Montréal 2026 to explore these and other relevant topics in our new talk track for emerging technologies and AI. The Decoupled Days Montréal 2026 call for presentations is open until April 1st, and we’d love to have your session. Early-bird tickets are available for CAD 35, and we’ve just announced our first-ever keynote speaker, Joyce Peralta of McGill University. In addition, I’ll be leading a birds-of-a-feather (BoF) session at DrupalCon Chicago 2026 this afternoon on all things React and CMS for a deeper dive into headless architectures and these issues. Hope to see you there!

Before you go ...

Subscribe to my occasional newsletter. No spam. Just resources and exclusive ideas about omnichannel content and more. Also, be the first to know when my book Immersive Content and Usability is launched.

Trusted by

  • Genero
  • Srijan
  • Tag1 Consulting