Branding and creative design that survives contact with a website

What a brand has to survive

A logo is signed off at full size, on a white slide, by people who already know what the company does. It then has to work at 16 pixels in a browser tab, as a circular avatar, reversed on a photograph, printed on a van and embroidered on a shirt. Most identity problems are not taste problems; they are drawings that were never tested anywhere except the presentation.

Colour is a measurable thing

Every pairing in the palette is checked against the WCAG 2.2 AA contrast ratios before the palette is agreed: 4.5:1 for body text, 3:1 for large text and interface components. A palette that fails gets changed during the design, which is cheap, rather than during the build, which is not, and it is the reason the brand on the site ends up matching the brand in the document.

Guidelines written to be used

The audience for a brand guideline is a developer implementing a page, a printer setting up a job, and whoever posts on social on a Friday afternoon. So it contains hex values, spacing rules, file locations, the rules for the awkward cases and a short list of what not to do, rather than an essay about the brand’s values.

From guideline to build

On the Brand + Digital tier the output is a design system: tokens, components and key screens that the website consumes directly. That is what prevents the familiar outcome where the identity is beautiful, the site is close enough, and nobody can say exactly when they stopped matching. Starting prices for all three tiers are published on the offers and pricing page.

A logo is not a brand system

Most identity work is bought as a logo and needed as a system. A mark on its own survives a business card and falls apart the first time somebody has to build a slide, a social post, an email header and a shopfront sign from it — at which point four people make four different decisions and the identity quietly stops existing.

What prevents that is a small amount of structure: the palette with its accessible pairings, the type scale, the spacing rule, and one page that says what to do when a situation is not covered.

Branding and design, in practice

• Colour pairings checked for contrast, so the identity is usable as well as attractive
• A usage guide written for the people who will actually apply it
• The system carried into the website rather than stopping at a PDF

See website development for how an identity is carried into a build, and creative design services for what a system contains.

How this work usually starts

Identity work starts with where the brand has to appear. A business that needs a logo, a palette and a deck is a different job from one that needs signage, packaging and a storefront, and pricing either as the other is how identity projects go wrong in both directions.

Two things decide whether an identity survives its first year: whether the usage guide was written for the people applying it, and whether the system reached the website. A brand that lives only in a PDF is a brand nobody can follow.