Как сделать дизайн + верстку с помощью ИИ?

Question

[Дмитрий]

На сегодняшний день chatGPT создаёт неплохой дизайн сайтов и верстку. Но не всё вместе. Например: я попросил сгенерировать дизайн сайта (см. рис. 1). Затем попросил сверстать полученный дизайн (см. рис. 2). То есть он не вытаскивает сгенерированные ранее картинки, а вставляет вместо них заглушки. Как быть?

Пробовал просить сгенерировать fig или psd — не получается.
Просил скинуть мне пак картинок в zip. Он прислал криво обрезанные картинки с черными квадратами.

Кто-нибудь решил этот вопрос? Или есть идеи, как можно сделать?
Может какой-то промпт задать, чтобы получить нормальный html+assets на выходе?

Comments

[rPman]

я не представляю, что бы текстовый ИИ мог хотя бы сносно сверстать по макету что то... визуальные скилы у них и так околонулевые, а там где работает - это просто заучили типовые задачи, если у вас не такая, то труба.

рано еще, еще не весь рынок рабочей силы убит

[Дмитрий]

rPman,

визуальные скилы у них и так околонулевые

Ну я бы так не сказал, судя по первому скрину. ИИ делают относительно хороший дизайн, многое зависит от промпта. И код пишут тоже норм, на уровне мидл. А вот всё вместе не получается сделать.
На счёт рынка - это вопрос для холивара, не готов обсуждать тут.

[rPman]

Дмитрий, это генератор картинок, для его создания требуется меньше понимание чем для верстки
Кстати, openai:chatgpt5.2 по просьбе на твою картинку верстку делает, но не уверен что тебе нужно именно это. Помимо картинки нужно уметь делать ее адаптивной в т.ч. к контенту, а в догонку еще и кроссбраузерной (хотя бы ПК/android/iphone) так там требуются очень специфические скилы, я не уверен что в обучающей выборке там вообще это лежит.. хотя использование различных (читай тяжелых) фреймворков для верстки оно конечно знает, и на простую задачу такого может наворотить.

Любой вопрос на сложную задачу разработки начинай с просьбы помоч составить техническое задание, пусть модель задает тебе вопросы а ты на них отвечай, типа

помоги создать техническое задание на ....текст задачи ... Если в задаче есть неточности и неоднозначности, или о чем то я забыл упомянуть, задавай наводящие вопросы до тех пор, пока задание не станет достаточным для того что бы начать разработку.

а затем, таская это ТЗ в шапке и проси дальше:

проанализируй это задание и предложи методы и технологии, с помощью которых ее можно решить. По каждому выдай основные достоинства и недостатки..

выбираешь из предложенных технологии, просишь составить план разработки и т.п.. так шаг за шагом получишь результат.

А вот в один короткий запрос ты получшь случайное говно.

Answer 1

[UniInter]

Не советую так делать. ЕИ засмеёт.

Answer 2

[Серёга]

Используй не chat gpt, а что-нибудь из этого:
DeepSeek Coder
Qwen
Gemini pro
Grok (±)
И еще какая-то нейронка забыл название