Sonic Artistes Website
The next-generation Sonic Artistes public website — Astro 6, dark-first design system, Directus CMS, deployed to Cloudflare Pages. Every content collection is editor-managed through a Directus→Markdown sync pipeline.
Overview
The next-generation Sonic Artistes public website — rebuilt from scratch with Astro 6, a dark-first design system with record-label energy, and a Directus CMS powering every editable collection. Deployed to Cloudflare Pages on a static output model with selective Preact hydration islands for interactive components.
Content is managed entirely through Directus: artists, opportunities, team members, testimonials, partners, FAQs, timeline, backstage posts, and singleton page data are all synced to the repo via an automated Directus→Markdown pipeline. The design system is built on CSS custom properties — no Tailwind — with dark and light themes, variable fonts (Hanken Grotesk + JetBrains Mono), and strict WCAG AA accessibility.
Pages include the homepage (13 sections), /opportunities, /artists archive and individual artist pages, /apply (multi-step Preact wizard), /about, /meet-the-team, /contact (Cloudflare Pages Function webhook proxy), /sonic-studios, /backstage-pass, /jobs, and a branded 404. Navigation is “The Index” — a full-screen overlay with animated presence. Staging is live at staging.sonicartistes.com on Cloudflare Pages; DNS cutover to the apex domain is pending.
Build log
22 entries
The nav pulse dot is now editor-controllable — tone and visibility set in Directus, no deploy.
Twelve sticky elements were all using hardcoded pixel offsets. Now they track the nav height in real time.
↗ View commitSonic Studios gets its own page — production and rehearsal facility, fully branded.
↗ View commitThere is now a /jobs board. Open roles display in a dedicated, filterable layout.
The Backstage Pass is open. Editor-managed articles, no redeploy.
↗ View commitLost visitors get a branded 404 in the studios visual vocabulary instead of a browser default.
↗ View commitHomepage hero copy and marquees are editable from Directus — no deploy needed.
↗ View commitArtist cards now show real portraits and gallery images where they exist.
↗ View commitSite settings — nav pulse and social links — now live in a Directus singleton.
↗ View commitTestimonials, team, and timeline are all Directus-driven now.
↗ View commitPartners and FAQs migrated to Directus. Three collections down, more to go.
↗ View commitThe Directus sync now handles arrays, nested objects, and image downloads in one pass.
↗ View commitOpportunities are now driven by Directus. Markdown is just a sync artefact.
↗ View commitThe team has faces and names. /meet-the-team is live.
↗ View commitContact form submissions now proxy through a Cloudflare Pages Function.
↗ View commitNavigation is now a full-screen overlay. Meet The Index.
↗ View commitThe story behind Sonic Artistes is now on the /about page.
↗ View commitThe Apply Now flow is a multi-step Preact wizard — no full-page reloads.
↗ View commitArtists get their own archive and individual profile pages.
↗ View commitMusicians can now browse every live ship opportunity on one page.
↗ View commitThe homepage went from zero to 13 sections in one build.
↗ View commitThe site started as a blank Astro scaffold. Now it has tokens, a nav, a footer, and a theme toggle.
↗ View commit