Навык «Дизайн сайта»

Навык «Дизайн сайта» подключает режим ревью визуальной части проекта: агент анализирует CSS, компоненты и вёрстку, находит проблемы с доступностью, адаптивностью и архитектурой стилей.

Как запустить

Вариант 1 — отдельный аудит:

1. Выберите навык «Дизайн сайта» перед началом сессии

2. В поле команды появится /Дизайн сайта

3. Нажмите Enter — агент проведёт полный разбор текущего дизайна проекта

Вариант 2 — совместно с задачей: Вставьте /Дизайн сайта в начало своего промпта и продолжите описание задачи. Агент учтёт требования дизайн-ревью при выполнении вашей команды.

Что проверяет агент

Агент определяет стек и тему проекта, затем проверяет:

• Доступность (WCAG) — контраст текста и фона, наличие aria-атрибутов, поддержку клавиатурной навигации

• Анимации — наличие prefers-reduced-motion для пользователей с фотосенситивностью

• Адаптивность — корректность media query, мёртвые CSS-правила, поведение на мобильных

• Архитектуру стилей — дублирующиеся правила, циклические CSS-переменные, inline-стили вместо классов

Как читать результат

Отчёт разбит по уровням критичности:

По каждой проблеме агент указывает конкретный файл и строку, объясняет риск и предлагает готовый фрагмент кода для исправления.

В конце — сводная таблица всех проблем по приоритетам и предложение начать с самого критичного.

После ревью

Скажите агенту, что исправить — он внесёт правки самостоятельно. Можно выбрать всё сразу или начать с критичных проблем.