Skip to content
Submit Project Request
All Work
Client Engagement

A real engagement, documented by the team that engineered it. The client is not named, and nothing identifying or confidential appears.

The site for the company they're becoming

An authority website for a commodity logistics operator mid-expansion — engineered so the growth story is carried by verifiable structure, and an invented fact has no way to ship.

Commodity logistics·May 2026·6 min read
High-Converting WebsitesDigital Marketing & Brand StrategyNext.js 16 App RouterReact 19TypeScript (strict)Tailwind CSS v4Server Actions + ResendGoogle Places API

01 Context

A commodity logistics operator on Canada's Pacific Gateway: its own trucking fleet, transload yards, and warehousing, moving export commodities from inland producers into ocean containers. The company is established in one commodity vertical and midway through a deliberate expansion — rail infrastructure in development, yard capacity growing, a diversification roadmap into adjacent commodity classes.

The web presence had not kept pace with any of it. The buyers who matter here are procurement teams at exporters with serious annual freight budgets, and they research an operator the way they read an RFP response: skeptically, comparatively, watching for the claim that doesn't hold. The engagement was to build the authority site this next phase requires — services, industries, facilities, insights, and a meeting-request pipeline — to the standard those buyers apply.

02 The Constraint

The brief contained its own tension, stated plainly: the site had to present the company the operator is becoming without inflating past what a sophisticated buyer can verify. Three things made that genuinely hard.

No named clients could be disclosed at launch, so the conventional B2B proof structure — logo walls, attributed testimonials — was off the table. The previous site's anonymous testimonials had cost credibility rather than added it. Second, much of the growth story was still in motion: infrastructure mid-permitting, figures awaiting the client's confirmation. The facts existed, but they arrived on the client's schedule, not the build's. Third, this audience punishes inflation. Superlative vocabulary that works on a consumer landing page reads, to a freight procurement desk, as a warning sign.

So the operational problem underneath the design problem: build institutional weight from a limited stock of publishable, verifiable facts — and make it structurally impossible for an invented one to ship.

03 The System Engineered

Voice as an enforced rule set, not a style preference. The brand voice was committed to the repository as testable rules: numbers over adjectives, active voice, industrial vocabulary used correctly, and a standing test — if a paragraph could not appear in a procurement RFP response without feeling out of place, it got rewritten. Alongside it, a banned-vocabulary list and an anti-pattern list for the interface itself: no hero carousels, no animated number counters, no sticky mobile CTA bar. Enterprise buyers research from desks; the bar would read as retail. Every build session loaded these documents before a line was written.

A trust system engineered to replace testimonials. With named clients unavailable, proof was rebuilt as layered, independently checkable standing: regulatory position as an approved lessee of the federal port authority operating on federal port lands, the operating record, physical capacity, capital investment in progress, certifications. Each layer is a claim a procurement team can verify; none is a quote from an unnamed satisfied customer. The one voice-of-customer element is pulled live — Google reviews fetched server-side through the Places API and displayed with their actual ratings. That client code refuses to run on placeholder configuration: until a verified Place ID is supplied, the section does not render at all.

An expansion tracker instead of a bigger adjective. The center of the becoming problem got an architectural answer, not a copy answer: a public capital-projects page that publishes in-progress infrastructure — a rail spur in active development, an approved yard expansion — through a typed status model (active development, approved, planning) with scope and strategic rationale per project. Construction underway is the one form of future tense a skeptical buyer accepts, because it can be checked. The same idea runs through the information architecture: industry pages ship with explicit active and expanding states, so diversification is presented as labeled trajectory rather than implied scale.

Placeholders that cannot pass as facts. The build rule with the longest reach: no fact may be invented, ever. Where a real datum was missing — a date, a number, a contact detail — the code ships a terse, bracketed NEEDS tag, visible and unmistakable in the rendered page, with business contact details centralized in a single source-of-truth module. Dozens of these tags stood in the codebase at the end of the build phase, each one a typed request to the owner for exactly the data required. The failure mode this buys is the right one: a missing fact renders as an obvious hole to fill, never as plausible-looking fiction in front of a buyer.

Content as typed code. Everything the site asserts lives in strict-TypeScript content modules — services, industries, facilities, and articles are each typed data structures, compiled with the site. We rejected a headless CMS (an editing surface nobody asked for, and one more place for facts to drift) and rejected loose copy scattered through components. The gain is reviewability: every published claim about the business is diffable in one file per page, and a malformed claim is a type error before it is ever a live page.

A stack chosen for the standard it holds. Next.js App Router on React 19, Server Components by default, strict TypeScript with no any, Tailwind v4 with the design system expressed as theme tokens. The tokens encode the same restraint the voice demands — a deep forest-and-slate palette in which the bright brand accent is capped at roughly five percent of any viewport: punctuation, not paragraph. Forms post through Server Actions to Resend with server-side validation, a honeypot, and per-IP rate limiting — no third-party form vendor holding lead data, no client-side fetch to an API route. Motion is one intersection-observer reveal primitive that honors prefers-reduced-motion; no parallax, no scroll-jacking.

Readable by machines as carefully as by buyers. B2B research now runs through AI assistants as often as through search results, so machine readability was treated as a first-class surface: a JSON-LD graph on every page spanning organization, service, article, and FAQ types; a robots policy that explicitly admits the major AI crawlers; llms.txt route handlers describing the site's structure; and article FAQ and summary blocks written as direct answers under question-format headings.

Images from a pipeline, not a stock library. Stock photography sat on the anti-pattern list. Instead, a declared slot manifest lists every image the site needs with dimensions and acceptance criteria; a Python pipeline generates candidates against those criteria, processes them to AVIF and WebP at multiple breakpoints, and writes a manifest sidecar per slot that components import — dimensions come from data, so layout never shifts while images load. Load-time, layout-stability, and page-weight budgets were written into the brief as non-negotiable targets before the first page existed.

04 What Changed

What shipped is a roughly thirty-route authority site: four service pages, four industry pages carrying their active and expanding states, facility pages, the public capital-projects tracker, six anchor articles with structured FAQ and summary blocks, and a meeting-request pipeline running entirely on first-party infrastructure.

Its engineered properties are the point. Every claim on the site traces either to a typed content module or to a visible placeholder awaiting the client's real datum — inflation is not merely discouraged by a style guide; it has nowhere in the code to live. The proof system carries institutional weight without a single named client. The growth story rides on checkable structure — status-tracked projects, labeled expanding industries — instead of adjectives.

And the build is shaped for what comes next. As capital projects complete, tracker statuses advance rather than the story being rewritten; as new commodity classes come online, expanding flips to active; when client disclosure unlocks, named case studies have an architecture waiting for them. The site was engineered so the company can grow into it — which was the brief.

Details that would identify the client have been withheld; every technical claim above is observable in the build.

BUILD YOURS

You've seen how we build.Now point it at your business.

Submit a project request. We'll bring the same engineering discipline to your highest-leverage system — and document it the same way.

Submit Project Request