An international humanitarian organization had its storytelling campaign spread across three different technologies, each with its own code, its own way to publish, and load times that punished mobile visitors. Andes Development built a shared Astro foundation, moved the four existing pages onto it in English and Spanish, and launched a new game page on the same base. The result: 100 on accessibility, best practices, and SEO on every page.
// The challenge
Each story in the campaign worked fine on its own, but together they were hard to maintain and heavy for visitors. The key challenges were:
- A Campaign "Frankenstein System" Each story had been built with a different tool (Vue 3, React with GSAP, and a standalone prototype), so every change meant remembering how each one worked.
- Weight That Scares Visitors Off A 2.6-second loading screen, external fonts, and bundles of up to 25 MB per page.
- International-Grade Privacy Analytics had to respect visitor consent before measuring anything.
- Publishing to the Client's CDN Pages ship to the organization's own infrastructure with no CI in between, so every delivery had to arrive ready to upload.
- Full Fidelity Calculators, audio testimonials, and animations had to behave exactly like the published versions, in both languages.
// The technology solution
Andes Development designed a reusable foundation and moved each story onto it, one at a time, with a parity check:
- One Foundation, Many Stories Static Astro output, Tailwind v4, and brand design tokens; React only for the interactive pieces, loaded as they scroll into view, and GSAP on demand.
- A Verified Migration Every page got its own brief and parity check: one story's 59 assets and 123 strings per language match the published version, and its calculator reproduces the original coefficients.
- Truly Bilingual Typed content collections for English and Spanish, hreflang, structured data (nonprofit, video, FAQ), and a sitemap that ties together pages deployed separately.
- Consent-Gated Analytics Google Consent Mode v2, denied by default, with a custom banner; no external runtime calls beyond analytics.
- Per-Page Packaging One command builds each page independently and produces the file ready for the organization's CDN.
- A Game on the Same Foundation The first net-new page turned a prototype into a playable game, with donating as the payoff at the end.
- Documented for Two Teams Guides and AI skills live inside the repository, so both the organization and Andes can build the next page without waiting on each other.
// Results and key wins
The campaign came out lighter, more accessible, and ready to grow:
-
100/100/100
Accessibility, best practices, and SEO on every page, with 91 to 99 mobile performance. -
5.9 s → 3.2 s
Mobile LCP on the heaviest story, with bundles up to 54% lighter (25 MB down to 11.5 MB). -
1 Foundation
Three technologies replaced by one, in English and Spanish, so the next page never starts from scratch.
// The bottom line
The campaign stopped being a pile of one-off projects and became a platform: same rules, same design, same publishing path. The stories load faster, respect readers' privacy, and meet the accessibility bar a global audience demands. The next story gets built in days, on a foundation the organization's own team can run too.