I designed this concept website by Maaz M.I designed this concept website by Maaz M.

I designed this concept website

View completed worknorthgate-construction.vercel.app
I designed this concept website for a custom home builder. The idea was to let people design their house themselves and see a real price before they ever speak to a salesperson. The challenge was to make something as complex as building a home feel simple, visual and even fun.
Hero. The headline makes the promise in bold, tightly set type: "Design your new home in 3D. See what it costs in minutes.", with a hand-drawn rust underline beneath "in minutes." On the right, a model farmhouse sits inside an architect's frame with dimension lines (65′ 10″ × 32′ 6″) and a north arrow. Under it, a project card shows the design name, living area and ballpark price, with a dark "Customise this plan" bar. Three small checkmarks, "No sign-up," "Takes about 3 minutes" and "Free consultation," remove hesitation before the visitor starts.
Visual language. I built the whole site around an architectural drawing set:
Numbering: every section is labelled like a blueprint sheet (A-102, A-201, A-301), and monospace labels read like annotations on a plan.
Grid: a faint drafting grid runs behind the page.
Palette: warm paper cream, charcoal ink and one rust-orange accent for buttons and key prices.
The navigation is numbered too (01 Design yours, 02 How it works, 03 Our homes, 04 FAQ), with a US/UK currency switch and a click-to-call phone number.
The 3D designer. This is the heart of the site. On the left, a live 3D model of the house; on the right, a step-by-step panel:
Start: choose from four starting designs (Contemporary, Modern Farmhouse, Traditional, Single-Storey) or start from scratch.
Size: storeys, a living-area slider, a rectangle or L-shaped footprint, ceiling height and basement.
Rooms: steppers for bedrooms and bathrooms, plus chips for a home office, laundry, pantry or media room.
Roof: shape, pitch, material and colour swatches.
Exterior: cladding type, colour and accent options like a stone base.
Windows: window count, window style, rear doors and balconies.
Outdoor: garage size, porch and patio, plus a roof terrace or fireplace.
Finish: Essential, Premium or Luxury, ending on a summary.
Every choice rebuilds the 3D house instantly, and a live estimate at the bottom of the panel updates with each decision. The viewer has its own controls: front, back, side and aerial cameras; a night mode with glowing windows; an inside cutaway of the floor plan; dimension overlays; and zoom.
Supporting the decision. The rest of the page answers what a buyer asks next:
"Three steps from first sketch to front door" uses large outlined numbers and simple line icons.
"One team. One price. No surprises." lists the builder's guarantees.
"Start from a favourite" shows four home designs as plan cards with specs and prices, each loading straight into the designer.
The build schedule is a Gantt-style timeline across 11 months, from consultation to handover, separating "with you" steps from "we handle it."
Client notes and FAQ: client notes pull out one large quote, and the FAQ gives five straight answers.
The page closes on a dark section, "Your home, designed in minutes.", with a line drawing of a house and two clear actions: design your home or talk to the team.

0 likes · 0 views · Oct 4, 2026

I designed this concept website for a custom home builder. The idea was to let people design their house themselves and see a real price before they ever spe...