- Client: TDK Design & Build
- Sector: Residential design & construction
- Year: 2026
- Services: Web design, development, CMS
- Location: Nicosia, Cyprus
TDK Design & Build
TDK Design & Build is a family studio in Nicosia that draws residences and then builds them. The architect who designs a building is on the same team as the people who put it up and hand over the keys.
That is the whole pitch, and it is rare in Cyprus, where design and construction are usually two contracts and two sets of excuses. The website had to say it in one look, and then sell the flats.
Overview
TDK came to us with buildings, not with a brand online. Two apartment buildings delivered, a third under construction in Strovolos, modular homes, a complex in Limassol, and an architect and a site manager who run the whole thing as a family.
The brief had two jobs in it. The first was to make one idea obvious, that the same people draw and build. The second was commercial: Almond Suites, eight residences under construction, needed a page that shows what is still available and takes a buyer’s interest without a phone call.
Who they are
A family design-and-build studio in Nicosia: an architect, a site manager, one team from the first sketch to the last fitting.
What they came with
Six projects across Nicosia and Limassol, renders and site photography, and no website that showed any of it.
What they needed
A site that says design and build in one look, a project archive, and a sales page for the flats still on offer.
The problem
A buyer looking at a new apartment in Nicosia is comparing developers, and most developers look the same online: a render, a floor plan PDF, a phone number. The difference TDK offers, that the architect stays on the project until handover, does not show in a render. It had to be told, and told quickly.
The second problem was keeping the site true. Units sell, buildings finish, new projects start. A site the studio cannot update itself is out of date the month after launch, and an out-of-date availability table is worse than none.
Design concept
The concept is the building in front of the name. The hero sets the letters TDK across the street, and the studio’s own building stands in front of them, its roof slab crossing the D. It is the brief in one picture: the name and the thing they build, in the same frame.
Below it the page is white and editorial, set in a light geometric sans with a monospaced voice for the labels and the numbers, and one teal accent. The projects come as a pinned reel, one building at a time, then the team and the materials, then three short beats that end on the line the studio is built on.
The building in front
Two aligned plates, the street and the building cut from its sky, with the letters between them, so the roof reads in front of the name.
One building at a time
The project reel is pinned: each building gets the whole screen, its name pulls into focus, and the index keeps count.
Numbers you can trust
Units, sizes and availability are set in the mono face and count up when they arrive, like a schedule rather than a brochure.
Development
A Next.js site with a Sanity studio built into it. Projects, units, team members, site images and settings are all content the studio edits itself, and a webhook rebuilds the affected pages the moment they publish, so the availability table is never older than the last change.
The motion runs on GSAP and Lenis: the hero’s wipes and letter slides, the pinned reel, the scrubbed beats, the count-ups. Interest in a unit goes through a form that emails the studio, sends the buyer a reply and files the enquiry as a lead in the same CMS.
The CMS inside the site
Sanity Studio lives at its own route on the same deployment. Projects, units, team and images are documents the studio edits, with no developer in between.
Publish, and it is live
A webhook revalidates exactly the pages a change touches, so a sold unit is shown as sold within seconds of being marked.
Interest, filed as a lead
Register interest validates the form, emails the studio, answers the buyer and writes a lead into the CMS, so no enquiry lives only in an inbox.
Two forms, guarded
Both forms are validated on the server, carry a honeypot and are rate-limited, because a contact form on a property site is a spam target from day one.
Key decisions
The hardest piece is the hero. The letters have to sit behind the building at every screen width, and a building does not scale the way type does. The letters are sized in container units against the same box as the photographs, so the roofline lands on the D on a phone and on a wide monitor alike.
The second is the way a project opens. Click a building in the archive and its photograph lifts off the page, grows to fill the screen, and becomes the hero of the project page underneath it. The route changes only once the picture is in place, so the visitor never sees a page load, only the building getting closer.
Locked to the roofline
Container-unit type against the photographs’ own box keeps the building in front of the name at any width.
The picture carries over
A shared-element transition keeps the clicked photograph on screen across the route change, so a project opens without a cut.
One function per scene
The pinned reel is driven by a single render function of the scroll that never reads layout, which is why it stays smooth on a phone.
What was delivered
The site, designed and built from a blank file, with its CMS, its forms and its project pages, handed over to a studio that now runs it without us.
- Homepage, about, projects archive and contact
- A page per project with an availability table
- Sanity CMS embedded in the site
- Webhook revalidation on publish
- Register-interest and contact forms with auto-replies
- Shared-element transition into every project
Result
The site is live and the studio runs it: projects, units and availability are edited in the CMS and appear on the page within seconds. We have no sales or enquiry figures from TDK to publish, and we will not invent them. What changed is that a buyer can see what is still available at Almond Suites and register interest in a unit without a phone call.
