Two modes, one Studio
Design and Redesign are different jobs. UX switches between them.
A segmented switcher at the top of the Studio flips both the verb bank and the gate set. Design starts from a brief; Redesign starts from a URL.
DESIGN7 verbs · 7 gates
Start from a brief.
Artboards, tokens, components, prototype arrows, clickable simulation, and one-click export to Next.js with CSS-variable tokens. The design and the code share the same token set — changes round-trip.
uxDesignAccompanistVerbs · uxDesignSystemFidelity
REDESIGN7 verbs · 8 gates
Start from a URL.
Playwright crawl of the target URL, screenshots at every breakpoint, heuristic and contrast audit, brand fingerprint, three-state spec (Remove / Change / Preserve), and a V0 that stays pinned forever. V1 cannot build against a live spec — the freeze is a one-way latch.
uxRedesignAccompanistVerbs · uxRedesignAuditSpecIntegrity
UX — one of eleven Studios
Designs with a paper trail.
Two modes: Design builds flows from a brief; Redesign crawls any live URL with Playwright — screenshots at every breakpoint, accessibility findings, brand fingerprint — then rebuilds it. V0 of every redesign stays permanent, forever. Exports to Next.js with design-system tokens that round-trip between design and code.
What you can do
UX verbs, shipped today.
Every item below is a real Copilot verb wired into the Studio surface. No roadmap, no asterisks.
ADD_ARTBOARD
Add artboard · Design
Insert a new artboard after a named position. Frame name and size are part of the verb.
DUPLICATE_ARTBOARD
Duplicate artboard · Design
Clone the selected artboard so you can branch a variant without losing V1.
PATCH_COMPONENT
Patch component · Design
Apply an AI patch to a specific component on an artboard — not the whole screen.
CHANGE_TOKEN
Change token · Design
Update a design-system token. New tokens add to the DS; existing names get replaced.
CONNECT_PROTOTYPE
Connect prototype · Design
Draw a prototype arrow between two artboards with a trigger label.
RUN_PROTOTYPE
Run prototype · Design
Launch a clickable simulation of the prototype graph. No export required.
EXPORT_CODE
Export code · Design
Export artboards as Next.js / React components with CSS tokens bound to the DS.
AUDIT_URL
Audit URL · Redesign
Fire a Playwright audit against the target URL. Crawl + screenshots + heuristics + brand fingerprint.
TOGGLE_SPEC_ITEM
Toggle spec item · Redesign
Cycle a spec item between Remove / Change / Preserve. Three-state intent, not a checkbox.
EDIT_SPEC_ITEM
Edit spec item · Redesign
Rewrite the text of a spec item before the V1 build freezes against it.
BUILD_V1
Build V1 · Redesign
Freeze the spec and fire the V1 generation pipeline. V0 stays pinned alongside.
PATCH_V1_COMPONENT
Patch V1 component · Redesign
Iterate a V1 artboard component without discarding V0 or the frozen spec.
COMPARE_AGAINST_V0
Compare vs V0 · Redesign
Open the V0 / V1 side-by-side viewer so the redesign decision is inspectable.
EXPORT_REDESIGN_BRIEF
Export redesign brief · Redesign
Export audit findings + spec + migration path as a Document artifact in one click.
Gate profile
Delivery is measured, not asserted.
Every gate result is written to the production's chain of custody.
●tokens_resolved
Design-system tokens resolved
Zero ad-hoc hex colors. Every color on the artboard resolves through the DS.
●contrast_aa
Contrast AA (≥ 4.5:1)
Text-on-background contrast clears AA on every frame.
●component_fidelity
Component fidelity
Warn if any element is one-off instead of a DS component.
●copy_budget
Copy budget (no overflow)
Every text region fits its frame; overflow counted and reported.
●a11y_labels
A11y labels on every interactive
Every button, input, and link carries an aria-label.
●prototype_links_valid
Prototype links valid
Every prototype arrow resolves to a real destination artboard.
●crawl_complete
Crawl complete (Redesign)
Playwright crawl finishes before the audit stream closes.
●brand_fingerprint
Brand fingerprint captured (Redesign)
Palette, type scale, and logo anchors extracted from the live site.
●spec_frozen
Spec frozen before V1 build
You cannot build V1 against a live spec. The freeze is a one-way latch.
◆ux_design_system_fidelity
Design-system fidelity on patchesPATCH GATE
Every Design-mode patch verifies the DS tokens still hold. Ad-hoc drift fails the gate.
◆ux_redesign_audit_spec_integrity
Audit ↔ spec integrity on patchesPATCH GATE
Every Redesign patch checks the iteration still matches the frozen spec. Drift is flagged and attributed.
Patch gate for this Studio: ux_design_system_fidelity + ux_redesign_audit_spec_integrity
Cost footprint
Tokens, published before you click run.
One bucket for every Studio. The range below is for a typical request; the exact number prints on the receipt the moment the generation settles.
40,000–80,000tokens · Design flow · Redesign audit is higher
Rates come from
shared/tenant_tiers.py. Free tier ships with 500,000 tokens; overage billed at $0.025/1K on Pro, $0.020/1K on Team, or covered by the Enterprise quote.Continuation
Every output ships with a purple chip.
You stop managing the handoff.
DELIVERED · UX · CONTINUES TO →
A delivered UX artifact continues into Code (as Next.js components with DS tokens), Presentation (to brand a launch deck), or Image (for hero artwork that respects the same brand). Every production is visible from Flow, the project-wide board.
Try UX — free.
Describe the outcome — the loop runs until the work is done, receipted, and ready for whatever comes next.