Использование DESIGN.md для AI-агентов
Инструкция по внедрению файлов анализа дизайн-систем в проект для автоматической генерации интерфейса с помощью LLM
Требования
- Наличие проекта с исходным кодом
- Доступ к AI-кодинг агенту (например, Claude Code, Cursor или GitHub Copilot)
Выбор дизайн-системы
Перейдите в репозиторий awesome-design-md и выберите файл DESIGN.md, соответствующий визуальному стилю вашего бренда или популярной дизайн-системе, которую вы хотите имитировать.
Добавление файла в проект
Скопируйте содержимое выбранного файла и создайте в корне вашего проекта файл с названием DESIGN.md. Этот файл служит контекстным руководством для AI-агента, описывая токены, правила отступов и стилистику интерфейса.
touch DESIGN.mdИнструктаж AI-агента
При создании новых компонентов или страниц укажите агенту, что он должен опираться на спецификации из файла DESIGN.md. Это позволит избежать ручного описания стилей в каждом промпте.
Создай страницу авторизации, строго следуя правилам оформления и дизайн-токенам из файла DESIGN.mdПроверка и итерация
Проверьте сгенерированный UI на соответствие выбранной системе. Если агент отклоняется от стиля, попросите его проанализировать конкретный раздел в DESIGN.md и исправить несоответствия.
Использование DESIGN.md для AI-агентов
Инструкция по внедрению файлов анализа дизайн-систем в проект для автоматической генерации интерфейса с помощью LLM
Предварительные требования
- Наличие проекта с исходным кодом
- Доступ к AI-кодинг агенту (например, Claude Code, Cursor или GitHub Copilot)
Шаг 1: Выбор дизайн-системы
Перейдите в репозиторий awesome-design-md и выберите файл DESIGN.md, соответствующий визуальному стилю вашего бренда или популярной дизайн-системе, которую вы хотите имитировать.
Шаг 2: Добавление файла в проект
Скопируйте содержимое выбранного файла и создайте в корне вашего проекта файл с названием DESIGN.md. Этот файл служит контекстным руководством для AI-агента, описывая токены, правила отступов и стилистику интерфейса.
touch DESIGN.md
Шаг 3: Инструктаж AI-агента
При создании новых компонентов или страниц укажите агенту, что он должен опираться на спецификации из файла DESIGN.md. Это позволит избежать ручного описания стилей в каждом промпте.
Создай страницу авторизации, строго следуя правилам оформления и дизайн-токенам из файла DESIGN.md
Шаг 4: Проверка и итерация
Проверьте сгенерированный UI на соответствие выбранной системе. Если агент отклоняется от стиля, попросите его проанализировать конкретный раздел в DESIGN.md и исправить несоответствия.