CASE STUDY · WEBSITELIVE
This website is the demo.
HOME · PLAYGROUND SECTION
HOME · PHONE
01 — THE PROBLEM
Our site had to prove the work before anyone read about it.
A studio site usually describes what it builds. Ours needed to run the actual tools from our templates (treatment finder, before/after, facade map, calculators) without making every page heavy.
It also had to stay easy to re-skin, because the same structure is sold as a template.
02 — WHAT WE BUILT
Static pages, live islands.
01
Live tools as islands
Each template tool hydrates only when it scrolls into view. Pages without tools ship no framework JavaScript.
PLAYGROUND · TOOL TABS
02
Content collections as CMS
Industries, templates, packages, lab items and FAQ are typed collections, so the site can be re-skinned.
CONTENT MODEL · COLLECTIONS
03
Forms on the edge
Intake and waitlist forms post to a Cloudflare Pages Function, which passes them to Google Apps Script to log to a Google Sheet and email us.
START A PROJECT · STEP 1
04
Reduced motion everywhere
Every animation has a static fallback under prefers-reduced-motion.
MOTION SPEC · FALLBACKS
03 — STACK & ARCHITECTURE
Static first, JavaScript where it earns it.
BUILD
AstroStatic pages from content collections
ISLANDS
ReactSolenne and Olven tools
VueStack picker
EDGE
Cloudflare PagesHosting and CDN
Pages FunctionsForms and waitlists
Google SheetsLeads and waitlists via Apps Script, plus email
- Astro
- React
- Vue
- Cloudflare
- Google Sheets
04 — OUTCOME
What’s true today.
Verifiable facts only. Usage numbers are added when the client agrees to share them.- STATUS
- Live at promopark.studio.
- HOSTING
- Cloudflare Pages, on our own account.
- JAVASCRIPT
- Framework JavaScript loads only on sections with an island.
- REUSE
- Content model kept generic, so the site can be re-skinned.