C4
ConceptWebsiteConceptLogisticsAutomotiveMotion DesignReact2026

SGR Prestige Car Transport

A speculative rebuild for an enclosed car transporter, where the facts nobody could verify are left as ruled blanks on the page.

ClientConcept. Enclosed prestige vehicle transport
LocationAustralia
RoleSolo (audit, design, development, generated hero sequence, deployment)
01

Overview

An unaffiliated rebuild of enclosedtransport.com.au, built as a pitch and deliberately reachable so it could be sent to the owner, while being blocked from search three separate ways so it can never compete with their real site. Nothing on it is invented. Every fact traces to SGR’s own site, Instagram or Facebook, and anything unknown renders as a visible ruled blank rather than a plausible-looking number, which is why the insurance and trailer sections read as half-finished on purpose. There is no testimonials section, because the business has no reviews anywhere and none will be fabricated to fill the gap. The current site displays six manufacturer logos; this build names the cars in words instead, since those marks imply a relationship that does not exist. Every photograph is the owner’s own, re-encoded to WebP. The one exception is the opening sequence, which is generated video, because no footage exists of their rig loading at night. The trailer carries no livery and the car no badge or plate, so nothing in it claims to be a vehicle they own, and the disclosure travels with the footage in both the pitch and the outreach email. Available to license or commission.

02

Screenshots

03

What I Delivered

  • A single-page site plus six written service pages, one per transport type.
  • A scroll-scrubbed opening sequence built from generated night footage, with the generation disclosed to the owner.
  • A browser-measured audit of the existing site, published as AUDIT.md.
  • A written design direction produced before any code.
  • An outreach email, an owner-facing pitch, and a build log recording every generated asset with its verdict.
  • A handover checklist covering the facts still missing, the indexing reversal and the concept markings to remove.
04

Key Features

  • Scroll-scrubbed cinematic opening: the trailer at night, the doors opening, the car coming down the ramp.
  • Condition report section that shows the document itself rather than describing it.
  • Ruled-blank rendering for unknown facts, so a missing insurance limit reads as missing instead of being quietly omitted.
  • Quote form with sessionStorage draft persistence and an honest failure state that keeps every answer on screen.
  • Spam handling by honeypot and a minimum time-to-submit, against the 804 KB of reCAPTCHA the current site ships on every visit.
  • Third-party manufacturer marks deliberately left out, with the cars named in words.
05

Stack & Tooling

  • React 18 with Vite 6 and react-router-dom.
  • Tailwind CSS 3 with tailwind-merge and an OKLCH token palette.
  • lucide-react for iconography.
  • CSS-only motion. No animation library in the page itself.
  • Chivo and Sometype Mono, self-hosted variable woff2, 48 KB for both and no request to Google.
  • Playwright driving screenshots, verification and the before-and-after comparison builds.
  • Vercel hosting.
06

Integrations & Backend

  • Configurable quote endpoint via VITE_QUOTE_ENDPOINT, with a pre-filled email fallback when it is absent or the POST fails.
  • No reCAPTCHA, no analytics and no third-party embeds in the concept build.
07

Performance / SEO / Accessibility

  • Fonts self-hosted as variable woff2, 48 KB for the pair, removing the Google Fonts round trip.
  • Photography re-encoded to WebP through a scripted build step.
  • Hero sequence encoded with every frame a keyframe so scroll scrubbing stays smooth, with a still fallback when motion is reduced.
  • The C4 footer badge and its animation library load only as the footer approaches the viewport, so they stay out of the initial payload.
08

Challenges & Constraints

  • Building trust pages for a business with no verifiable numbers. The answer was to render the gaps as ruled blanks, which makes the missing facts the owner’s first job rather than the designer’s invention.
  • Producing a night loading sequence with no source footage, without implying it shows their rig. The trailer carries no livery and the car no badge, and the disclosure is attached wherever the footage appears.
  • Replacing six manufacturer logos that carried real visual weight on the current site, using type and written names instead.
09

What I'd Improve Next

  • Collect the facts currently rendering as blanks: operating base, routes run, ABN, insurer and cover limits, and the trailer’s internal dimensions.
  • Reshoot the opening with the real rig, which is roughly twenty minutes of phone footage on a tripod, and drop the clips into the existing pipeline.
  • Wire the quote form to a live endpoint and confirm a real submission lands in an inbox someone reads.
  • Reverse the three indexing blocks and remove the concept markings if it ever becomes the live site.

Like what you see?

Every project starts with a conversation.

Start a Project