Guide / Design systems & AI

What coding a brand actually means.

Coding a brand means turning a designer’s decisions into rules, components and layouts that production tools can use. An agent can then work with explicit context instead of interpreting a brand book for every brief.

01Start with a real request

Choose a frequent deliverable before choosing a tool: a LinkedIn feature announcement, for example. The brief defines the message, audience, formats, authorised assets and reviewer. This scope lets you check whether the system meets a real team need.

Output: a reference brief and a list of expected deliverables.

02Separate constants from variables

Typography, colours and logo usage form a stable foundation. The headline, product visual and call to action change with each brief. Layouts define margins, text hierarchy, variants and length constraints. The system should state both what can change and what must stay consistent.

Output: explicit rules, components and a few approved layouts.

03Organise a source of truth

A GitHub repository can bring rules and source files together, keep a history of changes and make corrections shareable. It does not automatically replace the design tool. Visual files and code must reflect the same decisions, with someone responsible for maintaining them.

Output: a clear file structure, usage documentation and an owner for changes.

04Give the agent the right context

MCP is an interface that lets a tool or agent access resources and functions. In this workflow, it helps retrieve the rules, components and layout that fit the brief. It does not invent art direction or guarantee consistency on its own: that depends on what the designer has made available.

Output: a traceable path from brief to selected resources and an editable file.

05Keep review and source files

An exported image alone is not a production system. Teams need to review the message, adjust the layout, locate the components and create a variant. Before delivery, they check copy, overflow, formats, media rights and compliance with brand rules.

Output: editable sources, exports and an identified approval.

06Measure the full cycle

Compare the same type of request before and after: time from brief to approval, revision rounds, brand corrections and adaptation time. Use these measurements to decide what to automate next. A fast export that needs extensive rework does not solve the production problem.

Output: a pilot review and a prioritised list of improvements.

A sample brief for a pilot

We are launching a feature for finance teams. Create a LinkedIn announcement and a sales slide from the same message. Use approved components, keep the source files editable and have the marketing lead review the result before export.

Illustrative example: this brief demonstrates the method, not a client result.