UXD AI Helpers

AI skills for PatternFly and UXD teams — component development, design, accessibility, and migration. Skills are available in Claude Code, Cursor, and Codex (desktop app and CLI). The patternfly dependency bundle auto-installs sub-plugins only in Claude Code.

Official setup docs: Claude Code plugins, Cursor plugins, OpenAI plugins and local marketplaces, and Codex CLI.

Marketplace catalogs: Claude Code and Codex both read .claude-plugin/marketplace.json. Cursor reads .cursor-plugin/marketplace.json separately. Codex does not require Claude Code to be installed.

Why two catalogs? Cursor uses a separate plugin format and ecosystem, so we maintain .cursor-plugin/marketplace.json independently. Claude Code and Codex share .claude-plugin/ because Codex reads the Claude Code format natively — no duplication needed.

Quick Start

Claude Code

Add the marketplace and install the patternfly meta-plugin — it auto-installs all PatternFly sub-plugins in one step:

# Add the marketplace (one time)
claude plugins marketplace add rh-uxd/ai-helpers

# Install everything PatternFly (React, design guide, audit, migration, and MCP)
claude plugins install patternfly@uxd-ai-helpers

That's it — all PatternFly skills are now available as slash commands:

/pf-react:pf-test-gen          # Generate unit tests for a React component
/pf-design-guide:pf-ai-guide   # Get AI experience design guidance
/pf-design-audit:pf-color-scan # Scan for hardcoded colors that should be tokens

Individual plugins: Install only what you need (e.g., claude plugins install pf-react@uxd-ai-helpers). Don't install both patternfly and individual sub-plugins — patternfly already includes them.

Enable auto-update to receive new skills as they're merged:

/plugin → Marketplaces → enable auto-update

Cursor

Cursor uses its own .cursor-plugin/marketplace.json format and does not currently read this repository's .claude-plugin/marketplace.json. It also does not support the dependencies feature that powers the patternfly meta-plugin, so install plugins individually. Add the marketplace in Settings → Marketplace, then install the ones you need — see the Plugins table below for the full list.

After installing, skills work the same way — slash commands in any project:

/pf-react:pf-test-gen          # Generate unit tests for a React component
/pf-design-audit:pf-color-scan # Scan for hardcoded colors that should be tokens

Note: Install pf-mcp separately for MCP server access. See the FAQ for setup.

Codex app (UI)

Open this repository in the Codex desktop app. Codex can read the existing .claude-plugin/marketplace.json, so Claude Code and the Codex CLI are not required. Open the Plugins Directory, choose uxd-ai-helpers, and install the plugins you need.

Install PatternFly plugins individually; the patternfly dependency bundle is Claude Code-only. If you change the marketplace files, restart the app before checking the Plugins Directory again. See the OpenAI plugin documentation for local marketplace details.

Codex CLI

Using Claude Code too

Keep the existing Claude Code setup, then add the marketplace to Codex:

claude plugins marketplace add rh-uxd/ai-helpers
codex plugin marketplace add rh-uxd/ai-helpers

Install a plugin in either tool:

claude plugins install uxd-research@uxd-ai-helpers
codex plugin add uxd-research@uxd-ai-helpers

Codex only

Claude Code is not required. Install Codex CLI for macOS or Linux, start it, and sign in:

curl -fsSL https://chatgpt.com/codex/install.sh | sh
codex

Then add the marketplace and install a plugin:

# Add the marketplace (one time)
codex plugin marketplace add rh-uxd/ai-helpers

codex plugin list --marketplace uxd-ai-helpers --available
codex plugin add uxd-research@uxd-ai-helpers

Codex reads the existing .claude-plugin/marketplace.json directly. Claude Code does not need to be installed or configured first. Install individual plugins; the patternfly dependency bundle is not applied by Codex. See the Codex CLI docs for other platforms. OpenCode is not covered here yet.

Plugins

See PLUGINS.md for the full list of skills, agents, and usage details.

Recommended Workflows

Start with the skill that matches the artifact or decision in front of you:

If you need to...	Start with	What it delivers
Frame a feature before design or development	uxd-discovery	A focused brief with the problem, users, decisions, constraints, and success measures.
Explore a design, screenshot, or mockup	uxd-evaluate-design-heuristics	A structured critique of accessibility, hierarchy, content, and state coverage.
Build an interactive concept	uxd-prototype-create	A runnable prototype with user journeys, scenarios, and reusable artifacts.
Validate a prototype against a ticket	uxd-prototype-evaluate	Acceptance-criteria results and persona-based usability evidence.
Prepare a design for implementation	uxd-design-handoff	Components, interaction states, decisions, and testable acceptance criteria.
Review PatternFly code before merging	pf-review	A consolidated check for PatternFly structure, imports, tokens, migration, and security issues.
Check accessibility in a PatternFly interface	pf-a11y-audit	WCAG and ARIA findings with evidence and remediation guidance.

Use the skill discovery matrix to compare audience, inputs, outputs, and relative prompt footprint. These skills support judgment, not judgment replacement: use them to prepare or extend human review when the work involves product decisions, sensitive research, or high-impact user experiences.

How It Works

1. You add this repo as a marketplace in Claude Code, Cursor, or Codex
2. You install plugins — on Claude Code, patternfly auto-installs all PF sub-plugins; on Cursor and Codex, install PF plugins individually
3. Skills become available as /<plugin>:<skill> slash commands in any project

Repository Structure

├── .claude-plugin/         # Claude Code marketplace config
├── .cursor-plugin/         # Cursor marketplace config
├── plugins/
│   ├── uxd-prototype/      # Create UX prototypes from Jira, Figma, or feature descriptions
│   │   └── skills/
│   │       └── uxd-prototype-create/  # Create or refine a prototype from a ticket, design, or idea
│   ├── uxd-workshop/       # UXD incubator — new and experimental UXD skills
│   └── patternfly/         # PatternFly meta-plugin + sub-plugins
│       ├── agents/            # pf-assist routing agent
│       ├── pf-react/          # React development — testing, structure, coding standards
│       ├── pf-design-guide/   # Design guidance — component selection, AI patterns
│       ├── pf-design-audit/   # Design auditing — token checks, color scanning
│       ├── pf-migration/      # PF version migration tools
│       ├── pf-workshop/       # PF team tools and skill incubation
│       └── pf-mcp/            # MCP server integration
├── scripts/                # Automation (doc generation, scaffolding, validation)
├── CONTRIBUTING.md         # How to contribute
└── CONTRIBUTING-SKILLS.md  # Step-by-step skill creation guide

PatternFly MCP Server

The PatternFly MCP server gives AI tools access to component documentation, prop schemas, and design guidelines. On Claude Code, pf-mcp is included automatically when you install patternfly. On Cursor and Codex CLI, install pf-mcp separately.

Contributing

See CONTRIBUTING.md for the contribution workflow and CONTRIBUTING-SKILLS.md for a step-by-step guide to creating skills.

CI/CD

Every pull request runs through automated quality gates:

Gate	What it checks
Validate	Manifest consistency and skill frontmatter integrity
Secret scan	Internal URLs and potential credentials in tracked files
Link check	Broken internal markdown links
Boundary check	PF skills don't reference UXD internals and vice versa
CodeRabbit	Automated review — structure, security patterns, best practices

License

MIT