35 years of theatre, online in 4 days.
One designer. One AI. No CMS.

Chapter 1 · The relational data problem

The constraint was never design skill.
It was data architecture.

Cross-entity search — productions and people in one typeahead. Trivial in code. Impossible in Webflow.

Webflow CMS can attach a tag to a person. It cannot attach a role to a person per production. The workarounds existed but were fragile and unscalable to 100+ productions. Framer was even more limited — one tag per person. The relational problem got worse, not better.

In code, this is trivial: a production has a cast_crew array where each entry carries both a person_id and a role. The entire structural limitation that killed three platforms was solved in a single JSON schema decision on day one.

Chapter 2 · The skill files are the real product

Designing the system was harder
than building the site.

Stories grid — everything you see is the blog-pages.md skill in action. Editorial voice, structure, and SEO encoded once, applied per article.

The 8 skill files encode design rules, data structure, content standards, research methodology, and validation — everything Claude Code needs to produce consistent, high-quality output without human supervision of each decision. They are versioned, reviewable, and reusable across future cultural-archive builds.

design-system.md ensures every page respects the dark editorial aesthetic. data-layer.md ensures relational integrity. production-pages.md runs the full research-to-page pipeline. person-pages.md handles biographical research across multiple databases. blog-pages.md maintains editorial voice. The remaining three handle animation behaviour, code conventions, and singleton pages.

Chapter 3 · The pipeline in full

Folder in. Live page out.
No code per production.

✔ Reading production-pages.md
✔ Translating Gujarati synopsis — Hindi, English
✔ Researching cast — 8 sources cross-checked
✔ Sourcing photos — public databases
✔ Writing productions.json entry
✔ Writing blog post — bombay-flower.mdx
✔ Validating relational integrity — 0 errors
$ git add . && git commit -m "add: Bombay Flower"
$ git push origin main
✔ Vercel deploying...
✔ Live — ideasunlimited.com/productions/bombay-flower
# elapsed: 4m 12s

The output

One folder of raw clippings → one finished editorial article. End-to-end Claude-generated, reviewed and pushed by me.

When a new production needs to be added, I drop a folder containing raw materials — synopsis in any language, photographs, YouTube links, cast list, newspaper clippings — and instruct Claude Code to add the production. Claude reads the production skill, translates source material, researches the production externally, finds backlink-worthy sources for SEO, adds new people to people.json with researched biographical profiles, sources photos from public databases, writes a rich synopsis, builds the complete JSON entry, writes a longform blog post, generates review pages for newspaper clippings, and validates everything.

The pipeline is not about replacing work. It makes work tractable that would otherwise be impossible for one person working part-time on a 113-production archive.

Chapter 4 · Dark editorial. 5/7 split. Ambient music.

Theatre lives in the dark
and sounds like sound.

Mega menu — full-bleed

Jain Performing Arts — cross-cut palette

The site should feel like entering a theatre, not a corporate brochure. Dark editorial aesthetic was a first-principles decision, not a trend. The Onassis-style 5/7 split column layout creates editorial weight — content feels considered, not crowded. Playfair Display serif type signals cultural seriousness. Full-bleed photography and a YouTube video hero put the work first.

Ambient music per production was a creative decision unique to this site. Theatre is sound as much as sight. Letting the music of a production play while reading about it changes the experience entirely — sense memory, not just information.

Chapter 5 · The content challenge

The platform problem was solvable.
The content problem is ongoing.

99 productions waiting in the queue. The system is ready. The content team is researching.

Source materials exist in Gujarati, Hindi, Marathi, and English. Newspaper reviews, director's notes, programme booklets — mostly in regional languages. Every piece needs translation and rewriting. Photographs, video recordings, press clippings, posters span 35 years and live in physical files, old hard drives, and personal collections.

Because nothing was properly documented digitally before, every production requires original research — newspaper archives, festival records, academic papers, external mentions — to reconstruct the full picture. The system had to be designed to make adding content as frictionless as possible. That's why the skill files came before the UI.

Chapter 6 · What I'd do differently

Three lessons I'd hand
to anyone starting an agentic build.

Chapter 7 · What this project made me understand

AI in service of art,
not commerce.

Cultural institutions — theatre companies, archives, arts organisations — are exactly where this technology can do its most meaningful work. They have decades of content and almost no resources to digitise it. The same agentic pipeline that took IU online in four days is the pipeline I'd hand to any regional theatre, music school, or independent gallery sitting on three decades of unscanned material.

Every platform I tried before taught me something. WordPress taught me that non-technical handoff is a real constraint. Webflow taught me that CMS limitations are data-model limitations. Next.js + Claude Code taught me that when you remove the CMS ceiling, the constraint shifts to where it should be: design and content quality.