Residential complex
landing page
Azure Valley is a landing page template for real estate developers and new-build sales, created on Framer. It’s a ready-to-sell design product: a responsive website featuring a property presentation, apartment floor plans, an interior gallery, a list of amenities, testimonials and a consultation request form.
The template was designed for sale on the Framer Marketplace.
Goal: To package a complete, self-contained template that a buyer can purchase, fill with their own content in a couple of hours and launch as a site for a specific residential complex, with no coding skills or developer help required.
The template was designed for sale on the Framer Marketplace.
Goal: To package a complete, self-contained template that a buyer can purchase, fill with their own content in a couple of hours and launch as a site for a specific residential complex, with no coding skills or developer help required.
About the project
I started by collecting references from premium real estate websites that I liked. Based on them, Claude Code created a design layout in Figma: page structure, grid, typography and key screens.
I then moved the finished design from Figma into Framer using an import plugin, which turned the layout into the foundation of a working, responsive site.
All photos for the template were generated in Midjourney to establish a consistent premium visual style.
I then moved the finished design from Figma into Framer using an import plugin, which turned the layout into the foundation of a working, responsive site.
All photos for the template were generated in Midjourney to establish a consistent premium visual style.
I used MCP to connect Claude Code directly to Framer. This let me manage the project through code and noticeably sped up development: changes to the layout, pages and components were made programmatically, without clicking through the interface by hand.
Through this connection, I built custom interactive elements that aren’t available in standard Framer: a photo carousel, a clickable list of the complex’s amenities, a number counter, a preloader and smooth block reveal animations.
Through this connection, I built custom interactive elements that aren’t available in standard Framer: a photo carousel, a clickable list of the complex’s amenities, a number counter, a preloader and smooth block reveal animations.
Tools and process
Figma
Tilda
ChatGPT
MidJourney
A publish-ready template with a well-thought-out structure and custom components that are easy to edit through a clear properties panel. It comes with a buyer’s guide, marketplace cover images and a polished product description.
Result
When adapting the landing page, I treated mobile as its own experience, not just a squeezed-down desktop. Cards that sit side by side on the web can’t simply be stacked one after another: the block turns into an endless feed and users get tired of scrolling. In such places, I used a carousel. Cards swipe horizontally, the block stays compact and all the information is preserved.
Mobile version
I also designed secondary but important screens: a 404 page and a confirmation window for a successfully submitted request. Both follow the site’s visual style.
Secondary screens