UI-макеты в GPT Image 2.5: как проверять текст и сохранять компоновку

Для UI-макета в GPT Image 2.5 сначала задайте назначение экрана, иерархию и точные надписи, затем отдельно проверьте текст и компоновку. Результат — изображение, а не HTML, дерево компонентов Figma или приложение с проверенной доступностью. Нарисованные кнопки не выполняют действий.

Ниже — авторские примеры промптов и критерии проверки. Нового теста генерации UI через Ofox не проводилось; безошибочная кириллица не обещается.

Опишите задачу экрана

Фраза «красивый футуристический дашборд» не определяет главное действие. Ясные разделы и подписи позволяют проверить, соответствует ли изображение задаче.

Скриншот официального примера от 16 сентября 2026 года. Сохранён английский интерфейс. Пример и изображения принадлежат документации OpenAI; это не результаты теста Ofox.

Адаптируемый пример на русском, который не тестировался в этой статье:

Создай одно изображение десктопного интерфейса управления проектами.
Светлый фон, ясная иерархия, без декоративных диаграмм.
Слева навигация: Обзор, Проекты, Настройки.
Главный заголовок: Обзор проектов.
Под ним три строки проектов со столбцами Статус и Ответственный.
Справа вверху одна основная кнопка: Новый проект.
Каждая заданная подпись навигации, заголовка и кнопки — один раз.
Читаемый контраст, свободные интервалы, выровненные строки и столбцы.
Не добавляй рамку браузера, корпус устройства или выдуманную статистику.

Модель, размеры и качество задавайте параметрами запроса. Указание размера в тексте не заменяет параметр API. См. подключение API и допустимые размеры — на английском.

Сначала сравните модели при одинаковых условиях

OpenAI позиционирует Flare как вариант с приоритетом скорости, Sunburst — для задач с более высокими требованиями к качеству. Это отправная точка, а не гарантия для вашего экрана. В сравнении Flare и Sunburst есть небольшой исторический тест с оговорками.

Сохраняйте одинаковыми промпт, исходник, размеры и явную настройку качества, поддерживаемую обеими моделями. Сначала запишите несоответствия, затем меняйте инструкции. Иначе улучшение нельзя связать с конкретной причиной. Удачная английская надпись не доказывает качество плотного интерфейса с кириллицей.

Меняйте по одному элементу

Сохраните принятую версию и передайте её как исходник редактирования. Отделите изменение от того, что нужно оставить:

Измени только текст основной кнопки с «Новый проект» на «Создать проект».
Сохрани навигацию, заголовок, строки проектов, выравнивание столбцов,
положение кнопки, цвета и интервалы.
Не добавляй значки, подписи или разделы.

Это пример инструкции, а не гарантия сохранения пикселей. Сравнивайте всё изображение: исправленная кнопка может сопровождаться сдвигом столбца или ошибкой в другой надписи. Храните принятую версию и краткую историю правок. Для пиксельно точного сохранения используйте обычный редактор, вставляя одобренную правку в оригинал.

Проверяйте текст отдельно от композиции

Читайте мелкий текст в предполагаемом размере показа. OCR помогает найти подозрительные места, но не заменяет визуальную и языковую проверку.

Передайте разработчику спецификацию

Отдельно опишите шрифты, интервалы, состояния компонентов, ошибки, поведение и реальные данные. Доступ с клавиатуры, фокус и адаптивная вёрстка требуют реализации и проверки: изображение их не подтверждает.

Если точность текста критична, генерируйте визуальные материалы, а надписи размещайте обычными UI-компонентами. Так результат меньше зависит от текста, нарисованного моделью.