Опыт написания игры с помощью Ai-инструментов. От идеи до прода
Как-то раз я прочитал новость про то, что какой-то умелец написал браузерную игру с самолетиками с помощью AI. Понимая, что технологии искусственного интеллекта сейчас развиваются семимильными шагами, я решил, что не пощупав это все руками, велик риск остаться на обочине прогресса в обозримом будущем. И я решил, что надо сделать что-то свое. Я не хотел делать что-то очень простое, чтобы все-таки приблизиться к условиям реальности, но и не хотел делать какой-то непонятный сервис ради сервиса, который будет делать непонятно что. Поэтому я решил тоже написать игру. Очень хотелось сделать что-то интерактивное, когда ты можешь играть с кем-то живым. Но при этом от не хотелось красть идею парня из новости и я вспомнил про времена детства, когда я кучу времени проводил в пвп-браузерках, где нужно было «драться», выбирая области для атаки и для защиты. Так родилась идея. В качестве инструмента я решил использовать IDE Cursor. Я посчитал полезным поделиться этим опытом через призму того, как технология может повлиять на процессы в компании.
tldr;
Да, у меня есть технический бекграунд, но я не писал код уже лет 5-6. И я написал полностью рабочую игру, используя ИИ. Так что это реально.
Первые шаги
Так как в новости, которая меня вдохновила, говорилось, что игра была написана за один день, я погугли, что из себя вообще представляет этот самый курсор и сказал ему — сделай мне игру :) В целом, примерно такой промпт я ему и закинул, добавив, конечно, что хочу получить в итоге.
> Важно, что я не программист, я занимаюсь управленческой работой. Точнее сказать, что уже не программист — технический бекграунд у меня есть и я понимаю, как вообще эта вся магия работает, как подготовить схему БД, чтобы она соответствовала бизнес-логике, что такое архитектура и т.п.
И каково было мое удивление, когда в папке проекта начали появляться в файлы с кодом, а по окончанию генерации мне IDE'шка мне подсказала, что нужно сделать, чтобы запустить проект. И он запустился. Да, до чего-то prod-ready там было супер далеко, но впечатление на меня это все произвело ошеломляющее. Так я пообщался с IDE еще примерно с полчаса, получил какое-то пре-пре-пре-альфа MVP, попросил сконвертить приложеньице в телеграмм mini-app, посмотрел как были добавлены какие-то правдоподобные заисимости и приложение перестало запускаться, так как ему стало не хватать юзерских данных, которые библиотеки ожидали получить от телеграмма, я понял, что все реально и решил со своим невероятным получасовым опытом начать все с чистого листа и с более глубокой подготовкой.
V2
Я понял, что мне нужно разделить приложение на клиент и сервер и научить их общаться между собой. Также я поболтал chatGPT насчет схемы для БД и попросил подготовить детальное описание структуры проекта для старта.
И вот опять я скармливаю описание, получаю на выходе запускающийся скелет и начинаю уже пошаговый диалог о том, какой функционал я хочу видеть на каждой страничке. Так, шаг за шагом я шел к тому, что у меня появились основные внутриигровые блоки — инвентарь, возможность надевать и снимать вещи, система боя. Хочу отметить, что я на тот момент имел опыт работы с этой IDE всего в пару-тройку часов, а также дефолтную темную схему в самом курсоре, кнопку «создать новый чат» я не замечал долго (до следующего дня :)). И из-за этого я все писал в и писал в одном чате. У этого были и плюсы, и минусы. Плюсы — все мои просьбы выполнялись весьма и весьма неплохо. Минусы — все люто и бешено тупило. Поэтому продолжение работы становилось все больше похожим на реальную жизнь — даешь задание и уходишь заниматься своими делами :-)
Слава богу, потом я обнаружил неприметную кнопочку «новый чат» и перешел в него. И познакомился с тем, что такое «контекст». Если коротко — это то, что постоянно теряется и из-за чего программирование с ИИ в данный момент не может обходиться без реальных людей в энтерпрайзе.
Так как на этом этапе я все еще общался с курсором как с человеком, я прочувствовал всю боль в полной мере. Первые запросы в новом чате приводили к тому, что нужный код удалялся, появлялись непонятные файлы для существующей логики, когда вместо обработчика битв в файле с названием battles курсор создавал новые с название fights и т.п. Не одну порцию изменений мне пришлось откатить, прежде чем я понял, что новые чаты нужно начинать с каких-то вводных, что из себя представляет проект. Также в погружении в контекст неплохо помогают «думающие» модели, которые анализируют запрос и пытаются сопоставить его с тем, что происходит в проекте.
В итоге, общение как с человеком, неконтроллируемая генерация кода и зависимостей файлов друг от друга привели к тому, что у меня окончательно поломались некоторые функции, которые, при попытке их починить, ломали что-то другое. И я понял, что пришло время начинать все заново. На вторую версию я потратил пару вечеров и почти все запросы к стандартной модели.
Ошибки, которые я допустил:
- общался с IDE как с человеком
- проигнорировал то, что для каждой страницы были заготовлены отдельные файлы стилей
- не заложил в архитектуру то, что приложение должно в будущем стать телеграмм mini-app'ом
- не следил за тем, что мне генерировал ИИ
V3
Тут я решил подойти к решению со всей серьезностью. Если в первых двух попытках я все полностью отдавал на откуп самому курсору, в этой я решил контроллировать все с самого начала, а также воспользоваться сервисом для генерации дизайна. Для начала я попробовал Galileo AI, который, по советам чата GPT и по уверенному первому месту во всяких топах, обещал решить мои проблемы на раз-два. Но первые запросы и сгенерированный результат в виде всякой дичи меня очень испугал. Тогда я попробовал дургой случайный инструмент UXpilot, который мне понравился намного больше. Да, он еще пока в какой-то бета версии, но результат получается очень прикольным. По сути, этот инструмент генерирует сразу разметку. Но также можно экспортировать экраны в фигму. Забавно, что сперва я пытался получить разметку из фигмы тоже с помощью AI, используя сервис Locofy. И после того как после танцев с бубном мне удалось подключить этот Locofy к макету в фигме и анализа макета — мне был выставлен счет в 108 баксов за генерацию одного экрана, да еще и с абсолютно непонятным результатом, я подумал, что, наверное, пока откажусь :-)
Позднее я понял, что можно забирать разметку прям из uxpilot'а и скармливать ее курсору в виде примера. И для меня это отлично работало. Хоть и с минимальными ручными правки, но работало.
Итак, к генерации проекта я подошел подготовленным. У меня был дизайн и неудачный, но все же опыт, из второго подхода.
По архитектуре приложения я ничего особо не менял, кроме того, что избавился от индивидуальных файлов стилей для каждой страницы. Но при этом, при генерации кода я внимательно следил за тем, что и где появляется и при малейших попытках размыть ответственность логики — просил провести рефакторинг для того, чтобы кодовая база была чистенькой. Это дало свои плоды — во-первых, я знаю, где что лежит; во-вторых, проще передать контекст в курсор, чтобы он корректнее обрабатывал мои запросы.
И несмотря на то, что что я продолжаю общаться с курсором скорее как с человеком, а не формулирую ему идеальные промпты, в формате — в каком файле поправить какие строки, поддержание довольно строгой архтитектуры и полученные опыт, как грамотно подбросить контекст — позволяет довольно неплохо развивать проект и иметь возможность добавлять различную сложную бизнес-логику.
Лично для меня пока открыт вопрос по тому, как быть с качественным тестированием. Но, думаю, и этот вопрос решаемый.
Но в итоге, у меня все получилось :-)
Инструменты, которые я использовал:
- chatGPT — консультации по инструментам, подготовка начального ТЗ для курсорм, консультации по настройке nginx и postgres для прода, написание простеньких скриптов для деплоя и т.д.
- UX pilot — генерация дизайна
- Cursor IDE — генерация кода
- Midjorney — генерация ассетов
Выводы
Одной из моих целей в этом исследовании было понять, можно ли внедрять новые технологии в компании. И мой вердикт — не только можно, но и нужно. Не начав внедрять их сейчас — вы лишаете себя конкурентного преимущества через год-два, когда LLM сделают очередной эволюционный скачок. То, что мне удалось написать полностью рабочий проект — доказательство того, что заменить целый продуктовый отдел одним человеком точно можно. Да, не везде и не для всех. Но и возраст нейросетей, по сути, смешной — пара лет. И с динамикой их прогресса — это вопрос довольно короткого времени. Куда более короткого, чем обычно требуется для перестройки процессов в крупных компаниях.
Советы и забавные факты:
- если испытывает проблемы с контектстом — используйте rules или подготовьте описание проекта и добавляете файл в чат вручную перед какими-либо запросами
- чаще коммитьтесь — т.к. вы точно будете сталкиваться с каким-либо галлюцинациями, иметь под рукой версию, на которую можно откатиться, не опираясь на инструменты самого курсора — отличная идея
- пример галлюцинаций — я просил почистить файлы от логов — их нужно было просто закомментить. Но почему-то на третьем-четвертом файле курсор уже придумывал себе контекст сам и начинал придумывать какую-то новую логику ни к селу, ни к городу.
P.S
Так как интерес к экспериментам у меня только разгорелся, я решил создать канал t.me/ai_gamedev. Я обязательно буду делиться там различными интересные наблюдениями, советами и прикольными историями. Можете узнать там мой опыт, как меня обманул чат GPT и почему нельзя ему доверять :-)
P.P.S
Если кому интересно, что у меня получилось, можете попробовать поиграть с друзьями — t.me/combatano_bot