Addy Osmani Skills: инженерные практики для AI-агентов

Addy Osmani Agent Skills — MIT-коллекция инженерных рабочих процессов для кодовых агентов. Она переносит в SKILL.md не общие советы «пиши качественно», а конкретные шаги, контрольные точки, анти-рационализации и требования к доказательствам результата.

В коллекции 25 навыков: 24 относятся к жизненному циклу разработки, а using-agent-skills помогает выбрать подходящий процесс. Дизайн интерфейса занимает здесь важное, но не доминирующее место.

Структура коллекции

Навыки сгруппированы по этапам:

Define: интервью с пользователем, уточнение идеи, spec-driven development и фиксация ограничений качества.
Plan: разбиение спецификации на небольшие проверяемые задачи с зависимостями.
Build: вертикальные срезы, TDD, context engineering, работа с официальными источниками, API и frontend UI.
Verify: браузерная диагностика через DevTools, отладка и воспроизведение ошибок.
Review: качество кода, упрощение, безопасность и производительность.
Ship: Git, CI/CD, миграции, документация, ADR, наблюдаемость и запуск.

Для дизайн-задач особенно полезен frontend-ui-engineering: компонентная архитектура, дизайн-системы, состояние, адаптивность и WCAG 2.1 AA. Его стоит соединять с визуальным контрактом DESIGN.md: инженерный навык проверяет реализацию, но не должен самовольно заменять утверждённые токены и компоненты.

browser-testing-with-devtools добавляет проверку живого DOM, консоли, сети и производительности. constraint-driven-development помогает заранее определить обязательный уровень качества, чтобы агент не ослаблял проверки ради формально успешного завершения.

Команды и роли

Девять slash-команд образуют входные точки: /spec, /plan, /build, /test, /constraints, /review, /webperf, /code-simplify и /ship. Они активируют соответствующие навыки; в разных агентских средах имена и способ вызова могут отличаться.

Дополнительно доступны четыре роли: code reviewer, test engineer, security auditor и web performance auditor. Роли не должны бесконечно вызывать друг друга — в проекте есть отдельные правила оркестрации.

Главный принцип коллекции — verification is non-negotiable. Для подтверждения результата нужны тесты, сборка, runtime-данные или другой наблюдаемый артефакт. Это особенно важно для интерфейсов: «выглядит правильно» не доказывает ни доступность, ни сохранность сценария.

Установка

Универсальный вариант через skills CLI:

npx skills add addyosmani/agent-skills --list
npx skills add addyosmani/agent-skills --skill frontend-ui-engineering

Первый вызов показывает доступные навыки, второй устанавливает один. Для Claude Code доступен marketplace:

/plugin marketplace add addyosmani/agent-skills
/plugin install agent-skills@addy-agent-skills

У выборочной установки есть задокументированный нюанс: общие чек-листы из корневого references/ могут не попасть в отдельный каталог навыка. Если инструкция ссылается на такой файл, используйте интеграцию всего репозитория или перенесите нужный reference внутрь установленного навыка.

Как внедрять в существующий проект

Не запускайте сразу весь жизненный цикл. Для действующей кодовой базы разумнее начать с проверки: code review, browser testing, accessibility checklist и performance. Затем добавить спецификацию и планирование для новых изменений.

Для нового проекта можно пройти полный маршрут, но каждый quality gate должен соответствовать реальному риску. Маленький контентный сайт не обязан воспроизводить инфраструктуру крупного SaaS.

Чем отличается от gstack

Addy Osmani Skills — модульный набор практик с акцентом на инженерную дисциплину. gstack предлагает более связанный сценарий виртуальной команды и собственный браузерно-релизный инструментарий. Для чисто визуальной итерации обе коллекции шире, чем Impeccable.