Playbook · Method & Colophon

This is how I do strategy. The site is the worked example.

How I read a brief, how I build a pitch argument, where I look for evidence. Then the design system and the build behind this site.

01

Why this page exists

A strategist who cannot show their working is asking you to take the strategy on faith. This page is the working. Method first, then the design system and the build behind the site you are reading it on, documented the way I would hand it to a client.

For the argument itself, start with the model. This one is about how the work gets made.


02

How I read a brief

On every brief, I work these out before I write any of the answer.

The questionFind the one under the brief
A brief asks for a channel plan by a date. Underneath it sits a business problem: demand is thinning, a competitor got cheaper, the board wants growth the current mix cannot give. Answer the brief and you are a supplier. Answer the problem and you are a strategist.
The audienceBefore the channel, every time
Start with who buys and what they already believe, then look at what they are doing instead of buying. Those answers decide the strategy. Channel choice is downstream of them.
The numberName what has to move
A strategy has to move a number a finance director recognises, revenue or margin. I name it in the first meeting and write it on the plan, so everyone is arguing about the same target.
The categoryRead it before adding to it
I read what the category already claims and what it costs to say the same thing, then look for the ground nobody has claimed. Positioning is a bet, and the category sets the odds.

Positioning is a bet, worked through →


03

The argument, not the deck

A pitch is one argument told by several voices. The insight names the problem, the strategy answers it, the plan prices it, the numbers close it. I write that chain before anyone opens a slide, and every page that fails to serve it gets cut, however good it looks.

A pitch is a conversation you have prepared for, and the deck is there to support it.

Everyone presenting should be able to say, in one sentence, what the client should do and why. If the sentences differ, the pitch is not ready.


04

Where I look for evidence

I plan from the dashboards the activation team runs, because brand health shows up there first. Branded and generic search, split apart, show whether a brand is creating demand or only collecting it. Share of search moves before revenue does. When cost per acquisition climbs and the account has not changed, the cause usually sits outside the account.

Benchmarks describe the average, so I lead with the client's own data and pull in industry numbers where it runs out. Audience research counts as evidence too, because what buyers believe about a category is checkable.

The essays run this method in public: why your CAC keeps rising, what a 70/30 split costs, and why attribution flatters the last click.


05

The compounding

I came to brand strategy from the build side. I have sat in the rooms that argue over a budget, not only the room that signs it off.

I studied Digital Design and Electronic & Computer Engineering at Brunel, a joint degree. I founded and ran Clover Boutique, a DTC homeware brand, through Covid. It sold 5,000 units in its first six months, and I did its positioning, its store, its creative and its paid acquisition myself.

Then performance media, at Mindshare (GroupM), then Brainlabs, now WeDiscover. That is where I learned what a media auction rewards, and why the number on Monday wins every argument in the room.

The Brand Trilemma comes from watching one finite budget argued over from the design, build and media seats.


06

The model

The mark and the idea are the same object, an equilateral triangle with Equity at the top. Drag the point and the mark redraws to match the allocation.

compounds Equity harvest now Activation recognisable Identity

A balanced split. Rare, and usually a sign of a big budget or a very deliberate hand.

Equity 34% Activation 33% Identity 33%

 

Drag the point, tap inside the triangle, or pick a preset. Arrow keys nudge it.

The full construction, the reduction ladder and the reasoning →


07

Colour

Six tokens. One accent. Click any swatch to copy its hex.

Flip the theme and watch every value re-map


08

Type

Three families, each doing one job. All self-hosted, all Open Font License.

DisplayBricolage Grotesque500 / 600 / 700

Brands starve the corner that compounds.

A grotesque with a chipped, human edge. I use it for the headlines and the mark.

BodySpectral400 / 400 italic / 600

Performance captures demand that already exists. It cannot make the demand that is not there yet.

A serif built for screens and long reading. Rigour reads better in a serif. It reads like an essay.

LabelsIBM Plex Mono400 / 500

BRAND & COMMS STRATEGY · 25 JUL 2026

Eyebrows, meta, chart labels. The engineered texture. I designed this site by hand.


09

The brand decisions

DirectionEditorial Provocateur
Text-forward, monochrome plus one sharp accent. The provocation is in the ideas and the headlines, not the styling, so the decoration stays minimal. It is a serious argument, set plainly.
The markAn argument with its conclusion removed
Not the triangle from the interactive tool. Three plotted points with the top one left empty, like a therefore sign with its conclusion removed. The full construction is on the logo page.
One accentOxblood on bone
One accent keeps the design disciplined. Oxblood is blunt and a bit bloody-minded, and it does not read as tech-startup blue. I use it only to mark a claim or point to a link.
Light and darkBoth, tokenised, no flash
Every colour is a CSS variable. The theme is one stored key, written only when you click. Toggle it and every colour swaps with no reload and no flash of the wrong theme.

Test the light/dark decision yourself


10

The build decisions

Astro, staticZero JS framework
No React and no client-side framework. Hand-written CSS on design tokens, static HTML that ships as-is. Under 15KB of JavaScript per page.
Self-hosted fontsSubset woff2, OFL
Three families, eight faces, subset to the exact glyphs the site renders (arrows included, so nothing renders as a blank box). No Google Fonts call and no third-party request, so no privacy leak.
InteractivityModel-as-tool
The Brand Trilemma is a tool you operate, and every interaction is there to serve the argument. If moving a control changes no claim, I cut it.
The codeAI-assisted, decision-led by me
I wrote the code here with an AI assistant. It is an efficiency tool. It types fast. It does not decide what to build. Every token, layout, interaction and trade-off is mine. I have hand-written production code since before generative AI existed. I direct the tool and fix what it gets wrong.
Privacy by designCookieless, no banner
No analytics, a single functional storage key, disclosed. Nothing non-essential is stored, so there is no cookie banner. GDPR/PECR is built into the architecture from the start.
HostingOwn the stack
Built and served first on my own hardware over a private network, then published to the edge from the identical build. I set up the DNS and the hosting myself.