Maintainer of this skill?
Automated security scan — not a certification.
by Owl-Listener
Designer Skills Collection: agentic skills, commands, and plugins for design — from research to systems, UI, interaction, and delivery.
# Add to your Claude Code skills
git clone https://github.com/Owl-Listener/designer-skillsGuides for using ai agents skills like designer-skills.
Last scanned: 6/12/2026
{
"issues": [],
"status": "PASSED",
"scannedAt": "2026-06-12T08:25:41.549Z",
"npmAuditRan": true,
"pipAuditRan": true,
"promptInjectionRan": true
}See how designer-skills compares with popular alternatives.
designer-skills is an open-source ai agents skill for AI coding assistants such as Claude Code, Codex CLI, and ChatGPT, built by Owl-Listener. Designer Skills Collection: agentic skills, commands, and plugins for design — from research to systems, UI, interaction, and delivery. It has 2,934 GitHub stars.
Yes. designer-skills passed SkillsLLM's automated security scan — a dependency vulnerability audit plus prompt-injection heuristics — with no high-severity issues. You can read the full report in the Security Report section on this page.
Clone the repository with "git clone https://github.com/Owl-Listener/designer-skills" and add it to your Claude Code skills directory (see the Installation section above).
designer-skills is primarily written in Markdown. It is open-source under Owl-Listener on GitHub, so you can review or fork the full source.
Yes. SkillsLLM lists many other AI Agents skills you can browse and compare side by side. Open the AI Agents category from the badge at the top of this page, or use the Related Skills and comparison links further down to weigh designer-skills against similar tools.
No comments yet. Be the first to share your thoughts!
30 days in the Featured rail · terms & refunds
⚠️ Third-Party Software Notice
This skill is third-party open-source software developed and hosted independently on GitHub. SkillsLLM is an informational directory and does not control or maintain the underlying repository.
Any security checks, ratings, or warnings displayed by SkillsLLM are automated and limited in scope. They do not constitute a security certification or guarantee that the software is safe, error-free, or free from malicious code, vulnerabilities, compromised dependencies, or prompt-injection risks.
Review the source code, permissions, dependencies, and configuration before installing or running any third-party skill. Use is at your own risk. To the maximum extent permitted by applicable law, SkillsLLM is not liable for losses arising from third-party software.
Automated security scan — not a certification.
Design skills for the agent era, written so an AI agent can actually use them.
273 skills and 76 commands across 33 plugins, in five collections, for Claude Code and Gemini CLI.
Not sure which skill you need? Start with the skill index — every skill in this repo arranged by the situation you're in, plus the pairs most often mistaken for each other.
These skills run inside an AI coding assistant. The easiest place to use them is Claude Code, and it takes three steps. No terminal required.
1. Get Claude Code. It's a free app from Anthropic (claude.com). Download it, sign in, and open it. You only do this once.
2. Add the suite. In Claude Code, type this and press enter:
/plugin marketplace add Owl-Listener/designer-skills
This just tells Claude where the skills live. Nothing installs yet.
3. Pick what you want. Type /plugin and press enter, then open the Discover tab. You'll see all the collections. Move with the arrow keys, press space to tick the ones you want, and enter to install. That's it.
4. Don't know which skill you need? Type /designer-toolkit:start-here and say what you're working on. It names the stage you're at, gives you one command to run now and the two that follow it, and tells you what you can skip. Use it whenever you're unsure where a piece of work begins.
Same three steps. On the Discover list in step 3, just tick the design ones, design-research, design-systems, ui-design, interaction-design, and so on, and leave the rest. Install as few or as many as you like, and come back for more any time.
Each collection also has its own door. Swap the command in step 2 for the one you want, for example:
/plugin marketplace add Owl-Listener/inclusive-design-skills
Then do step 3 the same way.
Each plugin is also a Gemini CLI extension. From your project root:
git clone https://github.com/Owl-Listener/designer-skills /tmp/designer-skills
mkdir -p .gemini/extensions
cp -r /tmp/designer-skills/.gemini/extensions/. .gemini/extensions/
| Collection | Plugins | What it covers |
|---|---|---|
| Design practice (this repo) | 9 | Research, systems, UX strategy, UI, interaction, prototyping & testing, design ops, the designer's toolkit, visual critique. |
| AI product design | 6 | Designing agentic experiences: model interaction, alignment reasoning, system behaviour, evaluation, agent orchestration, prompt architecture. |
| UX program management | 6 | Running design programs: planning, stakeholder comms, delivery, alignment, measurement, process design. |
| Design leadership | 6 | Leading design: people, teams, strategy, org influence, operating cadence, leadership craft. |
| Inclusive design | 6 | Accessible by default: cognitive accessibility, inclusive interaction, accessible content, inclusive personas, adaptive interfaces, accessibility decisions. |
The other four collections each live in their own repo, with their own stars and full detail, and this marketplace pulls their plugins in for you — so the one install above covers all five. This repo is the front door, and the home of the design-practice collection below.
Agentic skills, commands, and plugins for design, from research to systems, UI, interaction, and delivery. 111 skills and 34 commands across 9 plugins.
| Plugin | Skills | Commands | Description |
|---|---|---|---|
| design-research | 14 | 4 | User research, qualitative and quantitative: personas, empathy maps, journey maps, interviews, usability testing, card sorting, surveys, behavioural analytics, and qual-quant triangulation. |
| design-systems | 11 | 3 | Build and maintain design systems: tokens, components, accessibility, theming, motion, governance, and localization. |
| ux-strategy | 12 | 3 | Shape product direction: competitive analysis, design principles, experience mapping, information architecture, content strategy, and service blueprints. |
| ui-design | 19 | 5 | Craft polished interfaces: layout grids, color systems, typography, responsive design, data viz, Gestalt/perceptual principles, and platform conventions. |
| interaction-design | 22 | 5 | Design meaningful interactions: micro-animations, state machines, gestures, feedback, cognitive laws, forms, onboarding, navigation, search, and conversational UX. |
| prototyping-testing | 10 | 5 | Validate designs: prototyping strategies, usability testing, heuristic evaluation, and A/B experiments. |
| design-ops | 9 | 3 | Streamline operations: critique frameworks, handoff specs, sprint planning, team workflows, design debt, and impact reporting. |
| designer-toolkit | 7 | 4 | Essential utilities: design rationale, presentations, case studies, UX writing, system adoption, and design negotiation. |
| visual-critique | 7 | 2 | Visual critique: hierarchy, brand consistency, composition, typography, colour, affordance, and information density. |
These nine plugins ship from this repo — none of them has a separate repo, and there is nothing to clone. After adding the marketplace, install one by name:
/plugin install ux-strategy@designer-skills
| Command | Plugin | Description |
|---|---|---|
/design-ops:handoff |
design-ops | Run the full handoff workflow — specs, measurements, assets, states, and a QA checklist — and output a developer-ready package. |
/design-ops:plan-sprint |
design-ops | Run a design sprint end to end — challenge framing, schedule, exercises, and prototype test plan. |
/design-ops:setup-workflow |
design-ops | Set up a team's operating rhythm end to end — rituals, task flow, tooling, review gates, and version control. |
/design-research:discover |
design-research | Run a full user research cycle — persona creation, empathy mapping, and journey mapping for a product or feature. |
/design-research:interview |
design-research | Prepare an interview script or summarize an interview transcript into structured insights. |
/design-research:synthesize |
design-research | Synthesize research data into affinity diagrams, themes, and actionable insights. |
/design-research:test-plan |
design-research | Run the full usability study workflow — research questions, participant criteria, tasks, metrics, and facilitation guide. |
/design-systems:audit-system |
design-systems | Run a comprehensive audit of an existing design system for consistency, completeness, and accessibility. |
/design-systems:create-component |
design-systems | Scaffold a full component specification end to end — props, states, variants, accessibility, and documentation. |
/design-systems:tokenize |
design-systems | Extract tokens from an existing design or stylesheet and organise them — naming, structure, and theme mapping. |
/designer-toolkit:build-presentation |
designer-toolkit | Build a design presentation end to end — audience framing, narrative structure, and supporting rationale. |
/designer-toolkit:start-here |
designer-toolkit | Find where to start in the collection — name what you're working on and get routed to one command, the two that follow it, and the stages you can skip. |
/designer-toolkit:write-case-study |
designer-toolkit | Build a portfolio case study end to end — project framing, process narrative, outcomes, and visuals. |
/designer-toolkit:write-rationale |
designer-toolkit | Write design rationale for a set of decisions, linking each to user needs, business goals, and principles. |
/interaction-design:design-form |
interaction-design | Design a form end to end — structure, decision points, chunking, validation, errors, and completion. |
/interaction-design:design-interaction |
interaction-design | Design a complete interaction flow for a feature or component. |
/interaction-design:design-onboarding |
interaction-design | Design a first-run experience end to end — activation path, progressive disclosure, and time to first value. |
/interaction-design:error-flow |
interaction-design | Design an error flow end to end — prevention, detection, messaging, and recovery paths. |
/interaction-design:map-states |
interaction-design | Model a component's states and transitions end to end — states, events, guards, and edge cases. |
/prototyping-testing:evaluate |
prototyping-testing | Run a heuristic evaluation end to end — expert review against heuristics with severity ratings and recommended fixes. |
/prototyping-testing:experiment |
prototyping-testing | Design an A/B experiment end to end — hypothesis, variants, primary metric, and sample size. |
/prototyping-testing:explore-options |
prototyping-testing | Run a parallel exploration end to end — frame the decision, build a spread of behaviourally distinct concepts, pressure-test each, and converge with a decision record. |
/prototyping-testing:prototype-plan |
prototyping-testing | Create a prototyping and testing plan for a design initiative. |
/prototyping-testing:test-plan |
prototyping-testing | Choose a testing method and build the plan around it — method selection, task scenarios, click tests, and accessibility coverage. |
/ui-design:color-palette |
ui-design | Run the full colour workflow — tonal scales, semantic mapping, contrast checks, dark mode, and chart colours — and output a documented palette. |
/ui-design:design-screen |
ui-design | Design a complete screen layout from a |