Sprints & Sneakers: a headless platform the team builds itself

For growth marketing agency Sprints & Sneakers, we built a headless platform in Next.js and Strapi. The team uses it to put together its own pages, in Dutch and English. And anyone who doesn't feel like opening the CMS simply asks Claude.

Sprints & Sneakers works for B2B and B2C brands and publishes a lot: articles, case studies and events. The old site in Framer could not keep up with that pace.

We designed and built the new platform, from the logo to the CMS. This is the story of how an agency that sells SEO finally got a site that shows it.

What was the challenge at Sprints & Sneakers?

Every new case study, blog post or event needed a developer. Framer had no CMS where several editors could work at once, and no reusable blocks. So anyone who wanted a landing page had to wait. The site also lacked server-side rendering, structured data and hreflang between the English and Dutch versions.

For an agency that sells SEO and GEO itself, that is not a detail. It's a bit like a hairdresser with a bad haircut.

And the site looked like a template. That did not fit an agency that stands out precisely because of its own way of working.

Why did we choose a headless platform with building blocks?

Because the problem was not one page, but the pace. The team wants to publish more often than a developer can keep up with. So we didn't design a set of fixed pages, but a set of building blocks. In the new CMS, a page is a series of blocks the team chooses and fills itself, with no developer in between.

Strapi holds more than thirty building blocks. A hero, the funnel from awareness to referral, cards with awards, a grid of cases or events, frequently asked questions and a newsletter block. Each building block has fixed fields. That way a new landing page looks like the rest of the site, even when no designer looks at it.

Insights, cases and events each got their own type in the CMS. On /insights, for example, you choose a category such as AI & Innovation or Guide, and the grid adapts straight away. Every page also exists in English and Dutch, in the same CMS. With hreflang, search engines then show the right language.

My honest opinion: for a team that publishes a lot, a headless platform with fixed building blocks is almost always better than a beautiful template. When it is precisely not worth it, you can read in headless: when it makes sense and when it doesn't.

How does the team manage the site through Claude?

Through a dedicated MCP server we built alongside the platform. MCP is the standard that lets an AI assistant such as Claude talk safely to other software. With it, Claude creates pages, blog posts, cases and events in the CMS, using the building blocks of the brand's own design system. Publishing then remains a separate step for the team.

The team doesn't need to open the CMS for this. A request in plain language is enough. For example: check the SEO titles and descriptions of all published blog posts, and report which ones are missing or too long.

Claude first asks permission for every action. Then it asks the server which building blocks exist and which fields they need. A new page arrives in the CMS as a draft, with a preview link. Someone on the team decides whether it goes live.

That last part is, to me, the most important. AI can prepare the work, but a person presses the button. You see the same principle in our overview of AI agents for a retail organisation.

What does the design look like?

The design revolves around a new S&S monogram. On the homepage it doesn't sit flat on the screen, but spins as a 3D model behind the heading, built in Three.js and React Three Fiber. As you scroll, the S spins faster, slides up and fades out. Then the content below takes over.

The model only loads after the first scroll. So the heading and buttons are already there before the 3D starts. That way the animation costs no speed.

Alongside the monogram, the brand got a colour system with a black and white base and fluorescent green as an accent. The typographic hierarchy also became clearer. Everything is fixed in the design system, and so also in the CMS building blocks. Anyone putting a page together can't drift from the brand by accident.

On mobile, the order of the homepage stays the same: the promise, the funnel, the awards and the cases, one below the other. Cases and events use the same cards on a phone as on desktop.

How did we build the headless platform?

The frontend runs on Next.js 15 and React 19, with server-side rendering. Caching happens at the edge of the network through Vercel and Cloudflare. Images are served as WebP and AVIF, and heavy components only load when they are needed. Strapi v5 with PostgreSQL forms the basis of the CMS.

Findability is built into the foundations. Think of a correct heading structure, an XML sitemap and structured data for, among other things, the organisation and the frequently asked questions. Every page also has Open Graph, and there is an llms.txt for language models. We delivered the site at WCAG 2.1 AA level. You can read more about this stack under Next.js development.

What did the headless platform deliver?

In PageSpeed Insights, measured on 13 October 2026, the homepage scores 100 on desktop and 99 on mobile for performance. On both it scores 100 for accessibility, best practices and SEO. Organic traffic rose by 180% in the first three months after launch, partly thanks to the new platform.

The Largest Contentful Paint is 0.5 seconds on desktop and 1.8 seconds in the mobile test, which simulates a slow connection. At handover, the LCP was under 1.2 seconds. That is four times faster than the old Framer site. The layout also barely shifts (CLS 0.002 on desktop and 0.004 on mobile), and the site responds to input within 100 milliseconds.

Eight editors now work in the CMS at the same time, without conflicts. They put a new page together from existing blocks instead of someone building it.