ClaudeCodeMod

All shelves / Marketplaces

Owl-Listener/designer-skills

Owl-Listener/designer-skills · 33 plugins

Marketplace Designer Skills Collection: agentic skills, commands, and plugins for design — from research to systems, UI, interaction, and delivery.

Install

In Claude Code
/plugin marketplace add Owl-Listener/designer-skills

Run inside Claude Code, then install plugins from it. Check the repo's README before you run it.

Open the repo

Plugins 33

After adding the marketplace, install one with /plugin install <name>@designer-skills.

  1. 1design-researchUser research skills for designers: personas, empathy maps, journey maps, interview scripts, usability testing, card sorting, behavioural analytics, and reconciling data with research./plugin install design-research@designer-skillsdesign
  2. 2design-systemsDesign system skills: component specs, design tokens, naming conventions, spacing and grid systems, accessibility standards, and documentation./plugin install design-systems@designer-skillsdesign
  3. 3ux-strategyUX strategy skills: information architecture, content strategy, navigation patterns, user flows, task analysis, and competitive UX audits./plugin install ux-strategy@designer-skillsdesign
  4. 4ui-designUI design skills: color palettes, typography systems, layout grids, responsive breakpoints, dark mode specs, visual hierarchy, and brand alignment./plugin install ui-design@designer-skillsdesign
  5. 5interaction-designInteraction design skills: micro-interactions, animation principles, state machines, gesture patterns, error handling UX, and feedback patterns./plugin install interaction-design@designer-skillsdesign
  6. 6prototyping-testingPrototyping and testing skills: wireframe specs, usability heuristics, heuristic evaluations, accessibility audits, A/B test design, and benchmark analysis./plugin install prototyping-testing@designer-skillsdesign
  7. 7design-opsDesign operations skills: handoff specs, design critique facilitation, design sprint planning, team workflows, QA checklists, and design debt audits./plugin install design-ops@designer-skillsdesign
  8. 8designer-toolkitDesigner utility skills: design rationale, case study structure, design presentations, UX writing, design system adoption, and design negotiation — plus the /start-here router./plugin install designer-toolkit@designer-skillsdesign
  9. 9visual-critiqueVisual critique skills: hierarchy analysis, brand consistency checks against mood/voice/tokens, composition evaluation, and typography audits — with a /critique-screen command that compiles a prioritised fix list./plugin install visual-critique@designer-skillsdesign
  10. 10program-planningPlan and scope UX programs: roadmaps, dependency maps, capacity planning, prioritisation./plugin install program-planning@designer-skillsproduct
  11. 11stakeholder-commsStakeholder mapping, status reporting, executive updates, alignment workshops, escalation./plugin install stakeholder-comms@designer-skillsproduct
  12. 12delivery-executionCycle orchestration, risk registers, blocker triage, launch readiness, retrospectives./plugin install delivery-execution@designer-skillsproduct
  13. 13cross-functional-alignmentIntake, decision logs, working agreements, RACI, and OKR linkage across functions./plugin install cross-functional-alignment@designer-skillsproduct
  14. 14measurement-opsProgram health: KPIs, dashboards, research ops, design ops metrics, impact reporting./plugin install measurement-ops@designer-skillsproduct
  15. 15process-designHow the team works: workflows, governance, rituals, scaling playbooks, retrospectives./plugin install process-design@designer-skillsproduct
  16. 16people-management1:1s, feedback, growth plans, performance reviews, career ladders, difficult conversations./plugin install people-management@designer-skillsdesign
  17. 17team-buildingHiring loops, job specs, portfolio review, onboarding, team topology, psychological safety./plugin install team-building@designer-skillsdesign
  18. 18design-strategyDesign vision, strategy docs, org-level principles, investment cases, portfolio prioritisation./plugin install design-strategy@designer-skillsdesign
  19. 19org-influenceExecutive narrative, influence mapping, advocacy, securing resources, managing up./plugin install org-influence@designer-skillsdesign
  20. 20operating-cadenceDesign reviews at scale, planning cadence, decision frameworks, delegation, operating rhythm./plugin install operating-cadence@designer-skillsdesign
  21. 21leadership-craftSelf-leadership, change leadership, conflict resolution, mentorship, leadership ethics./plugin install leadership-craft@designer-skillsdesign
  22. 22model-interaction-designInteraction patterns for AI products: mixed-initiative flow, handoff protocols, error personality./plugin install model-interaction-design@designer-skillsai
  23. 23ai-alignment-reasoningAlignment reasoning and harm anticipation translated into practitioner design skills./plugin install ai-alignment-reasoning@designer-skillsai
  24. 24system-behavior-shapingShape system behaviour: defaults, guardrails, refusals, and behavioural contracts./plugin install system-behavior-shaping@designer-skillsai
  25. 25evaluationEvaluate agentic experiences: behaviour evals, trust calibration, failure analysis./plugin install evaluation@designer-skillsai
  26. 26design-agent-orchestrationDesign how agents collaborate, hand off, and stay legible to people./plugin install design-agent-orchestration@designer-skillsai
  27. 27prompt-architectureStructure prompts and context as a design material, not an afterthought./plugin install prompt-architecture@designer-skillsai
  28. 28cognitive-accessibilityDesign for how people actually think: cognitive load, plain language, wayfinding, focus, memory, error recovery./plugin install cognitive-accessibility@designer-skillsaccessibility
  29. 29inclusive-interactionMulti-modal interactions that adapt to how people move, perceive, and communicate./plugin install inclusive-interaction@designer-skillsaccessibility
  30. 30accessible-contentStructure content that works for screen readers, cognitive differences, and diverse literacy levels./plugin install accessible-content@designer-skillsaccessibility
  31. 31inclusive-personasUser stories, personas, and scenarios that include disability from the start./plugin install inclusive-personas@designer-skillsaccessibility
  32. 32adaptive-interfacesDesign systems that respect user preferences and adapt to individual needs./plugin install adaptive-interfaces@designer-skillsaccessibility
  33. 33accessibility-decisionsDocument, communicate, and maintain accessibility decisions across teams and time./plugin install accessibility-decisions@designer-skillsaccessibility

Files

README.md

The Designer Skills Pack

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.

Getting started (no coding needed)

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.

I only want the design skills, not everything

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.

I only want one specific collection

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.

Prefer Gemini CLI?

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/

The five collections

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.


Design practice (this repo)

Agentic skills, commands, and plugins for design, from research to systems, UI, interaction, and delivery. 111 skills and 34 commands across 9 plugins.

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

All commands

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 description or requirements.
/ui-design:platform-audit ui-design Audit a design for iOS and Android convention compliance — navigation, controls, typography, and platform-specific gaps.
/ui-design:responsive-audit ui-design Audit a design's responsive behaviour across breakpoints — layout, touch targets, and content reflow.
/ui-design:type-system ui-design Build a typography system end to end — scale, weights, line heights, measure, and responsive behaviour.
/ux-strategy:benchmark ux-strategy Run a competitive benchmark across a set of products — pattern comparison, gap analysis, and opportunity callouts.
/ux-strategy:frame-problem ux-strategy Structure an ambiguous design challenge into a clear problem definition with constraints and criteria.
/ux-strategy:strategize ux-strategy Develop a complete UX strategy for a product or feature area.
/visual-critique:critique-screen visual-critique Run all seven visual critiques on a screen and output a prioritised fix list.
/visual-critique:critique-ux visual-critique Run a focused UX critique on a screen — affordances, information density, and hierarchy — and output a prioritised fix list.

What are skills and commands?

Skills are domain knowledge units — nouns. They teach Claude about a design topic: how to create a user persona, how to define design tokens, how to write a non-leading interview question.

Commands are workflows — verbs. They chain skills together to do a complete job: /design-research:discover runs personas, empathy map, and journey map in one go.

You'll mostly reach for commands. The skills run underneath them.

Pick your starting point

I'm starting a new product from scratch

Start with research, even if you think you know the users.

/design-research:discover

Tell Claude: what you're building, who you think the users are, and what problem you're solving. It will run a full discovery cycle — personas, empathy map, journey map — and surface the gaps in your assumptions.

From there, move in sequence:

  • /ux-strategy:frame-problem — structure the design challenge before you start designing
  • /ui-design:design-screen — when you're ready to build
  • /interaction-design:design-interaction — for any flows that have meaningful state or motion
  • /design-systems:create-component — when patterns start repeating and you need to systemise them

Minimum install for this path: design-research, ux-strategy, ui-design, interaction-design

I'm working on an existing product

Start with a critique, not new work.

/visual-critique:critique-screen

Drop a screenshot. Get a prioritised fix list covering hierarchy, brand consistency, composition, and typography. This tells you what's actually broken before you add anything new.

Then:

  • /prototyping-testing:evaluate — run a heuristic evaluation if you want a fuller audit
  • /design-ops:handoff — if you're in a delivery phase and need specs
  • /design-systems:audit-system — if you suspect system debt is the root cause

Minimum install for this path: visual-critique, prototyping-testing, design-ops

I have a specific deliverable to produce

Go directly to the plugin that covers it. You don't need everything.

What you need to produce Plugin Command
User personas design-research —
Interview script design-research /design-research:interview
Journey map design-research —
Competitive analysis ux-strategy /ux-strategy:benchmark
Colour palette ui-design /ui-design:color-palette
Typography system ui-design /ui-design:type-system
Component spec design-systems /design-systems:create-component
Design tokens design-systems /design-systems:tokenize
Usability test plan prototyping-testing /prototyping-testing:test-plan
Developer handoff design-ops /design-ops:handoff
Design rationale designer-toolkit /designer-toolkit:write-rationale
Case study designer-toolkit /designer-toolkit:write-case-study

That covers the most common asks. For all 107 skills — including the ones without a command in front of them — see the skill index.

I'm building with AI and need to design the AI experience

This collection covers conventional design. For designing AI products specifically — model interaction, alignment reasoning, error personality, agent orchestration — use the companion collection:

/plugin marketplace add Owl-Listener/ai-design-skills

The two collections are designed to work alongside each other.

Recommended install for most designers

If you're not sure where to start, install these five and you'll have coverage across the full design cycle, plus the router that tells you where to begin:

/plugin install design-research@designer-skills
/plugin install ux-strategy@designer-skills
/plugin install ui-design@designer-skills
/plugin install design-ops@designer-skills
/plugin install designer-toolkit@designer-skills

designer-toolkit is the one carrying /start-here, so install it even if you want nothing else from it.

Add others as you need them. The plugins are lightweight — installing more doesn't slow things down.

A note on sequence

The plugins aren't a strict pipeline, but there's a natural grain to them:

design-research → ux-strategy → ui-design / interaction-design → design-systems → design-ops

Research informs strategy. Strategy shapes UI decisions. Patterns in UI become system components. Systems flow into ops. Working against this grain is fine — but if something feels hard, it's often because a step earlier in the sequence was skipped.

Why this exists

Most design knowledge is written for humans to read and interpret. An agent gets none of that nuance. It reads what we wrote literally, and guesses where we left the meaning out, and the guesses pile up into something hollow. This suite writes the judgment down: what a thing is for, when to use it, and what to never do. Taste, made legible.

Questions?

Open an issue. If something isn't working the way you expected, or if a skill output feels wrong for your context, that's signal worth capturing.

Contributing

Contribute to a collection in the repo that hosts it. The nine design-practice plugins live here, so skills and fixes for them — ux-strategy included — are PRs against this repo. The other four collections take contributions in their own repos, linked in the table above. Add a skill, ship its plugin manifest in the same commit, and open a PR.
PRs for new skills or structural changes without a corresponding open issue will be closed without review.

Community Integrations

Tools and plugins built on top of designer-skills:

IntegrationDescriptionMaintainerdesign-library-pluginClaude Code plugin exposing designer-skills via /design-process, with keyword activation across wireframe, prototype, user research, design sprint, and handoff workflows@zeta92

If you've built something on top of this collection and want it listed here, open an issue.

License

MIT.

By MC Dean · MC Percolates on Substack

Facts

Kind
Marketplace
Repo
Owl-Listener/designer-skills
Group
Uncategorized
Marketplace name
designer-skills
Owner
MC Dean
License
MIT
Language
Markdown
Created
2026-03-07
Forks
407
Topics
agentic, agentic-ai, ai, ai-tools, claude-code, design-system, design-systems, prompt-engineering, skills, ux-design
Plugins
33

More on this shelf

  1. 1f/prompts.chatf/prompts.chatf.k.a. Awesome ChatGPT Prompts. Share, discover, and collect prompts from the community. Free and open source — self-host for your organization with complete privacy.
  2. 2affaan-m/everything-claude-codeaffaan-m/everything-claude-codeThe agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Claude Code, Codex, Opencode, Cursor and beyond.
  3. 3obra/superpowersobra/superpowersAn agentic skills framework & software development methodology that works.
  4. 4anthropics/skillsanthropics/skillsPublic repository for Agent Skills
  5. 5anthropics/claude-codeanthropics/claude-codeClaude Code is an agentic coding tool that lives in your terminal, understands your codebase, and helps you code faster by executing routine tasks, explaining complex code, and handling git workflows - all through natural language commands.
  6. 6nextlevelbuilder/ui-ux-pro-max-skillnextlevelbuilder/ui-ux-pro-max-skillAn AI skill that provides design intelligence for building professional UI/UX across multiple platforms.