Кубики и рогалики в средиземье: разработка игры на svelte с применением ChatGPT и stable diffusion
Я решил попробовать использовать ChatGPT для создания игр и хотел выбрать что-то простое, что можно сделать за несколько вечеров. В итоге, в сотрудничестве с ChatGPT, мы пришли к идее пошагового рогалика, где основной механикой является бросок кубика. Финальный результат можно посмотреть здесь https://dicequest.vercel.app/
После нескольких итераций запросов, мы сформировали следующую механику игры: после победы над врагом пользователь может выбрать навык, улучшающий его характеристики. Главной особенностью игры является использование броска кубика в качестве базовой механики.
Разработка с использованием ChatGPT
Получить полный код игры сразу у ChatGPT не получится из-за ограничения на размер ответа. Поэтому я использовал следующие приемы:
Попросить написать файловую структуру проекта, а затем запрашивать каждый компонент по отдельности.
Попросить написать код, но закомментировать большие функции, которые уже были получены.
Я использовал версию ChatGPT 4, так как код от нее содержит меньше ошибок и лучше поддается корректировке.
После первой итерации я получил следующую разметку:
Первый вариант дизайна выглядел не очень впечатляюще, поэтому я запросил улучшения:
can you add appealing and amazing lord of the rings style to Player.svelte
Затем я попросил переделать компонент игрока так, чтобы он выглядел как игральная карта
Can you remake the player component to look like a playing card?
После нескольких итераций улучшения, я остановился на следующем варианте дизайна:
Логика битвы
Я запросил у ChatGPT логику битвы, и получил следующий результат:
https://svelte.dev/repl/3736b9c89ade4fac83f86c2456833ace?version=3.58.0
Концепция была понятна, но требовала доработки, чтобы всё работало без ошибок. Например, в коде менялись имена переменных (сначала было currentHealth, затем curHealth), что вызывало затруднения. Или добавлилсь вызовы функций, которых ранее не было. Тем не менее, это малая плата за значительный буст скорости разработки.
Анимации
Наша игра пока не выглядит впечатляюще, попробуем с помощью Chat GPT сгенерировать анимации.
Попросим СhatGPT сделать анимацию фаербола.
https://svelte.dev/repl/c9d511d269ac4f8293da5f77b28ecc2c?version=3.58.0
Хм, видимо, в нейросетевом мире именно такие фаерболы. Идем дальше. Попробуем создать анимацию лечения.
https://svelte.dev/repl/06094df1f63e4d0cbd9541dd8d04c2cc?version=3.58.0
Простенько, но со вкусом. А что будет, если попросить сделать анимацию на tree.js?
Can you create enemy defeat animation with three.js?
Получился базовый пример из обычного туториала. Не сдаемся, пробуем уточнить запрос.
Can you create something like an explosion?
https://svelte.dev/repl/d8c851cff68a4b48a968ad403f5d3e3d?version=3.58.0
ВАУ! Это впечатляет! Кажется, святой грааль найден! Продолжаем, просим сделать анимацию атаки.
Awesome! Could you create an attack animation with three?
https://svelte.dev/repl/e176512e074f4a29a86e8fbcd3b9b2de?version=3.58.0
Весьма неплохо! Немного в измененном виде эта анимация вошла в итоговую версию игры. Как дела с нашим многострадальным фаерболом?
Could you change the fireball animation? It could be like burning ball, moving from left to right
https://svelte.dev/repl/6a8dfcf6731148ad9335c802cafd6d18?version=3.58.0
Неплохо, но вау эффекта не вызывает. Спустя несколько итераций я так и не добился хорошего результата и от фаербола отказался. Что насчет анимации лечения?
Could you create a healing animation with a tree?
Уточняю запрос
Сould you remake this animation, and make it more dynamic, maybe some particles?
https://svelte.dev/repl/ce59812d1d004fa29361de6b3b4ea977?version=3.58.0
Невероятно! Забираем в проект. Что насчет анимации удара мечом?
Can you generate attack animation? the animation may look like a trail from a swing of a sword
https://svelte.dev/repl/ae7fd57d9f2549089ab349aecca07fea?version=3.58.0
Забавно, но не более. Получить красивый вариант анимации мне так и не удалось, поэтому останавливаемся на анимации частиц из предыдущих этапов.
Из анимаций у нас остался бросок кубика. Посмотрим, насколько ChatGPT хорош.
Can you make dice roll animation?
https://svelte.dev/repl/30497bcbbd9445989cbe2976059170b9?version=3.58.0
Хм, этот вариант на css анимациях, я попросил переделать на tree.js
Could it be in three.js?
Бум! То, что надо. Этот вариант я доработал вручную и использовал в игре.
Основные строительные блоки игры были готовы, и дальше я допилил их вручную до необходимого результата. Переходим к генерации игрового арта.
Генерация арта
Для генерации арта я использовал сервис Stable Horde (https://stablehorde.net/), который представляет собой невероятную идею использования распределенных вычислений для генеративных сетей. Рекомендую ознакомиться с этим сервисом и попробовать его. В качестве пользовательского интерфейса я использовал ресурс Stable UI (https://aqualxx.github.io/stable-ui/).
Исследовав несколько популярных моделей, я выбрал комбинацию Deliberate с постобработкой GFPGAN для создания игрового арта. Я обратился к ChatGPT для генерации промптов, которые были использованы для создания аватаров врагов, вдохновленных вселенной Властелина Колец.
Попросим chatGPT сгенерировать промты
Could you generate 5 prompts to generate enemy avatars with help of stable diffusion?
Stable diffusion allows for the generation of images based on textual prompts. Here are five prompts to generate enemy avatars that are inspired by the Lord of the Rings theme:
1. A menacing Nazgûl wearing a dark hooded cloak and wielding a long, sinister sword
2. A hulking troll with rough, stone-like skin and large tusks, wielding a massive club
3. A cunning goblin with green, scaly skin, pointy ears, and sharp teeth, armed with a jagged dagger
4. A twisted orc with a muscular build, red eyes, and battle scars, holding a crude axe
5. A fearsome Uruk-hai with dark, thick skin, a prominent brow ridge, and carrying a large, spiked mace
Отлично, скармливаем Deliberate, завариваем чай и ждем результат.
Не обошлось и без забавных казусов. Например, эльфийка, проткнутая стрелой.
Или кроссовер со вселенной DC
Для заднего фона я также сгенерировал промты в chatGPT, а картинку получил в Deliberate.
Дополнительные функции
ChatGPT справляется легко с генерацией компонента open gprah разметки, и даже написания функции генерации картинок на node.js, которая подтягивается, когда пользователь шарит результат в мессенджерах.
ChatGPT с легкостью предлагает новые скилы и механики игры, поэтому с должной степенью усидчивости можно получить невероятную игру с крутыми механиками и анимациями.
Также я обратился к ChatGPT с просьбой предложить способы монетизации игры. Хотя полученный набор оказался стандартным, включая внутриигровые покупки, рекламу и платные функции, это может быть полезной отправной точкой для разработки стратегии монетизации. Я не внедрил эти функции в свою игру, но вот несколько забавных примеров рекламных блоков, основанных на промптах от ChatGPT:
Выводы
Используя ChatGPT и Stable Diffusion, за неделю работы по вечерам я смог создать забавный рогалик, который вы можете опробовать здесь: https://dicequest.vercel.app/
Исходный код тут: https://gitlab.com/az67128/dicequest
ChatGPT способен:
Предлагать идеи.
Генерировать строительные блоки вашего приложения.
Значительно ускорять разработку.
Предлагать тексты для игры, включая диалоги.
Генерировать промты для арта.
Помогать выйти из творческого затруднения, когда вы зашли в тупик.
Однако, ChatGPT пока не умеет:
Собирать проект с нуля до результата, вам все равно понадобится ручная доработка.
Полностью быть в контексте. Иногда часть предыдущей истории, как будто, забывается, и ChatGPT выдает не релевантный результат, как в коде, так и в тексте.
Придумывать прорывные идеи. Знания ChatGPT базируются на существующем опыте, поэтому создать что-то совершенно новое и уникальное может быть сложно.
Тем не менее, ChatGPT является мощным инструментом, который может существенно помочь в разработке игр и других проектов. Он может предложить разнообразные аспекты игрового процесса, от кода и анимаций до стратегий монетизации. Думаю, через пару лет подходы к разработке сильно изменятся, вплоть до появления новых профессий операторов ChatGPT