Cinematic landing page concept for a fictional luxury Swiss real-estate agency. Stacks a frame-scrubbed canvas hero, a pitched 3D MapLibre map and an ROI mortgage calculator on a single page.
Overview
A demo project that proves two heavyweight techniques can live together at production quality. Image-sequence canvas scrub for the hero, 3D MapLibre with custom pin shaders for the map, both on the same page without compromising scroll performance.
What it does
- 192-frame scroll-scrubbed cinematic hero
- Pitched 3D MapLibre map with custom pin shaders
- ROI mortgage calculator with live updates
- Property cards with depth-on-scroll
- Mobile-aware fallbacks
Highlights
- Under 420 KB gzipped JS for the whole experience
- Two heavyweight techniques on the same page without jank
- Built as a hiring sample, not a real client engagement
