Real estate
A catalogue rebuilt from the ground up, with the search rankings untouched.
The background
Bustaprop is a Chilean estate agency with a site that had been live since 2019 and that, against the odds, ranked well. Inside it was another story: every property was a blog post with fields bolted on top. Thanks to a years-old bug, the region field stored that region’s entire list of districts instead of a single one. And email went out unauthenticated, so enquiries from interested buyers were lost without anyone noticing.
The brief was to rebuild it entirely. The constraint was to treat the rankings it had earned as part of the inventory: not one address could change.
First, separate the design from the data
We delivered it as two independent pieces. One holds the design; the other, the property model: the listing with its real fields, the enquiries, prices in UF and in pesos, and the full catalogue of Chile’s sixteen regions and three hundred and forty-six districts. Redesigning the site tomorrow must not be able to take down the data or the indexed addresses — and now it cannot.
The migration of the old listings was written with a dry run first: it runs without touching anything, you review what it would do, and only then is it applied for real.
The design system
- Colour with measured contrast, not estimated — every colour in the system carries its contrast level against the three surfaces where it can appear. Where the brand red was not legible as text, there is a separate shade for that: the corporate colour is respected without sacrificing anyone who reads with difficulty.
- Light and dark with no flash — the chosen theme is applied before the first paint, so the page never shows up white for an instant and then turns dark.
- Two typefaces, two files — one for headings and one for body text, both variable and served from the site’s own domain in a single file each, twenty and thirty-three kilobytes. Every weight available without one extra request or a call to somebody else’s service.
- Sizes that adapt without jumps — headings grow smoothly with the width of the screen, and body text honours the font size each person set in their browser. Spacing always comes from the same scale, and animations switch themselves off for anyone who asked their system for less motion.
- No tooling in between — there is no build step, no preprocessor, no jQuery, no front-end framework. Modern CSS and JavaScript, written by hand and loaded only on the page that uses them; the one outside piece is a select enhancer, served from the site’s own domain. What the browser already knows how to do, the browser does.
The screens
- Home — a photo carousel where only the first image travels in the HTML, marked as high priority; the rest appear as they are needed. Above it, the four-field search: operation, type, region and district.
- A listing that works without JavaScript — the filters are a real form: if JavaScript does not load, it submits and filters all the same. When it does load, results update in place and the browser address changes with them, so the back button and a shared link still work. On mobile the filters rise as a bottom sheet, and while they load there are skeletons announced to screen readers.
- Property page — a gallery with snap scrolling and a full-screen viewer built on the browser’s native dialog, which traps focus and closes on Escape without a line of library code. Price, details, description, neighbourhood, an enquiry form and direct WhatsApp contact with the property already quoted. Sharing uses the phone’s own menu, and where that does not exist it copies the link and says so. There is a print stylesheet.
The map that tells nobody who is looking
A standard embedded map reports to a third party every property every visitor looks at. Here the map is assembled on the server: when the listing is saved, an image of the area is composed and stored alongside the property. The visitor sees an image served from the same domain. No request leaves the site — not for the typefaces either.
And what is published is an approximate circle around the area, never the exact point of the house: someone searching sees the neighbourhood and how long it takes to walk to what is nearby, without anyone’s address ending up exposed on the internet. Public listings do not show owners’ contact details either.
Making search engines read what a person reads
Every listing is also published in the format search engines read: what is on offer, under which operation, at what price and in which currency, where it is and with what features. Filtered searches are governed on purpose — the simple search is indexed and the endless combinations are left out, since they only produce near-identical pages competing with each other.
The promise of not losing addresses has an automated check that runs before publishing: it compares the site’s full list of addresses against the reference list and fails if any of them stopped responding. The rule no longer depends on somebody remembering it.
What the team sees from the inside
Enquiries stopped being an email that sometimes arrived. Each one is now saved first and sent afterwards: if the email fails, the enquiry is already in the system. They have their own inbox with statuses, search, a warning when one has gone three days without a reply, and a counter in the menu. Sending goes through an authenticated mail server.
Listings are entered through purpose-built forms, with the map included and a button that places the property from the address as typed. And the panel carries the screens the business actually needs — contact details, opening hours, social links, services, testimonials — so changing a phone number is not a job for someone else.
The result
The site is live with the new design, the catalogue migrated and the same addresses as always. It is fast because it does not load what it does not use, accessible because it was measured while it was being built, and it shares its visitors with nobody. The data model was written to serve any estate agency, not just this one.