Открываете любой сайт, вставляете домен, и получаете готовый DESIGN.md для AI-агента. Без ручного разбора цветов, шрифтов и блоков. Проект designmd.supply делает это автоматически и собирает документ на основе реальных данных страницы.
Самое интересное, что система не фантазирует. Она берет живые параметры сайта, скриншот и текст страницы, а потом складывает всё в один понятный файл. Такой формат можно сразу отдавать в GPT, Claude или другой AI-инструмент.
Вместо хаоса в дизайне, один файл для всей команды и AI
Главная боль знакома многим: брендбук есть не у всех, а единые правила дизайна нужны уже сегодня. Особенно когда контент, лендинги и баннеры делаются в темпе "нужно вчера". Здесь сервис превращает сайт в самодостаточный дизайн-документ.
Внутри файла уже есть ключевые разделы: цвета, типографика, отступы, компоненты, правила "можно/нельзя". Это удобно предпринимателю, маркетологу и разработчику, потому что все говорят по одному визуальному языку. Меньше споров, меньше переделок, быстрее запуск.
- Overview (краткое описание бренда и интерфейса)
- Colors (цвета и их роли в интерфейсе)
- Typography (шрифты, размеры, иерархия текста)
- Layout (сетка, отступы, структура блоков)
- Components (кнопки, карточки, формы, паттерны)
- Do’s and Don’ts (что усиливает стиль, а что ломает его)
Как это работает на практике: 4 API и один итоговый документ
Проект построен как небольшой Next.js-сервис, но логика очень практичная. Он дергает 4 источника данных параллельно, а затем собирает финальный промпт для модели. В итоге выходит DESIGN.md с YAML frontmatter (служебный блок метаданных в начале файла) и Markdown (простой текстовый формат разметки).
- Styleguide API получает design tokens (дизайн-токены: цвета, размеры, радиусы, отступы)
- Brand API тянет логотипы, фирменные цвета, слоган и категорию бизнеса
- Screenshot API делает качественный скриншот главной страницы
- Markdown API вынимает чистый текст сайта для контекста
Дальше данные сходятся в одном модуле и уходят в LLM (большая языковая модель) через Vercel AI Gateway (шлюз для работы с AI-моделями). Важный момент: система опирается на реальные payload (пакеты данных), а не на догадки модели. Поэтому результат обычно стабильнее, чем ручной запрос в духе "опиши мне стиль сайта".
Зачем тут кэш, Turso и батчи, и почему это важно бизнесу
Если домен уже обрабатывали, сервис отдает результат почти мгновенно из Turso (облачная база данных на libSQL). Это кэширование (временное хранение готовых данных) экономит время и деньги. Первый запрос тяжелее, повторные заметно быстрее.
Кэшируются и промежуточные данные, и финальный DESIGN.md. Даже если база временно недоступна, генерация не ломается, просто работает без сохранения. Для продакшена это хороший компромисс: пользователь получает ответ, команда не теряет лид.
- Первый заход по домену: сбор данных + генерация + запись в кэш
- Следующие заходы: выдача из кэша без лишних вызовов
- Каталог доменов грузится батчем (один запрос вместо многих)
- Если нет env vars (переменные окружения), сервис всё равно работает
Что реально изменилось для предпринимателей, маркетологов и разработчиков
Раньше нужно было собирать дизайн-правила вручную, часто по чатам и скриншотам. Теперь можно получить основу за минуты и сразу запускать AI-задачи. Это сокращает путь от идеи до публикации.
- Предприниматель: быстрее делегирует дизайн-задачи подрядчикам и AI
- Маркетолог: делает креативы в одном стиле, даже при частых кампаниях
- Разработчик: получает ясные UI-ориентиры без бесконечных созвонов
- Продакт: снижает визуальный шум между лендингом, приложением и рекламой
Технически запуск тоже простой: npm install, затем dev-режим и поиск по домену. Код открыт на GitHub, лицензия MIT, значит проект можно адаптировать под свои процессы. Для команды это шанс быстро построить внутренний "дизайн-радар" для десятков сайтов.
Ссылка на репозиторий: github.com/context-dot-dev/designmd-supply. Ключи для API берутся в Context.dev и Vercel AI Gateway.
Как применить прямо сейчас, даже без большого техотдела
Самый быстрый сценарий, если у вас 1-2 человека в маркетинге и постоянная гонка дедлайнов. Выберите свой домен, сгенерируйте DESIGN.md и используйте его как контекст в AI-чатах. Это резко повышает шанс получить макеты "в вашем стиле", а не абстрактный Dribbble-набор.
- Сгенерируйте DESIGN.md для основного сайта
- Сохраните файл в общую папку команды
- Добавляйте его в каждый AI-бриф на баннеры, тексты и UI
- Раз в месяц обновляйте файл после редизайна или смены оффера
Следующий шаг рынка уже виден: AI-помощники будут работать не по общим промптам, а по файлам-стандартам бренда. Побеждать начнут не те, у кого "самая умная модель", а те, у кого лучше упакован контекст бизнеса.