gezel Gezel Handboek

Design System Consultation

Interview for product context and taste, then propose a full design system — type, color, layout, motion — and capture it as a DESIGN.md with live preview pages.

How it runs

#StepWho runs itWhat happens
1Audit the current interfaceDesignerMap the product, users, existing visual language, implementation constraints, and inconsistencies.
2Lock the design briefDesignerDefine the memorable intent, principles, references, exclusions, and success tests.
3Propose and render the design systemDesignerSpecify the system and render a realistic, accessible preview of its important states.
4Evaluate the deliverableReviewerIndependently grade the observable deliverable and route it to finish, repair, or user escalation.
5Repair the deliverableDesignerFix only the concrete gaps from the latest independent review.
6FinishDeveloperAll deterministic and reviewer criteria passed.
7Escalate unresolved concernsDeveloperThe bounded repair loop ended without a defensible pass.

Say something like "design system" or "create a brand" or "design from scratch" in chat to start it.

Needs toolsets: @playwright/mcp.

Watch this article as a slideshow