Brand system v1.0, September 2026
Find the leak.
Cork it.
Workbridge finds where repeat work is leaking time and money out of an owner-run business, prices the leak, and corks it. We are a concierge practice, not a platform: a small bench of clients, a paid map before any build, and a named human who answers.
Strategy
A concierge practice for owners who are the bottleneck, sold as a paid map and never as a free build.
What we are
Find the leak. Cork it.
How the work goes
Three steps, in order. A client cannot buy the third without the second.
Step 1
Find
Sit with the week as it actually runs. Name the repeat work in the owner's language, not ours.
Step 2
Score
Put hours and dollars against each leak, then rank by what it costs to keep bleeding.
Step 3
Cork
Install the fix with the owner, not around them, so the team can run it after we step back.
Who this is for
Owner-operators of established service businesses — roughly $750K to $15M in revenue, 5 to 60 staff — where the owner is the bottleneck.
What makes an owner call
- Third hire in a row whose real job is paperwork
- Quoting, intake or scheduling is a week behind
- The owner does six-plus hours of copy-paste a week
- A system migration quietly broke a handoff
- Revenue grew, margin didn't
Who this is not for
Capacity is the product. Every client we cannot help is a seat taken from one we can, so the site is written to filter before it converts.
We say no to these
- Funded startups shopping for an engineering team
- Enterprises that need procurement, security review and an MSA
- Tool collectors who want a stack opinion, not a change
- Buyers sorting vendors by cheapest chatbot
- Anyone who wants free work to prove we are worth paying
The offer ladder
The only three things we sell. Each rung has a guardrail that the design has to hold.
| Rung | Offer | Price | What it buys | Guardrail |
|---|---|---|---|---|
| 1 | Free-15 | Freefifteen minutes | One leak, named in your words. | The gift is clarity, not labour. Nothing gets built on this call. |
| 2 | First Cork | $999solo, or $1,999 for a small team | The paid map. Three to seven scored leaks, in priority order. | First Cork buys the map. The Quick Win is one small fix we ship in the first seven days to prove it — if it doesn't give back five hours a week, we refund the map. |
| 3 | Concierge | From $1,000per month, 6 clients maximum | Done-with-you install, on a small bench. | Never skip the map into Concierge. No map, no install — no exceptions. |
Personality
Five adjectives, each one carrying what it rules out. An adjective that forbids nothing is decoration.
Calm
We lower the temperature in the room. The problem is ordinary and solvable.
Never: Urgency, countdowns, manufactured scarcity.
Exacting
We count the hours before we claim them, and we show the arithmetic.
Never: Round numbers with no source. “Up to 80% faster.”
Plainspoken
We use the words the owner already uses for their own work.
Never: Vocabulary that makes the buyer feel behind.
Accountable
A named person, a dated deliverable, and a refund on the table.
Never: “The team will circle back.” Success measured in vibes.
Neighborly
We behave like the best tradesperson in town: show up, clean up, say what it costs.
Never: Buddy-buddy familiarity, or selling to someone we can't help.
A calm, exacting neighbour who counts before they claim, speaks in your words, signs their name to it, and would rather lose the sale than oversell the fix.
Three pillars
Diagnosis is a deliverable
The map is the product, not a sales step. You own it whether or not you hire us to install anything.
Paid before discovery
Money changes the quality of attention on both sides of the table. It is the cheapest filter we have, and it protects the work.
Small bench, real answers
Six Concierge clients, two calls a month, Voxer in between. Capacity is a feature, and we say the number out loud.
How we sound
Our voice
- “You are losing about six hours a week to re-keying quotes. Here is the arithmetic.”
- “The map is $999. You own it whether or not you hire us to install anything.”
- “I don't think we're the right fit for this. Here's what I'd do instead.”
- “Two calls a month, Voxer in between, and I answer — not a team inbox.”
Six ways to lose it
Startup hype
“Revolutionary AI-native platform that 10x's your output.”
Corporate LinkedIn gloss
“Excited to announce we're unlocking synergies for our partners.”
Agency bravado
“We're a full-stack, award-winning growth partner.”
Guru urgency
“Only 2 spots left. Doors close at midnight.”
Free-build bait
“Free automation audit — we'll build your first agent at no cost.”
Robot voice
“As an AI concierge, I can help you streamline your workflows.”
Hard rules
Each rule and the thing it forces the design to do. A rule with no design consequence is a wish.
- Never pitch free automation or free builds
- No page ever carries the words free build, free pilot, free automation or free agent. Free-15 is styled as the quietest option on the page, never as the primary button.
- Diagnosis is not a build
- First Cork copy sells a map: scored opportunities, priority order, arithmetic. Build language (ship, integrate, deploy) belongs to Concierge.
- Map before install
- The Concierge card has no self-serve CTA. Its action reads “Requires a completed First Cork” and links back up the ladder.
- Pay before discovery
- Any button that leads to a calendar for real diagnostic work sits behind a price. The Free-15 calendar is capped at fifteen minutes and one named leak.
Logo
Three directions built from drafting shapes: a gap found and closed, a benchmark, a keystone.
Span & Plate
RecommendedA drawn baseline breaks, and a plate is seated over the break. The bridge and the cork in the same three shapes: a gap found, a gap closed.
It draws the offer rather than the category. Three shapes survive a 16px favicon, and the copper plate gives the brand one repeatable graphic device for section breaks, report covers and slide dividers.
Where it runs. Primary lockup everywhere: site header, report cover, invoice, avatar.
Risk. At very small sizes the gap can visually close. The favicon uses the two-shape reduction with the gap widened.
Datum
AlternateA surveyor's benchmark: a solid index triangle pointing at a measured line with tick marks. The mark says we measure before we touch anything.
Measurement-first, which is the argument for paying before discovery. Reads as an engineering practice stamp — closer to a chartered surveyor than a software vendor.
Where it runs. Alternate for anything about the map itself: discovery report cover, scorecards, methodology pages.
Risk. Generic at small sizes if the ticks are dropped. Never render it without at least three ticks.
Keystone
AlternateA thin-line segmental arch with the keystone picked out in copper. The one piece that carries the load — the Quick Win that holds the rest up.
Civic and durable. Best where longevity and trust are the point, which is the Concierge conversation more than the first click.
Where it runs. Long-relationship surfaces: Concierge pages, client portal, printed matter.
Risk. Arches are bank and insurance territory. Must stay geometric, thin-line and unfilled — never gilded, never with a gradient.
Clear space
The dashed rule is a measurement, not artwork. Nothing enters that band — not a nav item, not a photo edge.
Minimum size
Below the floor, drop the wordmark and run the favicon reduction instead. It keeps the gap open at 16px.
Lockup rules
On every surface
- Keep clear space equal to the cap height of the W on all four sides
- Minimum wordmark width 96px on screen, 26mm in print
- Mark may run alone once the wordmark has appeared on the page
- Reverse lockup on ink, copper-500 for the accent shape
In no context
- Never set the wordmark as WorkBridge, workbridge or WORKBRIDGE
- Never stretch, outline, rotate or add a drop shadow
- Never recolour the accent shape to anything outside copper
- Never place the primary lockup on a photograph without a paper or ink plate behind it
Spelling lock
Capital W, lowercase b, one word — in the logo, in body copy, in the URL, in an email signature, in a podcast title card.
Colour
Warm paper and signed-contract ink, with copper held back for the thing that costs money.
Ink and warm neutrals
Structure, text and the paper everything sits on.
ink
17.50 on paper
ink-700
10.83 on paper
ink-500
7.00 on paper
stone-600
4.93 on paper
stone-500
3.33 on paper
stone
2.11 on paper
linen
1.19 on paper
paper
1.00 on paper
Copper
Primary. Money, action, the paid map. One appearance per view.
copper-100
1.17 on paper
copper-300
1.77 on paper
copper-500
2.96 on paper
copper-600
4.12 on paper
copper-700
6.05 on paper
copper-800
8.82 on paper
Harbor
Secondary. Measurement, scores and data, so numbers never compete with a call to action.
harbor-100
1.16 on paper
harbor-300
1.72 on paper
harbor-500
2.78 on paper
harbor-600
4.25 on paper
harbor-700
6.66 on paper
harbor-800
9.75 on paper
Moss
Tertiary. Recovered hours, shipped work, sealed leaks.
moss-100
1.15 on paper
moss-300
1.83 on paper
moss-500
3.49 on paper
moss-600
5.00 on paper
moss-700
7.49 on paper
Amber and brick
Semantic only. If nothing is wrong, neither colour is on the page.
amber-100
1.15 on paper
amber-500
2.88 on paper
amber-600
4.44 on paper
amber-700
6.42 on paper
brick-100
1.21 on paper
brick-500
4.65 on paper
brick-600
6.38 on paper
brick-700
8.76 on paper
What each hue is allowed to mean
A palette without permissions is just a mood board.
- Copper
- Primary. Terracotta and cork: money, action, the paid map. It appears once per view, on the thing the eye should land on.
- Harbor
- Secondary. Measurement, scores, data. Never a call to action.
- Moss
- Tertiary. Recovered hours, shipped work, sealed leaks.
- Amber and brick
- Semantic only. If nothing is wrong, neither colour is on the page.
Three limits that break pages
Documented as failures so nobody has to rediscover them.
- Copper-500 as a text colour on paper. It measures 2.96:1 and fails AA. Use copper-700.
- Copper as a button fill in the light context. The fill is copper-700.
- Amber or brick used decoratively. They mean something is wrong.
Light context
The default. Warm paper, ink type, copper for the one thing that costs money.
| bg#faf9f5 | Page. Warm paper, never #fff. | |
| surface#ffffff | Cards and plates that must lift off the page. | |
| text#141413 | All body and display copy. | |
| text-muted#57564f | Secondary copy, captions. | |
| action#9c4527 | Primary button fill and links. | |
| accent#d97757 | Graphic only — marks, rules, fills behind ink. | |
| border-control#6f6d64 | Inputs, checkboxes, selects. | |
| focus#9c4527 | 2px ring at 2px offset. |
Reverse context
Add .wb-reverse to any dark band. Role tokens re-point; components need no dark variant.
| bg#141413 | Dark sections, Concierge surfaces, footer. | |
| surface#1d1d1b | Cards inside a dark section. | |
| text#faf9f5 | Copy on ink. | |
| text-muted#b0aea5 | Secondary copy on ink. | |
| action#d97757 | Copper-500 carries ink text at 5.90:1. | |
| link#eab19a | Links on ink. | |
| border#33332f | Hairlines on ink. | |
| focus#eab19a | Ring on ink. |
Semantic states
Surface and text, both audited together.
Offer ladder colour
Loudness encodes the sales rule. If a redesign inverts this, the design is arguing against the business.
Contrast audit
Computed from the tokens as this page renders, so it cannot describe a value the site no longer ships.
python3 scripts/contrast.py check. Copper-500 is listed as a deliberate failure: documented once here so nobody rediscovers it in production.Typography
Poppins builds the structure, Lora does the talking, JetBrains Mono carries the evidence.
Poppins
Structure. 400, 500, 600, 700.
Find the leak.
A geometric sans with a circular bowl and no flourish. It sets prices, buttons and headings without raising its voice, and its even width keeps a number-heavy heading calm.
Helvetica Neue, Arial as fallback
Lora
Voice. 400, 400 italic, 500, 600.
We sat with your Tuesday.
The serif is the practice. It reads like a letter from someone who came to the shop, which is the one thing a product landing page cannot fake.
Georgia, Times New Roman as fallback
JetBrains Mono
Evidence. 400, 500, 700.
6.4 hrs/wk
Numbers a client could check are set in mono so they look measured rather than marketed. Tabular figures keep a scorecard in column.
ui-monospace, SF Mono as fallback
Scale
Twelve steps on a 4px grid with a 16px floor. One display size per viewport.
Homepage hero only. One per page.
Section openers, pricing page hero.
Page titles on interior pages.
Major sections.
Offer names, card titles.
Sub-sections, question headings in FAQ.
Hero subhead and standfirsts. Lora at 18 is the brand's speaking voice.
All running copy. Measure capped at 68 characters.
Card copy, list items, form help text.
Prices in tables, hours recovered, guarantee footnotes.
Form labels, button text, table headers. Sentence case, never uppercase.
Drafting marks inside an exhibit: sheet numbers, dimensions, redaction notes. Never stacked above a heading.
Hierarchy in context
Find where your week leaks.
Workbridge maps the repeat work eating your hours, scores it by what it is costing you, and corks the worst of it first. The map is paid, and it is yours either way.
$999 solo. Quick Win in 7 days or refunded.
Rules
- Poppins carries structure — headings, buttons, labels, badges. Never set a paragraph in it.
- Lora carries the talking — every sentence a human is meant to read slowly. The serif is what keeps us a practice rather than a product.
- JetBrains Mono carries evidence — hours, dollars, scores, dates, file names. If it is a number a client could check, set it in mono.
- One display size per viewport. Two competing 48px headings read as a landing page, not a letter.
- Body copy never exceeds 68 characters per line, and never drops below 16px.
- Tracking: −0.02em on display sizes, 0 on body, +0.14em on uppercase annotations. Never letterspace lowercase Lora.
- Uppercase is a drafting annotation, not a label. It belongs inside an exhibit — a sheet number, a dimension, a redaction note. A tracked-out capital label stacked above every heading is the house style of every other AI company; sentence case is ours.
Delivery
- Source
- Google Fonts, latin and latin-ext subsets only.
- Hosting
- Vendored to
public/fonts/as woff2 withfont-display: swap. Nothing is fetched from Google at runtime. - Fallbacks
- Poppins to Helvetica Neue, then Arial. Lora to Georgia. Mono to SF Mono, then Menlo.
- Weight
- 22 files under 500KB. Re-run
npm run fontsto change the set.
Voice and tone
Say the number, say the price, say the thing we will not do. Then stop talking.
Homepage hero
Live copy, ready to lift.
Ship this
Find where your week leaks.
Workbridge maps the repeat work eating your hours, scores it by what it is costing you, and corks the worst of it first. The map is paid, and it is yours either way.
Reject this
🚀 AI-POWERED AUTOMATION PLATFORM
Unlock 10x Productivity With AI Agents
Our cutting-edge AI solutions seamlessly transform your business operations. Book a free automation audit and we'll build your first agent at no cost!
The wrong version promises a free build, sells a category instead of an outcome, and gives the owner no number they can check. The right version names the leak, prices the map, and puts the free option second where it belongs.
Free-15 CTA
Live copy, ready to lift.
Ship this
Fifteen minutes, one leak named.
Tell us how the week actually runs. We'll name the biggest place it leaks, in your words, and tell you straight whether we can help. No build, no proposal, no follow-up sequence.
Reject this
⚡ LIMITED SPOTS — ONLY 2 LEFT
Free AI Audit + Free Custom Agent
Claim your complimentary automation audit and we'll build a custom AI agent for your business — completely free. Only 2 spots left this week!
Free-15 gives away clarity, never labour. The wrong version breaks three hard rules in four lines: a free build, fake scarcity, and a diagnosis given away before anyone has paid for attention.
Pricing note
Live copy, ready to lift.
Ship this
$999 solo. $1,999 small team.
That buys the map: three to seven leaks, scored, in priority order, with the arithmetic behind each one. In the first seven days we ship one Quick Win. If it doesn't give you back five hours a week, we refund the map. Installing the rest is a separate decision, and we will tell you honestly if you don't need us for it.
Reject this
PRICING
Flexible Packages For Every Stage
Start with a free discovery call and we'll build you a custom workflow at no cost to show you what's possible. Packages start at just $999/mo — cancel anytime, no commitment!
Discovery is never free and a build is never a sales gift. The right version states the price, the deliverable, the guarantee and the exit — including permission to not hire us for the install.
Word list
Load-bearing vocabulary, and what it displaces.
Use
Avoid
Micro-copy rules
The six that catch most drafts.
- Numbers instead of adjectives. “Five hours a week” beats “dramatically faster.”
- Say the price on the page that asks for the click.
- Use their nouns: the intake sheet, the quote folder, Tuesday dispatch — not the CRM pipeline.
- A client is an owner or a team, never a user.
- The outcome is recovered hours, not an automation. Automation is a thing we install, not a thing we sell.
- Name a human wherever a commitment is made.
One more, for the writer who inherits this. If a sentence would read the same on any AI vendor’s site, delete it. Nothing generic survives a first draft here.
Imagery
Blueprint and industrial precision. We show the drawing the client paid for, not a picture of the client.
The direction, and the one it beat
What a client pays for is a drawing: a marked-up map of their own operation. Blueprint imagery shows the deliverable, and measurement is the whole argument for paying before discovery. Warm-operator photography shows the buyer instead — flattering, but silent on what they get, and the genre is three stock shots deep in smiling contractors holding tablets. Warmth is already carried by the palette, the Lora body copy and the plainspoken voice, so the imagery is free to do the one job words cannot: prove we measure.
Principles
- Show the deliverable, not the technology. A marked-up drawing beats any picture of a screen.
- Copper is the annotation colour and appears once per image — it marks the leak, nothing else.
- Hairlines and flat fills only. No gradients, no glow, no glass, no 3D renders, no isometric clip-art.
- Warm paper as the ground. Every image should look printed rather than lit.
- If a number appears in an image, it must be a real number from a real engagement, redacted but never invented.
- Photography, when used, is straight-on or 45°, daylight, no flare — physical instruments on paper, not people at desks.
Never
If a competitor could use the exact picture, it says nothing about us.
- Robot handshakes
- Humanoid androids
- Glowing brains
- Neural-net node clouds
- Circuit-board traces
- Blue holographic UI
- Hooded hacker at a terminal
- Rocket ships and lightbulbs
- Floating chat bubbles over a stock team
- Gradient mesh backgrounds
Exhibit A. The drawing at the top of this board
The client's own week, drawn flat, with the leak circled once. It opens the brand because it is legible in four seconds, uses the client's nouns, and proves we counted.
Exhibit B. Scorecard plate
| Rank | Leak | Hrs/wk | Per month | Effort |
|---|---|---|---|---|
| 1 | Quotes re-keyed into the CRM | 6.4 | $1,850 | Low |
| 2 | Tuesday dispatch built by hand | 4.1 | $1,190 | Low |
| 3 | Intake calls not logged until Friday | 3.0 | $870 | Medium |
| 4 | Supplier invoices matched line by line | 2.2 | $640 | Medium |
| 5 | Monthly report assembled in three tabs | 1.5 | $430 | High |
Exhibit C. Before and after tally
7.0 hrs/wk recovered
Shot list
Six repeatable set-ups.
- Marked-up process drawing
- The client's real week drawn as a flow, red-lined in copper where it leaks. The hero image of the brand.
- Scorecard plate
- Three to seven opportunities as a drafted table: hours lost, dollars attached, effort to fix.
- Before / after tally
- Two columns of hours in mono, the left column struck through. No percentages.
- Quick Win detail
- One step drawn at large scale like a joinery detail — the seven-day fix, dimensioned.
- Instrument macro
- Dial gauge, tape, caliper, spirit level. Straight-on, warm daylight, on paper. Measurement as metaphor.
- Redacted screen in a drafted frame
- A real screenshot, blocks of ink over client data, set inside a hairline plate. Never a fabricated dashboard.
Ground texture
Photography spec
If a camera is involved.
Subject
Instruments and paper. Hands only when they are measuring something.
Light
Warm daylight, single source, soft shadow. No flare, no rim light.
Angle
Straight-on or 45 degrees. Flat lay on warm paper stock.
Grade
Warm neutral, low contrast, grain over gloss. No teal shadows.
UI kit
shadcn/ui primitives restyled onto the tokens, plus the one pattern the business depends on.
Buttons
5px radius, Poppins labels, no pill shapes.
Sizes
32, 40, 48px
States
Badges
The only pill shape in the system. Offer badges are never restyled per page — a visitor should recognise the rung from the corner of their eye.
Reverse context
Form fields
The Free-15 booking form, as built.
This decides whether the map is $999 or $1,999. Nothing else changes.
In your words. We will use them back to you.
That address is missing a domain.
Card variants
Hairline first, shadow almost never.
Field rules
Accessibility, not taste.
- Borders are stone-600 at 4.93:1. Never a hairline on an input.
- Labels sit above the control and stay visible. No placeholder-only fields.
- Help text is Lora; labels and values are Poppins.
- Errors name the fix, not the failure: “missing a domain”, not “invalid”.
- Focus is a 2px copper ring at 2px offset, never removed.
The offer ladder
One component, three rungs, the sales rules built in. A future page cannot accidentally promote the free tier, because the card will not let it.
A short call and a straight answer. We listen to how the week runs, then name the single biggest place it leaks. You leave with clarity you can act on alone.
- 15 minutes, one call
- One leak named, in your language
- A yes or no on whether we can help
- No build
- No proposal
- No follow-up sequence
The gift is clarity, not labour. Nothing gets built on this call.
We spend real time inside the week, then hand you a discovery report: every opportunity scored by hours lost, dollars attached and effort to fix. You own the map either way.
- Discovery report, 3–7 scored opportunities
- Hours and dollars behind every score
- Priority order and what it takes to fix each one
- Quick Win shipped inside 7 days
- No build engagement scoped or promised here
First Cork buys the map. The Quick Win is one small fix we ship in the first seven days to prove it — if it doesn't give back five hours a week, we refund the map.
We install the corks alongside your team so they own the running of it. Two calls a month, Voxer between, and a named person who answers. The bench is capped at six because attention does not scale.
- Two calls a month
- Voxer access between calls
- Done-with-you install, your team keeps the keys
- Standing review of what the corks recovered
- Not available without a completed map
Never skip the map into Concierge. No map, no install — no exceptions.
src/components/patterns/offer-card.tsx
Handoff
Everything on this board is a file in this repository, not a screenshot of one.
What ships
- styles/tokens.css
- Every value the site needs, as CSS custom properties. Import once, in the root stylesheet.
- tokens/workbridge.tokens.json
- The same values in DTCG format for Figma, Style Dictionary or a native client.
- public/logo/*.svg
- All three directions: primary, reverse, mark and favicon, as optimised SVG.
- public/fonts/ + styles/fonts.css
- Poppins, Lora and JetBrains Mono, latin subsets, self-hosted. No runtime call to Google.
- src/components/ui/
- The UI kit: shadcn/ui primitives restyled onto Workbridge tokens, including the offer badges.
- scripts/contrast.py
- The contrast audit. Run it in CI; it fails the build if a documented pairing drops below AA.
Download
The two files a developer needs.
The CSS is the runtime source of truth. The JSON carries the same values in DTCG format for Figma variables or Style Dictionary.
Build the site in this order
Each page earns the next one. The sample map comes early because the deliverable sells the deliverable.
- 1Home — hero, the three-rung ladder, mechanism, one proof number, Free-15 in the quiet slot
- 2First Cork — what the map contains, the Quick Win guarantee, the refund in plain words
- 3Concierge — the bench of six, what done-with-you means, gated behind a completed map
- 4Free-15 — fifteen minutes, one leak, and the three things it is not
- 5Sample map — a redacted discovery report, because the deliverable sells the deliverable
Accessibility contract
- All 53 documented colour pairings pass WCAG 2.1 AA; run scripts/contrast.py check before shipping a new colour.
- Copper-500 is a graphic colour. It never carries text on paper (2.96:1) and is never a button fill in the light context.
- Focus is always visible: 2px copper-700 ring at 2px offset on paper, copper-300 in reverse.
- Body copy never below 16px, line length never above 68 characters.
- Form controls use stone-600 borders (4.93:1) — never a hairline border on an input.
- Motion is 120–200ms with no overshoot, and respects prefers-reduced-motion.
Do not ship
Six lines. A page that passes these and the contrast audit is on-brand enough to publish without a review call.
- Any phrase containing “free build”, “free pilot”, “free automation” or “free agent”
- Free-15 styled as the primary button
- A Concierge signup that does not check for a completed First Cork
- A countdown, a spot counter, or any scarcity device other than the plain sentence “the bench is capped at six”
- Stock AI imagery from the never list
- The wordmark set as WorkBridge
- A tracked-out capital label stacked above a heading — uppercase belongs inside a drawing, not on the page
Open questions for Rashid
Four decisions the board cannot make on its own.
- Pick one logo direction. Span & Plate is the recommendation; Datum and Keystone stay in the file as alternates, not as a rotating set.
- Confirm the Quick Win wording. The board says First Cork buys the map and the Quick Win proves it — if the refund policy needs different language, it changes three pages.
- Decide whether the bench count is rendered live or set by hand. A stale “2 seats open” is worse than no number at all.
- Name the human who signs the Concierge commitment, because the voice requires a name wherever a promise is made.