"A self-initiated concept build for a fictional Dubai tower — a cinematic, scroll-driven launch site with a WebGL hero, built to demonstrate what we can do when a brand needs to be felt rather than merely read."
Overview
Property developers sell an emotion before they sell a floor plan. We wanted a piece that proved we could build that feeling in a browser, so we invented a forty-two-storey tower and gave it the launch site it would deserve — WebGL atmosphere, scroll-choreographed storytelling, and full Arabic RTL.
What it demonstrates
Custom fragment shader hero
True RTL mirroring
No framework, no build step
Screens
Screenshots of the live build — not mockups. Each one is the running site at 1440×900.
A scroll-tied headline reveal over full-bleed water footage, set in a high-contrast display serif with the launch line held above it.
Section copy resolves as you arrive, over a Dubai skyline plate, with the floor index tracking quietly down the right-hand edge.
A horizontally scrolled gallery of the arrival, living and terrace spaces — each frame captioned and counted, driven by scroll position rather than a carousel timer.
Six layouts from one bedroom to penthouse, each with its area range and starting price in AED, on a rule-divided grid that keeps the numbers comparable.
An underlined-field form in the brand palette, with the concept-build disclosure kept visible rather than buried in the footer.
How it was built
The hero is a single full-screen quad running a hand-written fragment shader: layered fbm noise drifts as haze, the cursor drives parallax and UV displacement, and a chromatic split widens toward the edges. It caps pixel ratio and stops rendering the moment it scrolls out of view, so it costs nothing down-page. Above it, a Lenis-driven scroll feeds GSAP ScrollTrigger — the title splits per character and masks up, a manifesto lights word by word, a pinned section counts the tower down floor by floor, and the interiors gallery is dragged sideways by vertical scroll. Every layout property is logical rather than physical, so switching to Arabic mirrors the whole page rather than patching it.
Note: Alvenar Residences is a self-initiated concept build. The development, its residences, prices and location are fictional and nothing is offered for sale. It exists to demonstrate front-end engineering and interface design.
* Whether you have a question or want to discuss a project, the team at
GOAT Technologies is here — USA head office, Dubai branch. Fill the form below!
