К основному содержанию
скилл CX Codex

design-rationale — скилл для Claude Code: обоснование дизайн-решений

Помогает написать письменное обоснование дизайн-решения: что выбрали, почему и какие были альтернативы. Пригодится перед ревью или хендоффом.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add Owl-Listener/designer-skills --skill design-rationale -a claude-code
Открыть на GitHub

Что делает design-rationale

Скилл задаёт структуру из семи блоков: решение, контекст, рассмотренные варианты, доказательства, логика выбора, компромиссы и план проверки. Агент проходит по ним и собирает текст, который связывает выбор с потребностями пользователей, целями бизнеса и принципами дизайна.

Отдельный чек-лист качества требует, чтобы обоснование опиралось на исследование или данные, а не на вкус дизайнера, и упоминало отвергнутые альтернативы. Есть список случаев, когда писать стоит: смена крупного направления, отход от привычных паттернов, спорные решения, изменения относительно прошлых подходов.

Скилл советует писать обоснование в момент принятия решения, а не задним числом, хранить его рядом с файлами дизайна и ссылаться на него в документации по передаче. Для живого спора с коллегами он не подходит — там нужен design-negotiation.

Какие задачи решает

  • защитить дизайн-решение перед командой и стейкхолдерами
  • зафиксировать, какие альтернативы рассматривали и почему отказались
  • объяснить отход от устоявшегося паттерна
  • подготовить раздел с обоснованием для хендоффа
  • вернуться к решению через месяцы и вспомнить контекст

Примеры запросов агенту

  • Напиши обоснование решения перейти на новую навигацию: контекст, варианты, доказательства, компромиссы
  • Собери rationale для смены паттерна авторизации, добавь план проверки метриками
  • Оформи обоснование спорного решения по сетке, чтобы его можно было приложить к ревью

Как установить design-rationale

1Через Skills CLI (Vercel)

npx skills add Owl-Listener/designer-skills --skill design-rationale -a claude-code

2Вручную: положить файлы

~/.claude/skills/design-rationale/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/design-rationale/

По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов

Вопросы о design-rationale

Как установить design-rationale в Claude?

Выполните npx skills add Owl-Listener/designer-skills --skill design-rationale -a claude-code. Скилл встанет в ~/.claude/skills/design-rationale/SKILL.md.

Что делает design-rationale?

Пишет письменное обоснование дизайн-решения по структуре из семи частей: решение, контекст, альтернативы, доказательства, логика, компромиссы и план проверки.

Чем design-rationale отличается от design-negotiation?

Первый нужен для письменного текста, который будут читать позже. Второй — для живого разговора, когда решение обсуждают вслух.

Исходный текст

SKILL.md · MIT
---
name: design-rationale
description: Write rationale connecting decisions to user needs, business goals, and principles. Use when a decision needs defending in writing. For a live conversation, use `design-negotiation`.
---
# Design Rationale
You are an expert in articulating the reasoning behind design decisions.
## What You Do
You write clear design rationale that connects decisions to evidence, principles, and goals.
## Rationale Structure
### 1. Decision
What design decision was made? Be specific about what was chosen.
### 2. Context
What problem or need prompted this decision? What constraints exist?
### 3. Options Considered
What alternatives were explored? Brief description of each.
### 4. Evidence
What informed the decision? User research, data, best practices, competitive analysis, usability testing.
### 5. Reasoning
Why this option over the alternatives? Connect to user needs, business goals, design principles, and technical feasibility.
### 6. Trade-offs
What are the known compromises? What was deprioritized and why?
### 7. Validation Plan
How will you know if this decision was right? What metrics or feedback will confirm?
## When to Write Rationale
- Major design direction decisions
- Departures from established patterns
- Controversial or debated choices
- Decisions that will be questioned later
- Changes from previous approaches
## Rationale Quality Checklist
- Connects to user needs (not just designer preference)
- References evidence or principles
- Acknowledges alternatives and trade-offs
- Is specific enough to be useful months later
- Written for the audience who will read it
## Best Practices
- Write rationale during the decision, not after
- Keep it concise but complete
- Store rationale alongside the design files
- Reference in handoff documentation
- Use rationale in design reviews to explain choices

© Owl-Listener · MIT · Owl-Listener/designer-skills

Похожие скиллы

Всё по теме «Дизайн» →
develop-design-rationale product-on-purpose Скилл помогает оформить обоснование UX-решений, разобрать альтернативы и зафиксировать компромиссы. Пригодится перед защитой дизайна перед стейкхолдерами. CX Codex +1 744установок presentation-design aaronvanston Задаёт визуальные правила для смелых минималистичных презентаций: тёмная тема, крупные заголовки, акцентные цвета по секциям. Пригодится, когда нужно превратить текст в структуру слайда. CX Codex +1 798установок presentation-design-enhancer OneWave-AI Превращает перегруженные текстом слайды в визуальную подачу: предлагает раскладку, иконки и способы показать данные. CX Codex +1 573установок brand-style-guide rampstackco Собирает или проверяет брендбук по восьми разделам: история, логотип, цвет, типографика, изображения, голос, применения, запреты. Пригодится, когда айдентика готова и её надо передать команде. CX Codex +1 388установок frontend-design cline Скилл задаёт агенту смелое визуальное направление и заставляет доводить код до продакшн-уровня. Пригодится, когда интерфейс не должен выглядеть как типовой вывод нейросети. CX Codex +1 7 300установок design-brief julianoczkowski Проводит интервью о задаче, смотрит существующий код и сохраняет дизайн-бриф в markdown. Пригодится перед стартом новой страницы или фичи. CX Codex +1 5 300установок

Из того же набора109

wireframe-spec Составляет текстовые спецификации вайрфреймов с приоритетами контента и заметками о поведении элементов. Пригодится при проектировании структуры интерфейса до начала работы с визуалом. CX Codex +1 2 300установок micro-interaction-spec Описывает одну микромикровзаимодействие целиком: триггер, правила, отклик, циклы и режимы. Пригодится, когда пора передать её в разработку. CX Codex +1 2 300установок accessibility-test-plan Помогает спланировать тестирование доступности интерфейса с ассистивными технологиями и реальными пользователями. Пригодится перед релизом для покрытия критериев WCAG. CX Codex +1 2 100установок interview-script Создаёт сценарий пользовательского интервью с открытыми вопросами и заметками ведущему. Нужен перед качественным исследованием. CX Codex +1 2 100установок card-sort-analysis Анализирует результаты открытой и закрытой карточной сортировки, строит матрицу сходства и предлагает категории для навигации. CX Codex +1 2 100установок pattern-library Скилл оформляет повторяющиеся UX-решения как записи паттернов: от проблемы и решения до примеров, доступности и связанных паттернов. CX Codex +1 2 100установок affinity-diagram Скилл собирает наблюдения и цитаты из интервью в тематические кластеры и формулирует инсайты. Пригодится, когда данных много и нужно свести их воедино. CX Codex +1 2 100установок documentation-template Создаёт готовые каркасы документации для компонентов, паттернов и базовых правил дизайн-системы. Пригодится, когда нужно привести описание интерфейсных элементов к единому стандарту. CX Codex +1 2 100установок

Спонсоры проекта

Компании, которые помогают держать аналитику открытой