Lately, we have started using Storyblok's MCP server with Claude Code, and it has been an absolute game changer for us and our clients.
We are now able to generate full website pages — landing pages, case studies, blog posts, and other CMS-driven pages — directly inside Storyblok with the help of AI. What earlier required a content editor or developer to manually enter the CMS, drag and drop components, fill fields, check structure, and assemble the page can now be done at a much higher speed through Claude Code connected to Storyblok's MCP server.
The difference in workflow speed has been massive.
Earlier, creating a page in Storyblok looked something like this:
A content editor would open the CMS, select the right page type, manually add each component, fill in every heading, paragraph, CTA, image field, card, section, and layout block, then preview and adjust everything one by one.
Now, the workflow is much faster.
We provide the raw content — either human-written or AI-generated — to Claude Code. Claude connects to Storyblok through the MCP server, understands the available components, picks the right structure, and assembles the page directly inside the CMS.
It feels like moving from manual page assembly to AI-assisted CMS operations.
In this post, I'll cover the two main ways we are using Storyblok's MCP server:
Generating new website pages
Creating and managing content types and components in Storyblok
1. Generating New Pages in Storyblok
One of the most powerful use cases for us has been generating new pages on the website e.g. landing pages, case studies, blog posts, service, campaign, and other CMS content pages.
Our current workflow looks like this:
Draft the page content → Send it to Claude Code → Claude fetches relevant Storyblok components → Claude assembles the page inside Storyblok
Once the raw draft is sent to Claude Code, it uses Storyblok's MCP connection to understand what components are available in the CMS and then creates the page using the right component structure relevant to the page type.
This saves a huge amount of manual effort.
Earlier, we would manually figure out which components to use and fill out each field to assemble the page, but now Claude handles the whole process automatically—and does it with impressive accuracy.
Organising Components Is Very Important for AI to Understand Context
One important learning: the way you organise your Storyblok components matters a lot.
If your components are scattered without clear naming or grouping, AI has to guess which components to use. That can lead to inconsistent results.
We found that it is much better to organise components into relevant folders inside Storyblok's Block Manager.
For example:
Keep all case-study-related components in a Case Study folder
Keep landing-page components in a Landing Page folder
Keep blog-related components in a Blog folder
Keep reusable global components in a Global folder
This makes it much easier to guide Claude.
Instead of saying, “Create a case study page,” you can say:
Use only the components present in the Case Study folder while assembling this page.
That removes a lot of ambiguity.
Claude no longer has to second-guess which components are suitable. It can focus on structuring the content properly using the exact set of blocks meant for that page type.
This small change makes the AI workflow far more reliable.
2. Creating and Managing Components and Content Types
The second major use case is more relevant for developers.
Earlier, when we needed to create a new component in Storyblok, the developer had to manually go into the CMS, create the component, add each field, decide field names, configure field types, write help text, and then make sure everything matched the frontend codebase.
This process was not difficult, but it was time-consuming.
It also required a lot of thinking around structure:
What should the component be called?
What fields should it have?
Should this be a text field, rich text field, asset field, option field, or nested block?
What naming convention should we follow?
What help text should be added so editors understand the field?
How should this map to the frontend component?
With Claude Code and Storyblok MCP, a large part of this work can now be automated.
We can ask Claude to create a new component in Storyblok with proper naming, relevant fields, clean structure, and helpful field descriptions. In many cases, the help text generated by Claude is even better than what a developer would have manually written in a hurry.
This is a big productivity improvement for teams building component-driven websites.
From Figma to Storyblok Components and Code
The most exciting workflow for us is using Figma designs directly with Claude.
We can give Claude the Figma file or design context and ask it to do two things together:
Create the required component structure in Storyblok
Generate the matching frontend component in the codebase
This creates a much tighter connection between design, CMS schema, and frontend implementation.
It can generate the component in Storyblok and simultaneously create the matching code structure in the project. The developer still reviews and refines the output, but the initial setup time is reduced dramatically.
For some workflows, this has reduced our time by up to 90%.
That is not a small improvement. It changes how fast a team can move.
The Future of CMS Workflows Is AI-Assisted
For us, Storyblok MCP with Claude Code feels like a major step forward in how modern websites will be built and managed.
The CMS is no longer just a place where editors manually assemble pages. It becomes a structured content system that AI can understand, operate, and extend.
AI is the new interface
When the CMS is well-organised, component-driven, and connected to an AI coding agent, the workflow becomes much faster.
You can go from raw content to a structured Storyblok page.
You can go from a Figma design to CMS components and frontend code.
You can create pages, improve content models, and manage components with far less manual effort.
It is an amazing time to be building websites.
See It in Action
We have attached videos showing how we are using Storyblok's MCP server with Claude Code in real workflows.
If you are using Storyblok, or planning to move to a component-based CMS setup, this workflow can significantly improve your team's productivity.
Book a consultation with us if you would like me to personally suggest a workflow that can increase productivity for your content, marketing, and development teams.