Vesper Rooms
A luxury architectural portfolio driven by cinematic scrolling physics.
Overview
A highly interactive, Awwwards-style architectural portfolio application built with React and Vite. It leverages GSAP and Lenis for advanced scroll-linked animations, horizontal pinning, and buttery smooth physics. The platform features dynamic randomized masonry grids, state-managed interactive accordions, and a custom cinematic error page.
Vesper Rooms was designed as a high-end architectural studio portfolio that prioritizes digital experience and storytelling over a traditional grid layout. The goal was to build a site that users revisit for design inspiration.
The frontend relies heavily on GSAP's ScrollTrigger and Lenis smooth scrolling to create tactile, cinematic interactions. Every major interaction—from the scroll-fill text manifesto to the horizontal pinned gallery—is tied directly to the user's scroll wheel rather than time-based delays.
To prevent performance bottlenecks caused by heavy architectural imagery, native lazy loading and asynchronous decoding were implemented globally. The window-pane hero section was engineered to randomly shuffle from a master list of projects on mount, ensuring a unique viewing experience on every visit.
Stack
UI / Frontend
Animation / 3D
How it works
Lobby Entrance
User is greeted by a preloader followed by a randomized selection of 6 curated project window panes.
Scroll Discovery
Scrolling triggers staggered fade-ins, an interactive text-fill manifesto, and a horizontal pinned gallery.
Deep Dive
User navigates to individual Project, Archive, or Journal pages for filtered content and detailed case studies.