Philipp Storl
← All work

Engineering · 2020–2025

Five years evolving the VOICES conference website

From introducing Eleventy as the framework to maintaining a multi-region, multi-state event website across five annual editions — and keeping it consistent through two complete rebrands.

  • Eleventy
  • Netlify
  • JAMstack
  • Bootstrap
  • YouTube API
  • Static Site

VOICES is Staffbase’s flagship annual conference for internal communications and employee experience professionals. The website promoting it — voices.staffbase.com — is a different kind of problem than the main marketing site: it has to serve three distinct lifecycle states, support multiple simultaneous regional editions, and be rebuilt from scratch for each annual event while retaining accumulated improvements. I owned it from the ground up for five years.

Introducing Eleventy

When I took on the VOICES website in mid-2020, the existing setup wasn’t working well. The conference had been running for several years but the web presence was awkward to maintain and extend. In July 2020 I ran a Proof of Concept with Eleventy — a lightweight static site generator — to validate whether it could handle the requirements: templating for components, data-driven content, multi-region support, and easy deployment through Netlify.

The PoC worked. Eleventy was the right tool: simple enough to build quickly, powerful enough to handle the complexity, and producing purely static output that Netlify could serve without any server-side overhead. This was a JAMstack decision before “JAMstack” was a standard part of the marketing vocabulary.

I built the first full version of the new site from an Adobe XD design, establishing the component system that would carry forward across every subsequent edition.

What the site actually is

The VOICES website isn’t just an event page — it’s a small product with defined states and components.

Three lifecycle states govern every section: pre-event (promoting registration, teasing the agenda), during-event (shifting to live-event content and thank-you flows), and after-event (showcasing recordings, promoting next year). Components are designed to handle all three states cleanly, switching between them via configuration rather than code changes.

Three regional editions run simultaneously on the same codebase: DACH (German), UK, and US/North America. Each has its own configuration for dates, copy, imagery, CTAs, and tracking — but shares the component library and style system. Adding a new region means configuring data, not rebuilding components.

The component library is substantial — speaker lineups, multi-track agendas, registration flows, post-event recording sections, award sections — each component built to handle all three lifecycle states. Every component handles missing-data states gracefully, so the site can go live early while speakers, agenda items, and partners are still being confirmed.

The YouTube API integration

One of the most satisfying technical pieces was automating the post-event recordings section. Rather than manually adding videos, I built an Eleventy data source that pulls recordings directly from YouTube playlists via the YouTube API at build time. The recordings section populates automatically — as new videos are added to the YouTube playlist, the next site build picks them up.

This is the “right tool for the job” principle applied cleanly: event recordings are a content management problem, not a development problem. Separating the concern meant the conference team could manage post-event content through YouTube directly, and the website handled the rest.

Consistency through change

Five years is a long time in brand and technology terms. The VOICES website went through two complete rebrands — 2022 and 2025 — plus annual updates for each event edition. Each year: new dates, new speakers, new imagery, new event theme, potential new regions or regional expansions.

What made this manageable was the component architecture established in 2020. New brand colours and typography get applied to the design system once; every component inherits the update. Annual content changes happen in data files rather than template code. The result is a site that looks purpose-built for each year’s event while requiring significantly less effort than a ground-up rebuild would.

The NA/US 2023 MVP introduced a third regional edition, extending a 2-region codebase to 3 without touching the underlying component system. By 2026 the platform serves four simultaneous global events — VOICES Berlin (in-person, German), VOICES Americas (virtual), VOICES London (in-person), and VOICES APJ Customer Awards (virtual) — each with its own configuration but sharing the same component library, the same styling system, and the same deployment pipeline I set up in 2020.

What five years of ownership produces

The documentation I wrote for the VOICES website covers component states, styling guidelines, regional configuration, the deployment workflow, and the lifecycle management process. When the time came to hand it over, the knowledge was in the documentation — not just in my head.

That’s the measure of a well-owned project: when you leave, the thing you built continues to work.