This is a submission for the Storyblok Challenge

Link to Article on DEV.to [https://dev.to/phranciscorabello/chronoweave-ai-ai-architected-historical-content-for-storyblok-3klc]

What I Built

ChronoWeave AI: AI-Architected Historical Content for Storyblok

Licença: MIT

ChronoWeave AI is my submission for the Storyblok Headless CMS Challenge. This project explores the future of content creation, where AI transcends the role of writing assistant to become a true architect of complex content structures.

With ChronoWeave, any user can generate a rich, detailed, and visually appealing historical timeline on any topic imaginable. The AI ​​not only writes the content, but generates the entire JSON data structure that is used to programmatically create a new page (Story) in Storyblok, complete with nested components.

AI Generates a JSON Structure: A serverless function sends a carefully crafted prompt to the Google API (Gemini), instructing it to return a complete JSON object representing a timeline, inspired by Storyblok’s component architecture.

Demo:

Link App: https://chronoweave-ai-461570337029.us-west1.run.app/

Storyblok Space:
https://app.storyblok.com/#/me/spaces/285458031168970/stories/0/0/63728871620124

Code Repository:

https://github.com/frrabelo/ChronoWeaveAI
We strongly recommend including a license for your code

Demo Video:

Tech Stack

Typescript, js, nodejs, Gemini

How I Used Storyblok

In this project, Storyblok is not just an add-on; it is the foundational building block of the entire application. ChronoWeaveAI’s core functionality — generating structured data and giving it a visual form — would not be possible in the same elegant way without Storyblok’s component-based architecture.

1. The Schema as a "Contract"

The first step was to design the content schema in Storyblok. This structure acts as a strict "contract" between the AI ​​output and the CMS input. We defined two main "Bloks": a content type

 

Timeline_Page

and a nestable "Blok"

Timeline_Event

.

2. Programmatic Content Creation

The real magic happens when we use the Storyblok Management API. After the backend receives and validates the JSON from the Gemini API, it makes a POST request to https://mapi.storyblok.com/v1/spaces/YOUR_SPACE_ID/stories/. The payload of this request is the JSON object generated by the AI. Within seconds, a new “Story” is created, fully populated and ready to be displayed. This demonstrates the power of a headless CMS for content automation at scale.

AI Integration:

The Content Architect
This project was designed to compete in the “Amazing AI” category. Our ambition was to go beyond “AI-assisted content” to “AI-architected content.”

Level 1 vs. Level 2 AI Integration Level 2

Level 1 (The Common Approach): Use AI to populate a single text field, such as a product description. The AI ​​acts as a stand-in for a writer.

Level 2 (The ChronoWeaveAI Approach): Instruct the AI ​​to generate a complete, complex, nested JSON object that represents an entire page structure. Here, the AI ​​is not just a writer; it is the architect of the data structure itself.

The innovation is not in the fetch call to the API, but in the meticulous engineering of the prompt. The success of the project depends on a prompt that forces the AI ​​to behave like a data architect, not a writer. Our prompting principles were:

Role-Playing: The prompt begins with “You are a world-class historian and data architect.” This immediately sets the context and desired behavior.

Strict Output Format: We were explicit: "You MUST respond with a single minified JSON object ONLY. Do not include any explanatory text... Do not use "json" markdown code blocks. This is crucial for reliable programmatic parsing.

Provision of Schema: The prompt itself contains the JSON schema that mirrors our Storyblok components. This is a non-negotiable instruction that ensures compliance with the "contract".

Content Restrictions: Rules such as "generate between 7 and 12 events" and the use of specific categories ensure quality and consistency in the output.

Deep AI integration is what makes deep integration with Storyblok possible. The ability of AI to generate structured JSON is the key that unlocks the power of the Storyblok Management API. This symbiotic relationship is the heart of ChronoWeaveAI.

Learnings and Challenges

What I'm proud of

I'm particularly proud of having successfully demonstrated the concept of "Level 2 AI Integration". The moment when the first complex timeline was generated by the AI ​​and appeared perfectly structured in Storyblok, ready to be consumed by the frontend, was a great validation of our thesis. It shows an innovative and deep use of both technologies, going beyond the surface.

Challenges Faced:

The biggest challenge was undoubtedly the refinement of the prompt. Getting the AI ​​to consistently produce perfectly structured, minified JSON without any conversational text required dozens of iterations. This involved tweaking the wording, adding explicit negative constraints (like "Don't use markdown"), and testing with a wide range of topics to handle edge cases.

Key Takeaway:

The future of content management, especially in the headless context, may very well lie in this symbiotic relationship between AI as a "content architect" and a powerful, API-first CMS like Storyblok. This project felt like a glimpse into that future, where creating digital experiences rich and structured can be automated in ways that once seemed like science fiction.