AI-native Designer

Справочник директив

Директива — это инструкция для агента в Markdown-файле. Здесь описано, что делает каждая директива и когда её запускать.

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

  1. Распакуйте Directives.zip в папку своего проекта.
  2. Откройте папку в Antigravity и запустите Claude Code.
  3. Напишите агенту, какую директиву выполнить:
Прочитай Directives/Level_01/02_directive_quick_research.md и выполни её.

Порядок важен. Каждая директива читает файлы, которые оставили предыдущие. Если запустить персоны без брифа, агенту не на что опереться.

Структура папки

Папка Что внутри
Level_01 Исследование и продукт: от брифа до PRD
level_02 Дизайн в Figma: от sitemap до финальных экранов
Level_03 Код: дизайн-система в React
dop Дополнительно: quickstart, grab-web, бренд-скиллы

Level_01. Исследование и продукт

01 · Рекурсивный брифинг

Агент в роли Senior UX Lead задаёт вопросы о пользователях, функциях, ограничениях, UI и бизнесе, потом углубляется в неполные ответы. Вход: ваша идея. Выход: brief.md.

02 · Быстрый ресёрч

Находит 5 конкурентов и разбирает у каждого фичи, монетизацию, UX, плюсы и минусы. Вход: brief.md. Выход: competitive_analysis.md.

03 · Промпт для Deep Research

Пишет промпт для Gemini Deep Research с вопросами под ваш продукт. Промпт вы вставляете в Gemini, а отчёт сохраняете в проект. Вход: бриф, ресёрч. Выход: промпт → deep_research_results.md.

04 · Конкурентный анализ

Превращает сырые данные в документ для показа: SWOT по каждому конкуренту, матрица фич, UX-паттерны. Вход: бриф, ресёрч, Deep Research. Выход: competitive_analysis_final.md и сопутствующие файлы.

05 · UX-аудит

Проходит флоу продукта-конкурента по скриншотам и оценивает его по 10 эвристикам Нильсена. Вход: скриншоты в audit/screenshots/. Выход: audit/audit_report.md.

06 · Прото-персоны

Создаёт 3 поведенческие персоны: роль и контекст, Job-to-be-Done, паттерны поведения, боли. Вход: бриф, конкурентный анализ, аудит. Выход: personas.md.

07 · Симуляция интервью

Агент отвечает от лица персоны бытовым языком и не подыгрывает. Помогает найти слабые места в ваших предположениях. Вход: personas.md. Выход: interview_*.md.

08 · Scope и приоритизация

Собирает все фичи из артефактов, раскладывает их по MoSCoW и определяет MVP. Вход: все файлы проекта. Выход: features_list.md, prioritization.md, mvp_scope.md.

09 · PRD в Notion

Собирает PRD (цели, метрики, аудитория, конкуренты, фичи, scope) и публикует его в Notion. Вход: все файлы проекта, подключённый Notion. Выход: страница PRD в Notion.


level_02. Дизайн в Figma

Главное правило: сначала текст и ваше подтверждение, потом Figma.

figma_mcp

Подключает Figma MCP и задаёт правила работы с ним. Запускается один раз, до остальных директив level_02.

prd_to_sitemap

Из PRD делает sitemap и user flow: сначала в тексте с согласованием, потом рисует в FigJam. Выход: sitemap и user flow в проекте и в FigJam.

wireframes

Low-fi вайрфреймы 3–5 ключевых экранов: сначала структура каждого экрана в Markdown, потом отрисовка в Figma. Выход: вайрфреймы в Figma.

ds_baseline

Стартовая дизайн-система с нуля: бриф из 5 вопросов → токены Primitive и Semantic → Figma Variables → 5–7 базовых компонентов. Выход: ds/foundation.md, ds/components.md, раздел Foundation в Figma.

ds_scan

Индексирует готовую дизайн-систему (корпоративную или из Figma Community): читает Variables и компоненты и делает из них компактный справочник для агента. Выход: ds/foundation.md, ds/components.md.

grow_ui_kit

Добавляет недостающие компоненты на тех же токенах и проверяет, что не появились дубликаты. Выход: новые компоненты в разделе «UI Kit — extended».

component_variants

Дополняет компонент недостающими вариантами, состояниями и размерами. Можно для одного компонента или для всех по очереди.

final_screens

Собирает финальный экран из вайрфрейма и компонентов ДС, включая пустое состояние, загрузку и переполнение. Выход: экраны в разделе Screens, описание в ds/screens/.

screens_audit

Проверяет все экраны на консистентность с дизайн-системой по 6 пунктам и выдаёт отчёт. По умолчанию ничего не меняет, исправляет только с вашего подтверждения.


Level_03. Код

react_base

Разворачивает React-проект и переносит в него дизайн-систему один в один: токены и компоненты с теми же именами. На выходе тестовая страница со всей ДС. Вход: папка ds/, подключённый Figma MCP, Node.js.


dop. Дополнительно

quickstart

Самодостаточная стартовая директива. Положите её в пустую папку и скажите «выполни quickstart». Агент расспросит, что у вас есть (идея, Figma, код или HTML), развернёт среду и доведёт до связки «React ↔ Figma».

grab-web

Инструмент, который снимает любой сайт: скриншоты в трёх ширинах, HTML и CSS, картинки, шрифты, дизайн-токены и карту секций. Подходит для редизайна или разбора референсов. Установка описана в dop/grab-web/README.md.

Бренд-скиллы

Три скилла, которые работают по цепочке:

  1. Creative Director находит центральную идею бренда: позиционирование, тон, манифест.
  2. Reference Director собирает референсы с обоснованием: что можно заимствовать, а что нет.
  3. Art Director превращает идею в визуальную систему: типографика, цвет, композиция, правила.

Установка описана в dop/brand-trio-skills/README.md.