Wuizard for agencies: one design sheet per client

Agency work with an AI coding agent has a particular failure mode. The agent is quick, but it has one idea of what an app looks like, and it brings that idea to every client. Worse, when you switch from one client's repo to another, the habits of the last project come with it: a familiar shadow, a spring that was right for someone else, a button shape the new client never asked for.

Wuizard keeps each client's design system in its own sheet, and your agent reads the sheet you point it at. This page covers how agencies use that, from the first brand conversation to the handover, and where it falls short.

One sheet per client#

A sheet is one project's design system. It holds the foundations (colour, type, radius, spacing, shadows and a motion spring), slots with one chosen component each (button.primary, transition.modal, feedback.toast and so on) and short rules the agent follows on every screen. The usual setup is one sheet per product or client.

Once your agent is connected over MCP, list_sheets shows every sheet and marks the active one. Every tool also accepts a sheet name or id, so a prompt can name the client's sheet outright instead of relying on whichever one was active last. That one habit removes most of the cross-client bleed.

Starting from the client's brand#

Clients arrive in different states, so there are three ways in:

• They have a live site. Paste the URL into Extract. It reads the colours, type, radii and motion into a starting sheet and matches them to library components. It copies values, never code, and it only reads public sites. A screenshot works too, but gives only the palette.
• They have brand guidelines. Type the exact values into the sheet's Foundations: the colours, display and body fonts, radii, spacing unit, shadow style, icon style and motion.
• They have nothing yet. Describe the client and their audience to the sheet designer. It sets colours, fonts, radius and motion and suggests components for your slots, and every choice can be changed afterwards.

Either way, a coherence check warns when components clash with the foundations (say, a bouncy spring in a strict editorial sheet) and offers a swap. Browsing the colour palettes in the library is a quick way to test a direction before you commit. The guides to extracting a design system from a website and describing your app to the designer walk through the first and last starting points.

Show the client before you build#

Turn on a share link for the sheet and send it. The page opens without an account and shows a demo app built only from the sheet, its foundations, the component in each slot and the rules the agent will follow. Your client sees the motion as well as the colours, which is hard to get across in a static mock-up.

If you're still choosing components, collect candidates into a collection and share that instead: every component on the page runs. You can turn a link off or reset it at any time, and resetting stops the old address working.

Building with the agent#

Day to day, the work looks like normal agent-driven development, with the design decisions already made:

• get_sheet before UI work, so the agent knows the foundations and rules.
• get_slot for each component, returned as React, Tailwind and Motion source with the client's values filled in.
• get_page for a landing, pricing, about, contact, blog or 404 page assembled from the sheet's section slots. Sections show neutral placeholder copy until the agent passes the client's real words, so no invented claims slip into a draft.
• check_ui before a screen is done. It lists colours, radii, springs, fonts, shadows or spacing outside the sheet, missing reduced-motion handling and hand-written copies of slotted components.
• translate_asset when a client isn't on React. It returns a slot in Vue, Svelte, SwiftUI or vanilla JS with the same values.
• generate_media for app icons, logo marks, illustrations and backgrounds in the client's colours, saved to their sheet.

The MCP setup guide covers connecting Claude, Claude Code, Cursor and other clients.

Handing over#

At the end of an engagement, open the sheet and press Export. The zip holds CLAUDE.md and AGENTS.md, the tokens as CSS variables, JSON, a Tailwind v4 theme, a Tailwind v3 config and a Swift file, every slot's component rendered with the client's values, every whole page the sheet can build, slots.json, ATTRIBUTION.md and the sheet's generated media.

The CLAUDE.md it writes tells an agent to use the Wuizard server when it's connected and the exported files when it isn't. So the client's own developers, or the next team to work on the product, get the same rules your agent followed, whether or not they ever sign up. The export guide walks through each file and where it goes.

What to watch out for#

• A sheet belongs to one account. There's no shared editing across your studio today. A share link lets a colleague copy a sheet into their own account, but the copy doesn't stay in sync with the original.
• Extraction is a starting point. It reads values, not intent. Expect to adjust the result, and expect less from a screenshot than from a live URL: a screenshot gives only the colours, and type, corners and motion start from the closest vibe.
• Mature in-house systems. If a client already maintains a design system in code with a designer looking after it, point your agent at that instead. A sheet earns its keep where there's no system, or where the system stops short of motion.
• Some actions are metered. Lookups are free, while extraction, translation, reviews, AI search, designer messages and generated media come out of your plan's allowance. The limits table has the current numbers.

A workflow that holds up#

1. Create a sheet named after the client, from their site, their guidelines or a description.
2. Fill the slots the project needs most: buttons, inputs, cards, navigation, modal and page transitions, toasts, and the section.* slots for marketing pages.
3. Send the client a share link and agree the direction before any screens are built.
4. Name the sheet in your prompts while you build, and have the agent run check_ui before each screen is marked done.
5. Export the sheet into the repo at handover, so the rules stay with the code.

If you're weighing this against a component library your studio already themes per client, component libraries vs a design sheet sets out where each approach is the better choice.