Landing Page for an Architectural Studio.

This visually striking landing page was built based on Figma mockups provided by my design partners. Designed to reflect the elegance and precision of architectural design, the site features smooth animations and dynamic changes.

Site features

Full-Screen Background Video Loop. A high-quality background video runs seamlessly in a continuous loop, creating a visually immersive experience.

Smooth Section-Based Scrolling with Navigation. The site scrolls by sections, offering a structured and intuitive navigation experience.

Scroll by section

Dynamic Logo Adaptation on Scroll. The logo scales or changes from white to black depending on the active section, ensuring visibility over varying backgrounds.

Logo changes on scroll

Enhanced Webflow Gallery Interaction. A custom gallery with intuitive controls that respond to the cursor’s position (left or right). Slide descriptions are synced with the active slide, and transitions flow infinitely for a seamless browsing experience.

Slider gallery

Challenges & Solutions

Blank Space While Loading Intro Video.

Solution. Added a cover image that fades out once the video is ready to play, ensuring a smooth transition.

Navigating Hundreds of Products Efficiently.

Solution. Implemented multiple CMS Collections with cross-linking, organising content into a structured hierarchy: folder → subfolder → product.

Pixel-Perfect Execution for a Flawless Design.

Solution. Used a grid layout that precisely aligns with the design, maintaining visual integrity across all devices.