Professional Design System Architect

Design, build, or audit professional UI design systems across strategy, foundations, tokens, components, accessibility, tooling, governance, adoption, measurement, theming, releases, and migration.

What this skill does

This skill has two modes:

• blueprint - creates a complete design-system operating blueprint from a product, brand, platform, or organization brief.
• audit - evaluates an existing design system from evidence, scores maturity, writes severity-ranked findings, and sequences a remediation roadmap. It combines the legacy builder and auditor skills into one mode-based skill so creation and review use the same standards for product language, token architecture, component APIs, accessibility, Figma/code parity, documentation, QA, governance, adoption, analytics, theming, release, and migration.

When to use

Use this skill for prompts such as:

• "Create a design-system blueprint"
• "Build a professional UI design system"
• "Audit this design system"
• "Review our Storybook, Figma library, or token set"
• "Fix design-system drift"
• "Plan Figma/code parity"
• "Define token architecture"
• "Evaluate component accessibility and governance"
• "Sequence design-system adoption or migration"

Install

tessl install sharaf/professional-design-system-architect

How it's organized

Output format

The skill produces one of two structured artifacts.

For blueprint mode:

# Design System Blueprint: [Name]
## Executive Summary
## Scope and Assumptions
## Strategy and Operating Model
## Design Principles and Product Language
## Foundations and Token Architecture
## Component Architecture
## Pattern and Flow System
## Accessibility and Inclusive Design
## Content Design and UX Writing
## Figma Library Architecture
## Code Library Architecture
## Documentation and Education
## Quality Assurance and Testing
## Governance and Lifecycle
## Adoption and Change Management
## Measurement and Health Analytics
## Multi-Brand and Theming Strategy
## Releases, Maintenance, and Migration
## Roadmap
## Open Decisions

For audit mode:

# Design System Audit: [Name]
## Executive Summary
## Evidence Reviewed
## Maturity Scorecard
## Critical Findings
## High Findings
## Medium Findings
## Low Findings
## Domain-by-Domain Assessment
## Accessibility and Risk Notes
## Figma/Code/Docs Parity
## Adoption and Governance Health
## Measurement Gaps
## Prioritized Roadmap
## Open Questions

Built from

Migrated from these legacy flat skills in this repository:

• skills/professional-design-system-builder.md
• skills/professional-design-system-auditor.md

Research lineage:

• Domain: professional-ui-design-systems
• Research date: 2026-05-13
• Sub-domains: strategy, principles, tokens, component architecture, patterns, accessibility, content, Figma, code, docs, QA, governance, adoption, measurement, theming, releases, and migration.