# Bricks and Keys — case study

> A Lagos real-estate company with two very different visitors — property investors and shortlet guests. The home page asks each of them one question and splits the site down the middle.

- **Client:** Bricks and Keys Luxury Homes
- **Type:** client
- **Industry:** Real estate & hospitality
- **Year:** 2023
- **Role:** Design & development — Blackstar Studios
- **Platform:** Web · Wix
- **Tools:** Wix, WhatsApp chat widget
- **Built with:** Wix
- **Status:** Live

- Case study: https://ministar-samuel.com/project/bricks-and-keys
- Live site: https://www.bricksandkeys.com.ng/

![Bricks and Keys home page: on the left, a building on its blueprints and “Looking for the next big thing in real estate?”; on the right, “I’m looking for the ideal getaway spot?” over a laptop showing the shortlet site](https://ministar-samuel.com/case-studies/bricks-and-keys/home-desktop.webp)

## Overview

Bricks and Keys Luxury Homes works in two corners of the Lagos property market at once. It develops real estate — its logo reads “hospitality · management · construction” — and it runs luxury shortlet apartments for guests in Nigeria and the diaspora.

The website had to serve both without blurring them: investors looking for their next acquisition, and guests looking for a few nights somewhere comfortable. It was designed and built on Wix by Blackstar Studios.

- **2** Audiences: investors and guests
- **12** Shortlet apartments listed
- **3** Shortlet areas: Ikate, Lekki Phase 1, Osapa London
- **1** Development on show: Abira Court, Lekki

## Challenge

The two audiences want almost opposite things from the same brand. An investor is weighing a large, slow decision: the development, its location, what is built in, a starting price, and someone to talk to. A guest is making a quick one: which area, how many people, what is included, the house rules, and whether the dates are free.

Put both on one generic property homepage and each visitor has to wade through the other’s content. Split them into two websites and the company loses the one brand that ties its homes and its apartments together.

Comparison — Investor · Projects vs Guest · Shortlet:

![Projects page: “We are dedicated to building your ideal home, one brick at a time.”](https://ministar-samuel.com/case-studies/bricks-and-keys/projects-desktop.webp)

![Shortlet page: the Aurora apartment in Ikate, four amenity icons, the nightly price and View Details](https://ministar-samuel.com/case-studies/bricks-and-keys/copy-of-properties-2-2-desktop.webp)

*Drag to compare: the same brand, built for two different decisions.*

## Goals

*goals*

**Split the journey at the front door.** One question per audience, side by side, before anything else.

**Look the part.** A premium, uncluttered feel — gold and charcoal on white — that suits both a development brochure and a luxury apartment.

**Keep a person one tap away.** A WhatsApp button on every page, and separate lines for property and shortlet questions.

**Make listings quick to scan.** Name, area, four amenities, a price and one button.

![The whole Bricks and Keys home page: the split hero, then a footer with contact, socials, helpful information and the office address](https://ministar-samuel.com/case-studies/bricks-and-keys/home-desktop-full.webp)
*The whole home page: the two questions, then the footer. Nothing else competes.*

## Research & discovery

The research notes from the project aren’t part of this write-up. The approach for a two-sided property site is to list, for each audience, the questions they need answered before they act — and then check that every one has a home on the site.

For guests, the site’s own FAQ is the best record of those questions: do I have to sign up to book (no), how do I pay (naira, dollars or a Nigerian bank transfer), how do I check a date, which areas you cover, the cancellation notice, whether I can inspect first, parties, discounts for longer stays, and the caution fee.

**What each visitor needs before acting** (flowchart):

1. Visitor arrives
2. Buying or staying?
3. Development + location — Abira Court, Lekki: the estate, its neighbourhood and nearby landmarks.
4. Amenities + starting price — Twelve amenity icons on the project card, from smart-home-ready to clean water.
5. Talk to someone — A real-estate enquiry line, WhatsApp, or the contact form.
6. Area + capacity — Bedrooms, beds, bathrooms and maximum guests, at the top of the apartment page.
7. Amenities + house rules — Check-in after 2 pm, check-out 11 am, no parties, no smoking (Aurora).
8. Dates + book — Adults, children and dates, then Book Now — no account needed.

## Information architecture & flows

The navigation stays short — **Projects**, **Shortlet**, **About**, **Contacts** — and the home page does the sorting. Its left half sends investors to Projects; its right half sends guests to the shortlet listings. The two paths never cross until the footer, where even the contact details are split by intent.

**The split-screen home, as a flow** (flowchart):

1. Home — Two questions side by side.
2. “Explore” — Left half: “Looking for the next big thing in real estate?”
3. Projects
4. Project page — Abira Court: gallery, neighbourhood, description, amenities.
5. Make a reservation
6. “Browse Shortlet” — Right half: “I’m looking for the ideal getaway spot?”
7. Shortlet listings — Twelve apartments, each with an area, four amenities and a nightly price.
8. Apartment page — Capacity, amenities, things to know, the price per night.
9. Book now
10. Need Help? (WhatsApp) — A floating button on every page.

**1. 1 · Two questions, one screen**

The home page doesn’t introduce the company. It asks the visitor which of two people they are, and gives each half its own button: a solid charcoal “Explore” on the investor side, a gold-outlined “Browse Shortlet” on the guest side.

![Bricks and Keys home: the investor half on the left, the guest half on the right](https://ministar-samuel.com/case-studies/bricks-and-keys/home-desktop.webp)

**2. 2 · The investor’s path**

Projects opens on a plain promise — “to building your ideal home, one brick at a time” — then the development itself: Abira Court in Lekki, its gallery, twelve amenities, a starting price and Learn more.

![Projects page: “We are dedicated” beside an illustration of builders carrying a beam, and the Projects heading below](https://ministar-samuel.com/case-studies/bricks-and-keys/projects-desktop.webp)

**3. 3 · The guest’s path**

Each apartment gets a full-width row: the name, the area with a gold pin, a line of description, four amenity icons, the price in large type and View Details, beside a photo carousel.

![Shortlet page: Aurora in Ikate, with Fast Internet, 24hours Power, Uniformed Security and Balcony icons, N80K and View Details](https://ministar-samuel.com/case-studies/bricks-and-keys/copy-of-properties-2-2-desktop.webp)

**4. 4 · From apartment to booking**

The apartment page answers the remaining questions in order — capacity, amenities, things to know — then ends in the booking form: adults, children, dates, Book Now. No account is needed.

Wireframes: Apartment page (desktop).

*Apartment page structure, redrawn from the live Aurora listing (no capture available).*

## Wireframes

Early sketches aren’t among the sources, so these are low-fidelity redraws of the live structure. They show the decision that matters most: the home page is two columns of equal weight, and the listing page is one repeated row, so a guest can compare apartments by scrolling rather than by opening each one.

Wireframes: Home — split hero (desktop), Shortlet — repeated rows (desktop), Project page (desktop).

*The live page structure, redrawn as low-fidelity wireframes (not the original sketches).*

## Visual design & system

- **Brand gold** #d49d43 — Guest-side headline, section titles, outlined buttons, location pins
- **Logo gold** #dabb61 — The BK monogram
- **Slate** #1b203c — The “Bricks & Keys” wordmark
- **Charcoal** #262626 — Solid buttons: Explore, Send, Sign Up
- **Bronze** #5b4015 — Navigation links
- **Paper** #f9f9f9 — Page background
- **Cream** #fffaf1 — The About page header
- **Apricot** #fed698 — Start of the “Join the Club” and contact gradients

- **Wix Madefor Display** — Hero questions and page headings

*gold, charcoal and air*

The palette does the sorting work too. Gold marks the guest side and the brand; charcoal marks the investor’s solid button and every form’s submit. Thin golden arcs sweep across the home page behind both halves, tying them into one picture.

Amenities are drawn as simple line icons in gold and charcoal, so a guest reads “fast internet, 24-hour power, security, balcony” at a glance. Warm apricot gradients are kept for the moments that ask for something — joining the email list, getting in touch.

![About page: “Committed to Excellence” on a cream header, then “Our Story” in large gold type](https://ministar-samuel.com/case-studies/bricks-and-keys/about-desktop.webp)

## Key screens

![Bricks and Keys home page](https://ministar-samuel.com/case-studies/bricks-and-keys/home-desktop.webp)

1. **One brand, three trades** — The logo carries “hospitality · management · construction” under the wordmark.
2. **The investor’s question** — “Looking for the next big thing in real estate?” with a solid Explore button to Projects.
3. **The guest’s question** — “I’m looking for the ideal getaway spot?” in gold, with an outlined Browse Shortlet button.
4. **The product, shown** — A laptop with the shortlet search, and floating cards for Lekki Phase 1, Ikoyi and Victoria Island.
5. **Need Help?** — The WhatsApp button that follows the visitor to every page.

*shortlet listings*

### One row per apartment.

Twelve apartments across Ikate, Lekki Phase 1 and Osapa London, each in the same row: name, area, a short description, four amenities, the price, View Details. Every row has its own photo carousel, so a guest can look inside without leaving the list.

![Shortlet page, first four listings: Aurora, Bricks Atlanta, Bricks Azul and Bricks Barcelona, each with amenities, a price and a photo](https://ministar-samuel.com/case-studies/bricks-and-keys/copy-of-properties-2-2-desktop-full-01.webp)

*projects*

### A development, laid out like a brochure.

Abira Court gets a large photo with thumbnails, a card with its location and twelve amenity icons — smart-home ready, internet, drainage, road, CCTV, pool, parking, 24/7 power, gym, fitted kitchen, gated community, clean water — and a starting price beside Learn more.

![Projects page: the “We are dedicated” hero, then the Abira Court card with photo gallery, amenity icons, description and starting price](https://ministar-samuel.com/case-studies/bricks-and-keys/projects-desktop-full.webp)

![About page: Committed to Excellence, Our Story, About Us, and the Join the Club email sign-up](https://ministar-samuel.com/case-studies/bricks-and-keys/about-desktop-full.webp)
*About, with the “Join the Club” email list*

![Contact page: a gradient panel with social links and an illustration, and a Get in Touch form](https://ministar-samuel.com/case-studies/bricks-and-keys/contact-desktop.webp)
*Contact: social links and a short form*

## Build & handoff

The site is built on Wix: listing pages with photo carousels, a booking form, an FAQ, an email list and a WhatsApp chat button. The dual-intent idea carries through to the parts visitors rarely notice:

**Contact routing in the footer** (flowchart):

1. A question
2. About property or a stay?
3. Real-estate line — “Inquiry Regarding Real Estate”: a phone number with Chat on WhatsApp.
4. Shortlet line — “Shortlet Question”: a second number with its own WhatsApp link.
5. Two Instagram accounts — Bricks Homes and Bricks Shortlet, listed separately.

*what the build includes*

- A floating “Need Help?” WhatsApp button on every page.
- Apartment pages with capacity, amenities, house rules and a booking form — no account needed to book.
- A guest FAQ covering payment, availability, cancellation, inspections, parties and caution fees.
- A “Join the Club” email list for subscriber-only deals, and a short contact form.

## Outcome & learnings

The site is live at [bricksandkeys.com.ng](https://www.bricksandkeys.com.ng/), with both paths working end to end: a development an investor can explore and enquire about, and twelve apartments a guest can browse and book. No traffic or booking numbers are documented, so none are given here.

The split-screen home earns its place: it lets one brand hold two businesses without either audience reading the other’s pitch.

*on a phone*

The phone layout is where the next round of work sits. In this capture the investor headline runs off the right edge of the screen, and a floating location card sits on top of it.

![Bricks and Keys home on a phone: the logo, the building on its blueprints, a headline cut off at the right edge with the Ikoyi card over it, and the Explore button](https://ministar-samuel.com/case-studies/bricks-and-keys/home-mobile.webp)

*next round*

- ☐ Re-stack the home hero for phones: one question per screen, cards below the text.
- ☐ Keep contact details in one place — the two phone lines swap places between the home footer and the other pages.
- ☐ One shortlet page instead of two copies (the menu and the home button point at different URLs).

---
By Samuel Ministar · https://ministar-samuel.com/project/bricks-and-keys