Oceana Bal Harbour

We moved Oceana Bal Harbour from Squarespace to Webflow and built an interactive floor plan buyers can explore unit by unit.

Client

Consultatio USA

Industry

Real Estate

Services

Webflow Development, Squarespace to Webflow Migration, Custom Integration

View Live Site

The Oceana Bal Harbour homepage: an aerial photograph of the white tower on the beach beside the Bal Harbour inlet, under the headline Live The Oceana Bal Harbour Residences Experience.

Who Oceana Bal Harbour is and why it needed a new website

Oceana Bal Harbour is a beachfront condominium in Bal Harbour, Florida, on the site of the former Bal Harbour Club. Its developer is Consultatio USA, led by Eduardo F. Costantini, and the building was designed by Arquitectonica, with landscaping by Enzo Enea and interiors by Piero Lissoni. A building with that pedigree sells on detail: the views, the art, the finishes and the exact place a residence sits in the tower. The marketing site ran on Squarespace. We came in with Matzii, a digital agency, to give Oceana a new home on Webflow, working with Consultatio's marketing team.

The challenge: a luxury building that buyers explore before they visit

For a buyer browsing from another city or another country, the website is the first walk through the building. Oceana needed pages for the residences, the lifestyle and amenities, the art program, sustainability, the neighborhood and the team behind the project. And it needed the one thing every serious buyer asks for: which residence, on which floor, facing which view. A static gallery could not answer that. The new site had to look like the building and work like a sales tool.

How we built Oceana's Webflow site and its interactive floor plan

We rebuilt the site in Webflow page by page, in Oceana's gold and white palette, with full-width photography of the tower, the beach and the interiors. The centerpiece is the floor plan. Buyers switch between Ocean View and Bay View, see an illustrated drawing of the tower, and browse the residences in a table that links each one to its plan, a 3D tour and the view from the unit, with a stacking diagram that shows where it sits in the building. Behind it, the residence data lives outside Webflow, in a Firebase and Google Cloud data layer we connected to the site, so the sales team's information could change without a redesign.

The Oceana floor plan page: Ocean View and Bay View tabs over a gold line drawing of the tower, a residence table with plan, 3D tour and view links, and a stacking diagram between the bay and the Atlantic. Unit figures are blurred.

Two phone screens: the Oceana homepage with the aerial photograph of the tower, and the team page opening on a furnished living room.

How Oceana went live on Webflow

The new site went live on Webflow in January 2021, replacing the Squarespace site the building had used before. Every section a buyer needs sits one click from the navigation: Lifestyle, Residences, Floorplan and a contact form, with the team, sustainability and location pages in the footer. The sustainability page carries one of the building's strongest claims: Oceana is the only Bal Harbour building to be LEED certified. On phones the same pages stack into a single scroll that keeps the photography first.

The Oceana sustainability page: an aerial view of the tower and the ocean above the heading Only Bal Harbour Building To Be LEED-Certified.

What happened after launch

In 2022 we handed the Webflow project over so Oceana's team could keep growing it with their next partner. The site we built still runs on Webflow today, and Webflow lists Fri3nds in the site's creator credits.

Four Oceana pages side by side: the Lifestyle section of the homepage, Bal Harbour Village, the project team and the location page with its beach photograph.

Credits

Client: Consultatio USA, developer of Oceana Bal Harbour, and its marketing team

Partner: Matzii (digital agency)

Webflow build, migration and floor plan integration: the Fri3nds team, led by Marcelo Russo

Services: Squarespace to Webflow migration, Webflow development, interactive floor plan, Firebase and Google Cloud integration, responsive build

/ BOOK A CALL

Let's get your next page
out this week.

A halftone hand holding a crumpled paper sheet painted with an orange arrow pointing up and to the right, on a black ground

Some months need more than the block of hours covers. The same team scales up for a launch, a rebrand or a migration, without a new onboarding.

Book a free discovery call