Что это такое?
Скилл для Claude Code, который учит Claude конкретным механическим правилам дизайна из книги «Refactoring UI» Адама Ватана и Стива Шогера — фиксированные шкалы отступов, шрифтов, цветов и теней, иерархия через насыщенность и цвет, глубина через имитированный свет, — чтобы Claude применял их при построении или починке интерфейсов.
Скилл для Claude Code, который учит Claude конкретным механическим правилам дизайна из книги «Refactoring UI» Адама Ватана и Стива Шогера — фиксированные шкалы отступов, шрифтов, цветов и теней, иерархия через насыщенность и цвет, глубина через имитированный свет, — чтобы Claude применял их при построении или починке интерфейсов.Это дизайн-система или файл скилла для Claude Code?Это скилл Claude Code: папка с файлом SKILL.md, который загружает Claude, а не CSS-библиотека или набор компонентов для импорта в приложение.
Это скилл Claude Code: папка с файлом SKILL.md, который загружает Claude, а не CSS-библиотека или набор компонентов для импорта в приложение.Нужно ли что-то ещё помимо Claude Code?Только сам Claude Code — ни API-ключей, ни инструментов сборки, ни дополнительных зависимостей не упоминается; это чисто markdown-файл скилла.
Только сам Claude Code — ни API-ключей, ни инструментов сборки, ни дополнительных зависимостей не упоминается; это чисто markdown-файл скилла.Включает ли это само содержимое книги?Нет — здесь только собственные заметки и CSS-значения, выведенные из идей книги, а не её текст или изображения, так что для полного контекста всё ещё нужна сама книга.
Нет — здесь только собственные заметки и CSS-значения, выведенные из идей книги, а не её текст или изображения, так что для полного контекста всё ещё нужна сама книга.Когда скилл включается во время сессии?Он активируется автоматически, когда Claude создаёт или оформляет UI — подбирает размеры шрифтов, отступы, цвета, тени, разрабатывает палитру или токены, — или когда вы говорите, что UI выглядит «странно», «по-любительски» или «захламлённо/просто/недоделанно». Его можно вызвать и явно.
Он активируется автоматически, когда Claude создаёт или оформляет UI — подбирает размеры шрифтов, отступы, цвета, тени, разрабатывает палитру или токены, — или когда вы говорите, что UI выглядит «странно», «по-любительски» или «захламлённо/просто/недоделанно». Его можно вызвать и явно.Какие проблемы он умеет диагностировать?Он превращает расплывчатые замечания вроде «выглядит странно» или «выглядит дёшево» в конкретные механические исправления, охватывающие шкалы отступов, типографическую иерархию, цвет, тени, глубину и типовые формы компонентов.
Он превращает расплывчатые замечания вроде «выглядит странно» или «выглядит дёшево» в конкретные механические исправления, охватывающие шкалы отступов, типографическую иерархию, цвет, тени, глубину и типовые формы компонентов.Почему бы просто не прочитать книгу самому?Автор сверил каждое правило и CSS-значение с книгой постранично, чтобы Claude применял решения книги напрямую и последовательно, а не вам приходилось каждый раз вручную переводить текстовые советы в код.
Автор сверил каждое правило и CSS-значение с книгой постранично, чтобы Claude применял решения книги напрямую и последовательно, а не вам приходилось каждый раз вручную переводить текстовые советы в код.Можно ли держать скилл актуальным при изменениях репозитория?Да, вместо обычного клона можно добавить репозиторий как git-сабмодуль по пути скилла, чтобы отслеживать будущие обновления.
Да, вместо обычного клона можно добавить репозиторий как git-сабмодуль по пути скилла, чтобы отслеживать будущие обновления.What are similar projects?interface-design, taste-skill, skills, skills, evondevKit, hallmark, awesome-claude-design, open-claude-ui
interface-design, taste-skill, skills, skills, evondevKit, hallmark, awesome-claude-design, open-claude-uiWhich topics is it in?ui-design, design-system, design, skill, customization, css, anthropic, documentation, ui, claude, agent-skills, web-development
ui-design, design-system, design, skill, customization, css, anthropic, documentation, ui, claude, agent-skills, web-development