---
slug: "design-suite-claude-skills"
source_type: "readme"
source_url: "https://cdn.jsdelivr.net/gh/mevans2120/design-suite-claude-skills@main/README.md"
repo: "https://github.com/mevans2120/design-suite-claude-skills"
source_file: "README.md"
branch: "main"
---
# Design Suite - Claude Skills

Digital product design workflow: research → concepts → components.

## Installation

```bash
git clone https://github.com/mevans2120/design-suite-claude-skills.git
cd design-suite-claude-skills

# Install globally (creates symlinks)
mkdir -p ~/.claude/skills
ln -s "$(pwd)/design-research" ~/.claude/skills/design-research
ln -s "$(pwd)/design-concepts" ~/.claude/skills/design-concepts
ln -s "$(pwd)/design-components" ~/.claude/skills/design-components
```

Or run `./install.sh` to install all three at once.

## Skills

### design-research
User research using Jobs-to-be-Done methodology. Creates personas, customer segments, design principles, and research discussion guides. Also supports component-level research: auditing existing patterns, accessibility requirements, and interaction best practices.

**Trigger phrases:** "user research", "persona", "target audience", "design principles", "jobs to be done", "competitive analysis"

### design-concepts
Conceptual design exploration using a Design Lens System. Conducts a Design Intent Interview, gathers diverse inspiration (beyond Dribbble), selects design lenses, and creates 3 meaningfully different concepts with mood boards.

**Trigger phrases:** "mockup", "wireframe", "concept", "mood board", "visual direction", "design options", "UI design", "prototype"

### design-components
Designs components and sections within an *existing* design system. Creates 3 composition variations that use the project's actual tokens, colors, typography, and component primitives — finding variety through layout, interaction, and information hierarchy rather than new visual identity.

**Trigger phrases:** "design a component", "component variations", "design a card", "design a hero", "design a section", "new component"

## Workflow

```
Research → Concepts → Components
   ↓          ↓           ↓
personas   mood boards  3 variations
insights   3 concepts   within system
principles lens system  token-native
```

Use **design-concepts** when you need a new visual direction. Use **design-components** when you're working within an established design system.

## Usage

Skills load automatically based on conversation context. You can also ask directly:
```
"Create personas from this user data"
"Design 3 concept variations for the dashboard"
"Design a card component using our existing system"
```

## Customization

Edit `SKILL.md` files to customize behavior:
- Modify methodology (default: Jobs-to-be-Done for research)
- Adjust design lenses or add your own
- Add company-specific brand guidelines
- Change deliverable formats

## Requirements

- Claude Code (or Claude Pro/Max/Team/Enterprise)

## License

MIT