Дизайн-harness: один бриф, десять эстетик

Большинство демо «AI рисует дизайн» заканчиваются одинаково. Получается гладко, технично и абсолютно безлико: тот же бежевый фон, тот же сиренево-синий градиент, те же скруглённые карточки. Узнаёшь по первому экрану, что это сделала модель.

Я пошёл другим путём. Вместо «один промпт - одна картинка» я собрал то, что называю дизайн-harness: связку из источников референсов, слоя вкуса и набора генераторов, сшитых в один процесс. На входе один бриф. На выходе готовый артефакт в той эстетике, которая нужна сейчас. Нужен космос, будет космос. Нужен терминал, риз-зин или швейцарская сетка, будет и это, из того же брифа.

Ниже сначала что он выдаёт, потом как он устроен.

Что он выдаёт

Самый честный пример - карусель, которую мы собрали для двухнедельного health-спринта (интенсив про здоровье через работу со своими данными). Один смысловой бриф: «самый честный AI-проект - это ты; у тебя тонны данных о себе и ноль решений». Дальше harness одел этот бриф в космос-тему: монохромная съёмка, угольный фон, крупный серифный заголовок с кириллицей, один кислотно-зелёный акцент.

Эти восемь слайдов - не сток и не чужой арт. Картинки сгенерированы под бриф (поэтому их можно публиковать), вёрстка и типографика собраны кодом, экспорт сделан в формат под Instagram 1080×1350.

А вот тот же самый бриф, прогнанный через другие движки harness:

Один тезис, пять характеров. В этом и точка: ценность не в одной красивой картинке, а в том, что эстетику можно менять как пресет, не теряя смысл и не сваливаясь в slop.

Из чего он состоит

Harness держится на трёх слоях. Порядок важен: сначала грунт, потом суждение, потом генерация.

Слой 1. Референсы (грунт)

Перед тем как открыть редактор, harness собирает короткий реф-бриф. Это правило, а не пожелание: без брифа дальше не идём.

• Mobbin - библиотека реально зашипленных интерфейсов (сотни тысяч экранов). Priority gate для любой UI-задачи: чтобы не сломать UX, сначала смотрим, как это решают живые продукты.
• Cosmos - широкое латеральное вдохновение: не-интерфейсные референсы, ретро-постеры, архитектура, фактуры. Нужно, чтобы результат не был «ещё одним дашбордом».
• minimal.gallery - кураторские сайты целиком, когда задача про веб-крафт.
• Библиотека стилей - 16 готовых направлений, от editorial luxe и clinical minimal до acid graphics и neo-brutalist. Каждый стиль это один лист с палитрой, шрифтами, motion-философией и готовыми поисковыми запросами.

Слой 2. Суждение (вкус)

Между референсом и генерацией стоит слой, который решает, что вообще делать и что не пропускать дальше.

• Оркестратор маршрутизирует задачу: лендинг это, нативный экран, карусель или иллюстрация, и подключает нужные скиллы.
• Каталог анти-slop фингерпринтов - список того, по чему AI-дизайн палится: дефолтные цвета, предсказуемая типографика, ленивые тени, generic-иконки. Это чек-лист «чего тут быть не должно».
• Скиллы на разрыв шаблона: метафоры, creative-break, продуктовое мышление. Включаются, когда результат «технически ок, но скучный».

Слой 3. Генерация (производство)

Только здесь рисуется пиксель. Генераторов несколько, потому что артефакты разные.

• Google Stitch - стриминговая генерация UI-экранов.
• Картиночные модели (Codex image_gen как дефолт, Nano Banana как fallback) - hero, иллюстрации, фактуры, прозрачные ассеты.
• Code-art - графика, которую рисует сам код: генеративные сетки в духе Молнар, анимированные SVG. Своя графика, ничей чужой IP.
• DESIGN.md - дизайн-система как код: токены в YAML плюс обоснование в Markdown, чтобы результат можно было зафиксировать и отдать в продакшен.

Сверху всего один вход. Команда /design <задача> запускает весь поток, а сам harness зеркалится между Claude Code, Codex и Antigravity (Gemini), так что процесс один и тот же, в каком бы из них я ни сидел.

Как из этого получается карусель

Карусель - хороший срез, потому что показывает, почему «сменить эстетику» стоит дёшево. Скелет один для всех вариантов: HTML с горизонтальным scroll-snap, панель 4:5, один тезис на слайд, шрифты на clamp() под высоту. Меняется только источник графики, и таких источников пять:

1. Кодом руками - вёрстка и типографика, как в terminal / riso / acid выше.
2. Code-art - графику рисует JS прямо на странице (генеративный Swiss).
3. AI-картинки - бриф уходит в image-модель, на выходе PNG как full-bleed фон (космос-вариант).
4. Лицензионное фото - чистый сток под один когерентный фильтр.
5. Мудборд из Cosmos - только для внутренних рефов, в паблик не идёт (чужой арт).

Финал у всех один: headless-браузер рендерит каждый слайд при 1080×1350 в PNG. Это и есть «сохранение карусели» под постинг. Проверка вёрстки тоже автоматическая: ноль overflow, ни одного переноса в середине слова.

Почему это harness, а не «промпт»

Картинку сегодня сгенерирует кто угодно. Разница в обвязке:

• референсы держат UX и не дают свалиться в generic;
• слой вкуса отсекает slop до того, как он попадёт в результат;
• генераторы взаимозаменяемы, поэтому эстетика это переключатель, а не переписывание с нуля;
• финальное «отправить» всегда за человеком. Harness готовит, предлагает, ставит в очередь. Публикую я.

Один бриф заходит. Любая эстетика выходит. На потоке, с проверками, без slop. В этом весь смысл.