Writing
Engineering
/Sertan Helvacı/9 min read

Design Rules Should Travel With the Work, Not the Tool

AI assistants can move fast on frontend work.

The question is whether they can keep moving in the same product direction your team already chose.

Pathrule
Pathrule routes scoped team knowledge into AI coding sessions.

What this covers

  • Design rules need to be available to AI coding assistants at the moment frontend work happens.
  • A design system is not only a component library. It also includes product taste, interaction rules, accessibility expectations, and brand boundaries.
  • Pathrule can store design memories, rules, and skills as team-written knowledge and route them to the relevant paths.
  • Because Pathrule does not store repository source code, teams can trial design-context workflows without uploading their codebase.
  • The article frames Pathrule as a way to keep Claude Code, Cursor, Codex, and MCP-compatible tools on the same product line.

Comparison

AreaDesign doc onlyPathrule design context
Tool behaviorEach assistant depends on what the prompt repeatsAssistants receive the same scoped design rules
ConsistencyReviewers catch drift after the UI is builtRules shape the work before the first component lands
OwnershipDesign guidance lives in scattered docs and commentsTeam-written memories, rules, and skills have a clear home
AdoptionEach tool needs separate prompting habitsClaude Code, Cursor, Codex, and MCP-compatible tools can share the same product context

Design knowledge worth routing

  • Component usage rules that should not depend on memory.
  • Spacing, density, and layout expectations for a product surface.
  • Accessibility requirements for forms, menus, modals, and keyboard paths.
  • Brand voice boundaries for empty states, errors, onboarding, and public pages.
  • Interaction rules for repeated workflows like filters, bulk actions, editors, or review screens.
  • Design review patterns that frontend agents should follow before changing shared UI.

Design systems do not end at components

A component library is a good start. It gives teams reusable parts, named variants, and a shared visual language.

But real product consistency lives between the components too. It lives in density choices, spacing habits, empty-state tone, keyboard behavior, form validation patterns, loading states, destructive-action review, and the small calls that make one screen feel like it belongs with another.

Those rules are often known by the design team and a few senior frontend engineers. AI coding assistants do not automatically know them.

AI frontend work makes drift cheaper

When a human engineer builds a UI slowly, design drift is easier to notice during the process. When an AI assistant can generate a full surface in minutes, drift can arrive fully formed.

The code may compile. The layout may look polished in isolation. The problem is that it may not feel like your product.

A button label can be slightly off. A card can use the wrong density. A settings flow can introduce a new interaction pattern. A marketing section can sound like a different company. None of these is catastrophic alone. Together, they erode trust.

Prompting is not a design governance model

Teams often respond by adding design instructions to prompts. Use the design system. Follow our style. Keep it accessible. Match the existing UI.

Those reminders help, but they depend on the person prompting the tool. They also disappear or mutate across Claude Code, Cursor, Codex, and other AI coding workflows.

The more serious version is to treat design guidance as team knowledge. It should have ownership, scope, and a delivery path.

Pathrule can route product taste by path

Pathrule stores team-written memories, rules, and skills. For design work, those primitives map naturally to the way product teams already think.

A memory can explain why a dashboard uses dense controls instead of marketing-style cards. A rule can require accessible labels for icon-only controls in a shared toolbar. A skill can define the checklist an assistant should follow before changing a complex settings screen.

The important part is that this knowledge can be scoped. A public landing page, an internal dashboard, a billing flow, and a mobile onboarding surface should not all receive the same design instructions.

Tool choice should not change product taste

If one engineer uses Claude Code, another uses Cursor, and another uses Codex, the product should not start reflecting three different design memories.

That is the same fragmentation problem teams already face with engineering rules. Design rules need one home so different assistants can start from the same product context.

Pathrule is meant to be that shared layer. The team writes the design guidance once, scopes it to the relevant paths, and lets supported AI coding tools receive it when the work calls for it.

Privacy matters for design too

Design context can include sensitive product direction, internal workflows, and early positioning. Teams should be careful about where that knowledge goes.

Pathrule keeps a clear boundary: it does not store your repository source code. It stores the memories, rules, and skills your team intentionally writes down.

That makes it practical to try a design-context workflow without creating another copy of your codebase in a vendor system.

A practical first step

Start with one product surface where AI-generated UI tends to drift. Write three things: a memory describing the product intent, a rule for the most important design constraint, and a skill that defines the review checklist.

Then run real frontend tasks across the tools your team already uses. Watch whether review moves from subjective correction to clearer questions: did the assistant follow the density rule, did it reuse the right pattern, did it preserve the interaction model, did it keep the product voice?

If you want help setting up that first design-context workflow, write to [email protected].