Youth Orchestras of Charlotte

Client Profile

Youth Orchestras of Charlotte (Demo Preview)

Project Summary

The Youth Orchestras of Charlotte are an independent nonprofit dedicated to nurturing and inspiring the musical talents of youth in the greater Charlotte area, training roughly 200 musicians ages 9-19 across four ensembles led by Charlotte Symphony players and the region’s top music educators. This bespoke demo rebuilds their site as a fast, server-rendered experience: a poster-style collage hero, a crimson ensemble tile grid, the real 2025-26 season calendar, consolidated audition info, and the orchestra’s first international tour. Every fact, bio, and tuition figure comes verbatim from the org’s own site.

Objectives

• Make four distinct ensembles (Youth Orchestra, Preparatory, Sinfonia Strings, Flute Choir) easy to navigate
• Get concerts and events into Google-indexable HTML instead of an AJAX-invisible calendar widget
• Consolidate audition requirements, tuition, and the registration flow onto one SEO-titled page
• Add email capture, which the original site lacked entirely
• Give the Austria 2026 tour and donation paths prominent, working CTAs

What We Implemented

• Bespoke Vite + React 18 + Tailwind 4 build (not the CMS template), cloning the Samuel Sparrow scaffold
• Server-rendered per-route via an SSR entry bundle, so events and bios ship as crawlable HTML with per-page titles and meta
• Concert-poster type system: Fraunces display + Montserrat body, crimson on warm-ivory with near-black "stage" sections
• Signature crimson-tinted clickable ensemble tile grid on Home and Programs
• Seven routes (Home, About, Programs, Events, Auditions, Austria Tour, Support) with the real 2025-26 season and verbatim staff bios
• Front-end newsletter signup plus live donate (DonorPerfect), audition register (JotForm), and ticket (Etix) CTAs
• Optimized WebP images synced from S3, with site.ts as the single source of truth populated verbatim from scraped content

Results

• Events and ensemble content now render in server-side HTML with a sitemap and per-page meta, fixing the original calendar’s invisibility to search
• Added an email-capture section the original site never had
• Auditions, tuition, and registration unified on one searchable page with a working register CTA
• Four-ensemble program structure and the Austria tour made clear and scannable in a single, cohesive design