01The story
From the brief to the live site.6 chapters · 3 min
A pencil drawing that fills in
The first screen is a pale grey sheet with Ground to handover. set large in a clean grotesque and one line beneath it: FHP is a general contractor in Dubai. One contract carries the drawing to the keys. To the right, a pencil sketch of a modern villa fills the frame, parts of its outline traced in one thin blue line, with FHP lettered into the boundary wall. Scroll, and the sketch gives way to the rendered house stage by stage, while a label beside the logo moves from STAGE 01 Ground onwards.
One contract, sixteen trades
The site talks to plot owners, developers and main contractors who want one party answerable for the whole job, and Hoorax designed and built it around that promise. A contractor is not a trade, the site says, but the one party that answers for every one of them, and sixteen trades sit under a single FHP contract. Every page comes back to that line: Contracting, Interiors and Manpower, the five Insights articles, and the one form that takes either a project or a request for a crew.
Trades in the order they work
Two scenes explain what a contractor actually does. Sixteen trades. One line to you. fans every trade, from civil and structure to renovation, into a single FHP contract, with programme, coordination, quality control, safety and cost set along the bottom. On a phone the same idea becomes two columns of icons wired to a blue FHP node, with a You node above it. Then Every trade, in sequence. slides six build stages sideways as you scroll, Ground works first and Handover last, each card listing its trades under an image of that stage.
One room, both ways
The centrepiece is a double-height hall. Above a thin blue rule tagged HANDOVER LINE the room is bare blockwork and concrete; below it sit the finished floor, lit stair treads and full-height glazing. As you scroll the line climbs the wall, labels for structure, blockwork, waterproofing, first fix, plaster and tiling tick past on the left, and the finished room takes over until FHP appears set into the plaster. The About page repeats the idea as a slider you drag across one villa, at structure and at handover.
Built for two kinds of enquiry
Because FHP also supplies helpers and skilled workers to other sites, two calls run side by side: Start a project in solid blue and Request manpower in outline. The Manpower page sets out who it serves and how a request works. On Contact, one form switches between the two with a pair of tabs, asking an owner what is being built, where and at what stage, and a site manager for trades, numbers and dates. Five Insights articles cover trade sequence, snagging, villa permits, reading a quote and hiring manpower.
The engine behind the scroll
No framework sits underneath: plain HTML, CSS and JavaScript, with the pinned scenes driven by the scrollcraft.js engine, so the hero film and the handover line move in step with the wheel. A thin rail down the left edge of each page marks its sections, GROUND, SCOPE, TRADES, HANDOVER, PEOPLE and START on the homepage, and a WhatsApp button waits in the corner. Pages are served from Vercel, enquiries are delivered by Web3Forms, and Google Analytics 4 and Microsoft Clarity measure use, as the privacy page explains.