# gem-designer

Проектирует макеты, цветовые схемы и дизайн-системы с проверкой доступности по WCAG 2.2 AA. Работает внутри цепочек оркестрации и не пишет рабочий код.

- субагент · `type=agent` · GitHub Copilot · ★ 40418
- Автор: github · официальный репозиторий GitHub
- Лицензия: MIT · policy=mirror · начало файла — в конце страницы
- Исходник: https://github.com/github/awesome-copilot/tree/HEAD/agents/gem-designer.agent.md
- Обновлён: 2026-10-23
- HTML: https://affpapa.org/nevibecode/agents/gem-designer

## Что делает

Субагент отвечает за структуру интерфейса и темы оформления. Он формирует документ `DESIGN.md` и проверяет визуальную иерархию. В правила зашит отказ от шаблонных клише генеративного дизайна: фиолетовых акцентов на тёмном фоне и однотипных карточных сеток.

В рабочем процессе агент загружает скилл `gem-design-md-guidelines` и считывает требования к продукту. Перед выбором компонентов он формулирует визуальный тезис в одно предложение. Дополнительно проверяются контрастность текста по стандарту WCAG 2.2 AA и настройки для режима `reduced-motion`. Итог работы возвращается в виде компактного JSON-объекта со статусом проверки.

Субагент не пишет программный код. Напрямую через пользовательский чат вызвать его не получится из-за флага `user-invocable: false`. Агент рассчитан на запуск координатором с передачей аргументов `execution_id` и `task_id`.

## Установка

### GitHub Copilot (родная платформа)

**Вручную: положить файлы**
- Файл: `.github/agents/gem-designer.agent.md`

### Claude Code

**Вручную: положить файлы**
- Файл: `.claude/agents/gem-designer.md` — Для всех проектов — ~/.claude/agents/. Claude делегирует задачу сам по полю description или по @-упоминанию. Поле tools у Copilot перечисляет инструменты по-своему — уберите его или перепишите под Claude Code

### Codex

**Вручную: положить файлы**
- Файл: `.codex/agents/gem-designer.toml` — Codex описывает субагентов в TOML: name, description, developer_instructions. Текст из Markdown перенесите в developer_instructions вручную. Для всех проектов — ~/.codex/agents/

### Cursor

**Вручную: положить файлы**
- Файл: `.cursor/agents/gem-designer.md` — Cursor понимает и .claude/agents/

Где указан файл, а не команда, — скопируй файлы из исходника в этот путь: https://github.com/github/awesome-copilot/tree/HEAD/agents/gem-designer.agent.md

## Когда брать
- составить цветовую схему и дизайн-токены
- проверить макет на требования доступности WCAG 2.2 AA
- описать состояния компонентов для десктопа и мобильных экранов
- сформировать спецификацию интерфейса в файле `DESIGN.md`

## Примеры запросов агенту
- «Спланируй цветовую схему и иерархию компонентов для экрана профиля в `DESIGN.md`»
- «Проверь макет таблицы данных на контрастность текста и требования WCAG 2.2 AA»
- «Подготовь спецификацию состояний кнопок и полей ввода для мобильных экранов»

## Похожие
- [ui-designer](https://affpapa.org/nevibecode/agents/ui-designer.md) — субагент · 1979 установок
- [mobile-app-developer](https://affpapa.org/nevibecode/agents/mobile-app-developer.md) — субагент · 1552 установки
- [accessibility-tester](https://affpapa.org/nevibecode/agents/accessibility-tester.md) — субагент · 346 установок
- [cli-ui-designer](https://affpapa.org/nevibecode/agents/cli-ui-designer.md) — субагент · 1849 установок
- [game-designer](https://affpapa.org/nevibecode/agents/game-designer.md) — субагент · 1598 установок
- [web-accessibility-checker](https://affpapa.org/nevibecode/agents/web-accessibility-checker.md) — субагент · 1438 установок

Из того же набора: [github/awesome-copilot](https://affpapa.org/nevibecode/by/github/awesome-copilot.md) — 861 карточка

_Часть страницы не вошла по размеру — она есть в HTML-версии._

---
NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md