Website design and development · Designed and built by VJO
Website for a residential developer and builder
The English-language website of a Melbourne residential developer and builder: six pages with a dark, cinematic design, designed and built by VJO and now live. The client's name and web address are not disclosed.
Layout from a live project; client not named
The brief
- 01
The site is in English only. It is written for landowners weighing development, and for owners and partners who need a project managed.
- 02
It presents the company and its work only. No personal details, project addresses or project counts appear, and Melbourne is the only place named.
- 03
The design is dark and cinematic: a near-black ground with bronze accents, serif headings and a sans-serif text face.
- 04
Images include project photographs and architectural renders. Street numbers are obscured, and every render is labelled Architectural visualisation.
Method
- 01
Structure and content. Six pages, Home, Services, Projects, About, Contact and Privacy, with a 404 page besides. Content is written in Markdown, and a single build script generates the whole site.
- 02
Engineering. A static site with no dependencies: no npm packages, no front-end assets from external CDNs, no third-party analytics, and fonts served from the site itself.
- 03
Release. Asset filenames carry a content fingerprint, so static files are cached long-term while HTML is revalidated on every request. Each release is checked in a preview environment before it goes live, and an earlier version can be restored when required.
- 04
Quality gate. Before deployment, automated checks cover prohibited terms, broken links, image alt text, inline styles, first-screen asset weight and colour contrast. A single failure stops the release.
- 05
Photography. Images were chosen from professional originals and prepared as WebP. Street and letterbox numbers are obscured, and renders carry the label Architectural visualisation.
- 06
Motion. A line drawing of a façade shifts slowly with scroll and cursor, and a fine network of lines appears around the pointer. Where reduced motion is set, JavaScript is off or the screen is touch-based, a still version is shown.
- 07
Hosting. Deployed on Cloudflare Pages, with security headers and a content security policy in place.
Deliverables
- The live website, six pages in English.
- Build and release scripts that generate the site and manage preview, live deployment and version restoration, each with a single command.
- A quality-gate script that runs automatically before every release.
- A prepared image library, with the rules for selection, obscuring and labelling.
- First-screen motion, with a still version.
This page covers the design, development and delivery of the website. The client's name and web address are not disclosed, and the text in the home page layout has been replaced with placeholder copy.