Игра за 2 месяца с помощью ChatGPT, Midjourney и мозгов (Часть 1)

Данная статья изначально была написана для vc.ru, но как заметили в комментариях, она больше подходит для DTF.ru. Поэтому дублирую её и сюда.

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

Сразу скажу, не вышло. Как сказал мой друг - получилось Марио вид сверху.

Когда-то году в 2007 я начинал свою карьеру (ага, карьерой назвать сложно, но как заменить этот термин хз) с программирования игр под кнопочные телефоны. А раз я сейчас программист flutter, то и выбор стека напрашивается сам собой. В итоге звезды сошлись на движке flame. Если кто не знает, это такой простой в своей основе игровой движок на dart. В нем есть все самое основное (что когда-то приходилось писать самому руками. Например игровой цикл, загрузку и кэширование графики, базовые столкновения объектов и т. д.)

Но история не о движке. История о создании этой самой игры maze runner (Ну не умею я придумывать названия). Те кто знаком с инглиш знают что это переводится как «бегущий в лабиринте». Собственно идея на поверхности. Есть персонаж, который бежит по лабиринту, а игрок должен вовремя нажимать две кнопки: поворот налево или направо. Ну как раньше на старых игровых консолях

Старая игровая консоль
Старая игровая консоль

Если игрок не успевает повернуть, он погибает. Обычно в подобных играх героя окружают стены. Ну не об стену же ему убиться, значит надо было сделать так чтобы шаг влево шаг вправо <зачеркнуто>расстрел</зачеркнуто> и персонаж падает в… и тут идея начала приобретать новые очертания: Игрок бежит по дороге, а вокруг пропасть. Вот только с чем может быть эта пропасть? Ну например с водой/огнем/лавой… Отлично, начало положено. Но есть один нюанс, <зачеркнуто>чукча</зачеркнуто> Я не дизайнер, я программист. Хотя опыт фотошопа у меня когда-то был, его явно недостаточно чтобы нарисовать всю ту красотень, которая была у меня в голове.

Можно привлечь дизайнера, но кажется для этой идеи это, имхо, мальца перебор. Денег жалко и времени это занимает ого-го. Ну а поскольку сейчас самый хайп всех этих сетей, то было принято решение, а почему бы и Да. В итоге я решил попробовать сделать уровень с помощью Midjourney
Далее будет много картинок/трафика. Я постараюсь во всех подробностях описать все плюсы и минусы использования сервиса генерации изображений для игры.

Главное меню

Игра начинается не с кофе, а с главного меню. Это первое что видит игрок, поэтому и моя история начинается с него же. Поскольку игра в 2D, а дизайнера у меня нет, то подумалось что неплохая идея сделать её «под pixel art», тем самым можно скрыть некоторые огрехи.

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

В галлерее вы можете наблюдать разнообразные сгенеренные варианты Пример одного из запросов: Pixel art style. It is main screen for game. the girl in t-shirt run by bridge in maze. On background a lot of waterfalls.

В итоге был выбран вариант

Запрос: Pixel Art style. A girl in t - short look at far gates on the background. background there are clouds, rocks, a cliff and waterfalls
Запрос: Pixel Art style. A girl in t - short look at far gates on the background. background there are clouds, rocks, a cliff and waterfalls

Из интересного, для Pixel Art, сеть генерит сильно более однообразные изображения. Персонаж почти всегда в середине, фон очень симметричен относительно персонажа. Иногда получается изометрия. Как удавалось этого избежать расскажу чуть позже.

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

A very beautiful girl in a T-shirt runs on a suspension bridge holding a torch in her hands. Enlarge her face. 
A very beautiful girl in a T-shirt runs on a suspension bridge holding a torch in her hands. Enlarge her face. 

Сеть не умеет увеличивать лица или что угодно по запросу, например: Enlarge her face.

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

Финальный экран

Ну ок, с изображением меню разобрались. Но что делать если игрок, не дай бог, выиграет? Надо же и на финальный экран создать изображение. Хотелось чтобы игрок выбирался из лабиринта, как бы попадал, по классике, куда-то с сокровищами. Ну не просто же так он жизнью рисковал. Сказано сделано.

Вначале хотелось изобразить просто руки с драгоценностями… Но как бы это по мягче казать… Судите сами, запросы/ответы

Я не буду описывать все варианты запросов. Они отличаются путем добавления описания девушки или пещеры. В общем было сгенерировано достаточно много изображений, они все в галлерее

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

В итоге было выбрано вот это изображение

Add gold and lights. a lot of details. in style pixel art.
Add gold and lights. a lot of details. in style pixel art.

Теперь следим за руками. Это изображение было одним из вот этих

Add gold and lights. a lot of details. in style pixel art.
Add gold and lights. a lot of details. in style pixel art.

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

Add gold and lights. a lot of details. in style pixel art.
Add gold and lights. a lot of details. in style pixel art.

Это было сгенерировано из 4го варианта с этого изображения

Add gold and lights. a lot of details. in style pixel art.
Add gold and lights. a lot of details. in style pixel art.

В основе которого лежало вот это

Pixel art with lot of details style. Woman in white t - shirt and blue shorts from back. luminous, diamonds, gold coins inside the cave
Pixel art with lot of details style. Woman in white t - shirt and blue shorts from back. luminous, diamonds, gold coins inside the cave

А у этого изображения базовым было

Pixel art with lot of details style. Woman in white t - shirt and blue shorts from back. luminous, diamonds, gold coins inside the cave
Pixel art with lot of details style. Woman in white t - shirt and blue shorts from back. luminous, diamonds, gold coins inside the cave

Которое было вариацией 2го изображения из вот этого запроса

Pixel art with lot of details style. Woman in white t - shirt and blue shorts from back. luminous, diamonds, gold coins inside the cave
Pixel art with lot of details style. Woman in white t - shirt and blue shorts from back. luminous, diamonds, gold coins inside the cave

Далее я больше не буду описывать это так подробно. Но чтобы было понятно, как строился процесс это важно было объяснить.

Экран смерти персонажа

Параллельно шла разработка игры. Писался код, осваивался фреймворк. В качестве шаблона для персонажа использовались бесплатные тайлы от других игр, которые свободно лежат в сети (конечно же в игре от них ничего не осталось, они ушли на свалку истории. Вместо них честнонагенеренные, уникальные изображения). И вот я подошел к этапу, когда пора бы героине не только бегать , но и начать умирать… Точнее тонуть, так как первым (а в итоговом варианте последним) был уровень с водой.

К уровню мы доберемся чуть позже. А пока давайте попробуем с помощью сети утопить нашу героиню. Если вы думаете что это просто, то вы ошибаетесь. Задумка была простая: девушка в белой футболке тонет. Запрос соответсвенно тоже простой: Поскольку я уже тогда понимал что лица будут постоянно разные (а в pixel art часто и неудачные) , то попробовал по той же схеме что и до этого, изобразить её со спины.

A drowned girl in a white T — shirt and blue shorts underwater view from the back. Pixel art style. Lots of details.
A drowned girl in a white T — shirt and blue shorts underwater view from the back. Pixel art style. Lots of details.

И как вы можете видеть, как-то не похоже что она тонет.

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

Общее количество картинок чуть менее 200 и это только для смерти через утопление.

Первая часть

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

Уберем Pixel Art, чтобы добавить разнообразия в генерацию.Я пытался сделать запрос что-то вроде

Body drowning girl, white t — shirt, blue shorts, red hair, belly up, arms down, legs down, underwater. The eyes are closed. Lots of details.

Забавный момент, когда решил с тем же запросом опять попробовать Pixel Art

Body drowning woman, white t - shirt, blue shorts, red hair, belly up, arms down, legs down, underwater. The eyes are closed. Lots of details. in pixel art style
Body drowning woman, white t - shirt, blue shorts, red hair, belly up, arms down, legs down, underwater. The eyes are closed. Lots of details. in pixel art style

Как-то совсем не похоже на страх и ужас: )

Вторая часть

В какой-то момент были идеи чтобы героиня была изображена сверху, тянущаяся к вам с вытянутой рукой. Этот эффект у меня так не получился ни разу.

Сеть ни в какую не хочет генерировать что-то отличное от фронтального вида.

Body drowning girl, eyes closed, white t — shirt, blue shorts, red hair, one arm raised up, legs down, underwater. Blisters from the mouth. Seaweed. Lots of details. Pixel art style

В какой-то момент я пробовал объединить несколько картинок. Первая в галлерее ниже, это результат двух следующих

Откуда он взял этот автобус? С чего вдруг? ! Больше вопросов чем ответов.

Третья часть

Добавляем водоворот.

Запрос плюс минус такой: Pixel art with lots of details style. girls hand above whirlpool. red hair, lots of waves. water. dark
Как мы видим вместо просто женской руки, у нас тут девушка.

Четвертая часть

Сеть не умеет отличать когда нужна только женская рука. Сеть рисует девочку, если есть слово girl.

При этом если его убрать, то почти всегда там мужская рука. Собственно запрос: Pixel art with lots of details style. hand above whirlpool, view from the back, lots of waves. water. dark

Часть пятая

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

Часть шестая

Когда вроде бы нащупали то что нужно. Осталось только заставить эту дурацкую сеть сделать нам нужное количество пальцев. И чтобы ноги росли из задницы. И чтобы голова была похожа на человеческую. И чтобы… Ну вообщем смотрите на результат сами

Часть седьмая

Пробуем добавить морских гадов

Запрос: Body drowning woman with raised up arms and closed eyes with red hair and dressed in brown boots and white t — shirt and blue shorts. Underwater. Seaweed. Fishes, Lots of details. Octopus. Hyperrealistic 4k resolution

Часть восьмая

Ура! Насчупали чутка. Вот. Конец, как я думал, уже совсем близок. Осталось на основе этого изображения сгенерировать правильный Pixel Art. С руками как всегда большая беда. Но ничего.

Погнали &lt;зачеркнуто&gt; наши городских &lt;/зачеркнуто&gt;
Погнали <зачеркнуто> наши городских </зачеркнуто>

Часть девятая и последняя

Ну вот я и нашел то что меня устраивает. Руки спрятаны. Лицо в норме. Монстры есть. Пиксель, маму его, арт.

Игра за 2 месяца с помощью ChatGPT, Midjourney и мозгов (Часть 1)

Что хотелось бы сказать в конце

Вся эта генерация занимает дофигищи времени. И что-то мне подсказывает, что дизайнеры никуда не исчезнут, даже если сети станут генерировать все еще точнее и лучше. Кто-то же должен понимать что именно добавить/убрать. Как правильно создать запрос. Что эти сети могут, а что нет.

Вы когда нибудь попробуйте создать запрос с двумя персонажами на одной картинке, например Ежик и Лошадка в тумане. В лоб получилось вот это

Hedgehog and horse in mist. 2D
Hedgehog and horse in mist. 2D

Как вы потом увидите и постобработка тоже никуда не делась.
Если задаться вопросом: Можно ли сделать игру без дизайнеров?
Ответ будет: Можно, НО! И вот в этом "но" вся соль. Будет безумное количество ограничений.
А вот если поставить вопрос по другому: Поможет ли этот инструмент дизайнерам улучшить, ускорить и т.д. их повседневный труд, снять рутину или наоборот облегчит творческий поиск, то мой личный ответ - да.

Что дальше...

Нужно оценить и задуматься над объемом проделанной работы. Может быть я, конечно, что-то делал не так. Если кто знает как надо было, то просьба в комментах объяснить. Может приложить пример своего варианта.

Пора бы праздновать. Но впереди еще очень много работы. Вот краткая список того что, возможно, будет во второй части:

1. Генерация смертей: от огня (сжечь её оказалось так же тяжело, а то и тяжелее чем утопить) , взрыва, черной дыры, циркулярной пилы (там тоже есть много забавных моментов)
2. Создание уровней, начиная от тайлов дорог и кончая создания фонов для уровней в Midjourney целиком
3. Создание главного героя. Да-да, этой самой героини которую я за это время успел и полюбить и возненавидеть
4. Создание и генерация лабиринтов с помощью ChatGPT и, как я и обещал, мозгов. А то скажете еще в заголовке кликбейт, мозги тут нафиг не нужны были. Сиди картинки генерируй, кнопочки нажимай
5. Создание сюжета с помощью ChatGPT
6. Подведение итогов: сколько было всего сгенерировано изображений, сколько на это потрачено денег (да, я знаю что можно использовать бесплатно, но я оплачивал Midjourney чтобы иметь возможность легально использовать изображения, это же вроде так работает?)
7. Создание промо страницы с помощью Flutter и github. А вот и ссылка на нее, кстати

В данный момент Apple плюётся ошибкой (We are unable to process your request.
An unknown error occurred.) при попытке оплатить аккаунт. Но я победю, побежу, мы победим.

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

P. S. Реклама или встроенная покупка жизней в игре лишь упрощают прохождение. Игру пройти можно бесплатно. Сам проходил.

106106
39 комментариев

спасибо, было весело :D
я бы не рискнул смотреть на столько итераций умиротворенного утопления окологуманоидной девушки, а то потом придет во сне и спросит, оплатил ли я миджорней. :D

14
Ответить

Пхахаха

Ответить

Миджорни не подходит для таких задач. Это, по большому счёту, просто игрушка. Если тебе нужны специфические изображения - обучай сеть самостоятельно.

6
Ответить

Если вы имеете бюджеты и еще больше сил и времени, то наверное вы правы. Даже если использовать готовые модели, то где взять столько обучающих размеченных данных? А если они у вас уже есть, то зачем тогда вам всё это?

2
Ответить

Интересный опыт, спасибо что поделился

5
Ответить

>Enlarge her face.Такой рекламы я еще не видел )

3
Ответить

Комментарий недоступен

3
Ответить