design-principles — Claude Code skill: what it does, how to install
Helps teams define actionable design principles to resolve recurring product debates. Useful when the same decisions keep getting relitigated.
npx skills add Owl-Listener/designer-skills --skill design-principles -a claude-codeWhat design-principles does
The skill guides you through drafting opinionated, testable design principles. Each item follows a strict breakdown: a title of 3–6 words, the core statement, rationale, an application example, a counter-example, and an explicit trade-off. This structure keeps rules practical during debates.
The workflow consists of six steps. It starts with gathering inputs from research, running a workshop, drafting statements, and checking whether anyone would reasonably disagree. Then the team prioritizes conflicting items, tests them against historical product decisions, and shares the result widely.
For framing an isolated project rather than product-wide guidelines, this skill is not the right fit; use design-brief instead.
What it helps with
- resolve recurring team arguments over interface decisions
- structure opinionated design principles with explicit trade-offs
- prioritize conflicting guidelines for consistent review evaluation
- test candidate principles against past product decisions
Example prompts for the agent
- Help us run the 6-step process to create design principles for our checkout flow
- Draft a principle titled 'Speed Over Polish' with rationale, examples, and trade-offs
- Review these three candidate principles to see if they are testable and opinionated
How to install design-principles
1Skills CLI (Vercel)
npx skills add Owl-Listener/designer-skills --skill design-principles -a claude-code2Manually: put the files in place
~/.claude/skills/design-principles/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/design-principles/
1Skills CLI (Vercel)
npx skills add Owl-Listener/designer-skills --skill design-principles -a codex2Manually: put the files in place
.agents/skills/design-principles/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add Owl-Listener/designer-skills --skill design-principles -a cursor2Manually: put the files in place
.cursor/skills/design-principles/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install Owl-Listener/designer-skills design-principles2Manually: put the files in place
.github/skills/design-principles/SKILL.md1Skills CLI (Vercel)
npx skills add Owl-Listener/designer-skills --skill design-principles -a gemini-cli2Platform CLI
gemini skills install https://github.com/Owl-Listener/designer-skills --path ux-strategy/skills/design-principlesManually: put the files in place
.devin/skills/design-principles/SKILL.mdThe legacy .windsurf/skills/ path still works
Skills CLI (Vercel)
npx skills add Owl-Listener/designer-skills --skill design-principles -a opencodeClaude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
Step by step, with commands for each platform: How to install skills in Claude Code: five ways
Questions about design-principles
How do I install design-principles in Claude Code?
Run npx skills add Owl-Listener/designer-skills --skill design-principles -a claude-code in your terminal.
What structure does each principle follow?
Each principle includes a 3–6 word title, a statement, rationale, an application example, a counter-example, and the trade-off.
When should I use design-principles versus design-brief?
Use design-principles when teams repeatedly argue over recurring product trade-offs. For defining the scope and framing of a single project, use design-brief.
Source text
SKILL.md · MIT
---
name: design-principles
description: Define actionable principles that resolve trade-offs when the team disagrees. Use when the same decisions keep getting relitigated. For a single project's framing, use `design-brief`.
---
# Design Principles
You are an expert in crafting design principles that genuinely guide teams through decisions.
## What You Do
You help teams articulate principles that are specific, actionable, and memorable.
## Qualities of Strong Principles
- Opinionated — takes a clear stance
- Actionable — resolves debates
- Memorable — short enough to recall
- Distinctive — reflects this product's values
- Testable — designs can be evaluated against it
- Prioritized — rank order for conflicts
## Principle Structure
For each: title (3-6 words), statement, rationale, application example, counter-example, trade-off.
## Process
1. Gather inputs (research, values, strategy)
2. Workshop to surface candidates
3. Draft and debate ('Would anyone disagree?')
4. Prioritize for conflicts
5. Test against past decisions
6. Socialize widely
## Best Practices
- Involve the whole team
- Reference in design reviews
- Revisit as product evolves
- Display prominently in team spaces
© Owl-Listener · MIT · Owl-Listener/designer-skills
