Большие языковые модели уже умеют писать код, который превращается в графики, веб-страницы, презентации и дашборды. Но у этого подхода есть слабое место: модель сначала генерирует код, а результат видит только после рендера. Если текст обрезался, кнопка уехала за край, подписи наложились друг на друга или контраст оказался нечитаемым, сама модель часто этого не понимает. В новой работе на arXiv, опубликованной в разделе CS.AI, исследователи предложили метод Visual-SDPO — обучение ИИ на визуальной обратной связи, чтобы он лучше создавал визуальные артефакты кодом.
Ключевая идея звучит просто: если человек исправляет слайд, он смотрит на картинку, а не только на HTML, Python или LaTeX. Значит, и модель нужно учить учитывать не только текст программы, но и то, как результат выглядит после исполнения. При этом авторы заявляют важное практическое преимущество: после обучения метод не добавляет стоимости инференса. То есть на этапе использования модель не обязана запускать дополнительный визуальный проверяющий модуль для каждого ответа.
В чем проблема кодогенерации для графиков, UI и слайдов
Генерация кода для визуального результата отличается от обычного программирования. Если модель пишет функцию сортировки, тесты быстро показывают: работает или нет. Но если она пишет код для слайда или веб-интерфейса, программа может быть формально исполнимой, а результат — визуально плохим.
Типичные дефекты хорошо знакомы всем, кто просил ИИ собрать презентацию или страницу:
- текст выходит за границы блока или обрезается;
- подписи на графике накладываются друг на друга;
- элементы интерфейса теряют выравнивание;
- цвета дают низкий контраст;
- карточки, кнопки и заголовки переполняют контейнер;
- в слайде нарушается композиция: всё формально есть, но выглядит «криво».
Проблема усугубляется тем, что рендереры обычно недифференцируемые: модель не может напрямую «протолкнуть» ошибку картинки назад в веса, как в классическом обучении нейросетей. Поэтому авторы пошли другим путем: они используют визуальный результат как привилегированный контекст для учителя, а затем дистиллируют это знание в ученика, который на инференсе снова пишет только код.
Как работает Visual-SDPO
Visual-SDPO расшифровывается как визуальная самодистилляция с оптимизацией политики. В упрощенном виде схема такая: модель генерирует код, код исполняется, появляется рендер, система находит визуальные дефекты, а затем «учитель» получает дополнительный контекст — картинку с ошибками или сообщение об ошибке исполнения. После этого знания учителя переносятся в «студента», который учится писать более удачный код сразу.
Самая интересная часть — Visual-Grounded Code Credit Weighting. Это механизм распределения ответственности: если на слайде обрезан заголовок, система пытается связать дефект не со всем кодом целиком, а с конкретными строками или фрагментами, которые отвечают за проблемный элемент. Поэтому обучающий сигнал усиливается именно там, где была причина визуального брака.
| Подход | Что учитывает | Главный минус | Что дает Visual-SDPO |
|---|---|---|---|
| Обычная генерация кода | Текст запроса и шаблоны кода | Модель не видит итоговый рендер | Учится на визуальных последствиях кода |
| Ручная правка | Глаз дизайнера или аналитика | Медленно и дорого | Автоматизирует часть исправлений |
| Оптимизация по успешному запуску | Исполнился код или нет | Исполнимый код может выглядеть плохо | Оценивает визуальное качество результата |
| Visual-SDPO | Код, рендер, ошибки исполнения и локализацию дефектов | Требует специального обучения | Не увеличивает цену использования после обучения |
Дополнительно авторы используют sequence-level GRPO — групповую относительную оптимизацию политики. Она награждает не отдельные токены, а удачные целые варианты: код должен исполняться и давать визуально качественный результат. Важная деталь: даже неудачные запуски не выбрасываются. Ошибки исполнения передаются учителю как привилегированный контекст, поэтому модель может учиться и на поломанных примерах.
Насколько Visual-SDPO улучшает генерацию слайдов и UI
Метод проверяли на трех направлениях: chart-to-code, UI-to-code и slide generation. В статье указаны бенчмарки ChartMimic, Design2Code и AeSlides. По сравнению с базовой zero-shot моделью Visual-SDPO дал прирост более чем на 10 абсолютных пунктов в основной метрике. По сравнению с GRPO улучшение составило как минимум 2,4 пункта, причем обучение потребовало меньше шагов.
Это не означает, что ИИ теперь идеально верстает презентации и интерфейсы. Но результат важен по другой причине: исследователи показывают путь от «модель написала синтаксически верный код» к «модель понимает, как этот код выглядит». Для генерации отчетов, аналитических дашбордов, лендингов и учебных материалов это принципиальная разница.
Главный смысл работы: визуальные ошибки нужно исправлять не постфактум внешним фильтром, а встраивать понимание рендера в само поведение кодогенерирующей модели.
Практические выводы для разработчиков и бизнеса
Для продуктовых команд это сигнал: если вы строите AI-инструмент для генерации слайдов, графиков или UI, одной проверки «код исполнился» недостаточно. Нужны визуальные метрики, детекторы перекрытий, анализ контраста, проверка переполнения блоков и связь найденных дефектов с исходным кодом.
Для разработчиков это полезная архитектурная подсказка. Вместо того чтобы бесконечно усложнять промпты вроде «сделай красиво и ровно», лучше собирать датасет рендеров с ошибками, хранить трассировку элементов и обучать модель на локализованной обратной связи. Особенно это актуально для сервисов, где ИИ генерирует презентации, HTML-макеты, SVG-графику или Python-визуализации.
Для пользователей вывод более трезвый: генераторы слайдов и интерфейсов станут надежнее, но не потому, что «модель стала дизайнером». Она просто получает более правильный учебный сигнал: не только какой код похож на хороший, но и какой визуальный дефект этот код вызывает.
Что дальше
Visual-SDPO выглядит как шаг к более зрелым AI-системам для визуального программирования. Следующий рубеж — не просто чинить наложения и обрезанный текст, а учитывать стиль, бренд-гайд, иерархию внимания и смысловую композицию. Это сложнее, потому что такие критерии менее формальны, чем переполнение контейнера или низкий контраст.
Тем не менее работа показывает практичный путь: визуальная обратная связь может улучшать генерацию кода без удорожания финального запроса. Если подход подтвердится в реальных продуктах, ИИ-презентации, автогенерация UI и код для графиков станут меньше походить на черновик, который обязательно должен чинить человек.
