3D-игра на Three.js, в которой я не написал ни строки кода

3D-игра на Three.js, в которой я не написал ни строки кода

Полноценная 3D-игра на Three.js и Vite, собранная целиком через Claude Opus. Как ставить задачи, какие баги нейросеть находит сама и где без разработчика всё равно не обойтись.

Claude Opus пишет уже не отдельные функции, а проекты целиком. Я решил проверить, насколько далеко это заходит: поставил задачу собрать 3D-игру для браузера и за весь процесс не притронулся к файлам сам — ни одной правки руками.

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

Что вышло в итоге?

Игра называется NEON ARENA. Вы управляете капсулой на неоновой арене, оружие стреляет само по ближайшему врагу, с убитых падает опыт, за уровни выдаются апгрейды на выбор из трёх карточек. Каждые 60 секунд растёт сложность, каждые 5 минут прилетает босс с четырьмя схемами атак.

Технически это Three.js и Vite, без React и прочих фреймворков. 35 JS-модулей, около 6500 строк, продакшн-сборка весит 164 КБ в gzip. При 40 врагах, боссе, 161 снаряде и 340 частицах на экране кадр считается за 2.38 мс.

⬇ Скачать исходники игры

Как ставилась задача?

Главное тут не «напиши игру», а рамки, внутри которых модель работает. Первый промпт выглядел примерно так:

Мы делаем браузерную 3D-игру. — Ты ведущий разработчик, весь код пишешь ты. — Не проси меня править файлы руками. — Ошибки находишь и чинишь сам. — Three.js, Vite, современный JavaScript. — Без React, Vue и других фреймворков. — Код модульный и легко расширяемый. Сначала: проанализируй задачу, предложи структуру проекта и план по шагам. Код пока не пиши.

Последняя строчка важнее всех остальных. Модель сначала расписала структуру папок, объяснила выбор библиотек и разбила работу на 10 шагов — и только после подтверждения начала писать. Это дешевле, чем разгребать 3000 строк, которые уехали не в ту сторону.

Этап 1: прототип

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

Что понравилось — Opus не стал делать «лишь бы работало». Например, сам заложил фиксированный шаг симуляции с интерполяцией на отрисовке, чтобы игра одинаково вела себя на 60 и 144 Гц. И написал вот такую функцию сглаживания вместо наивного lerp:

// Сглаживание, не зависящее от частоты кадров. // lambda — скорость схождения, чем больше, тем резче. export const damp = (current, target, lambda, dt) => lerp(current, target, 1 — Math.exp(-lambda * dt));

Такие вещи обычно всплывают уже после того, как кто-то пожаловался на дёрганую камеру на 144-герцовом мониторе.

Этап 2: игровые механики

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

Отдельно я не просил ни пул объектов, ни очистку памяти. Модель сделала это сама: враги переиспользуются из пула, а все геометрии и текстуры явно освобождаются при рестарте. Three.js не чистит видеопамять за вас, и забытый dispose — классическая утечка, которая копится, пока вкладка не ляжет.

Этап 3: превращение в инди-игру

Третий промпт был самым жирным: оружие, опыт, система уровней, четыре типа врагов, босс, bloom, неоновый арт-стайл, меню, настройки и звук.

Звук получился интереснее всего. Я не давал ни одного аудиофайла, и Opus синтезировал всё через Web Audio прямо в браузере — выстрелы, взрывы, подбор опыта, звуки меню и даже фоновый дрон, который приглушается на боссе. Ноль ассетов в проекте.

Оптимизация тоже пришла без отдельной просьбы: снаряды и орбы опыта рисуются через InstancedMesh, частицы живут в одном буфере с собственным шейдером, декоративные колонны по периметру арены — один вызов отрисовки на все 88 штук.

Баги, которые Opus нашёл у себя сам

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

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

А самый неочевидный — баланс. Opus написал бота, прогнал им несколько партий и увидел, что за 28 убийств игрок доходит только до 2 уровня. Причина: опыт падает там, где умер враг, а дальность оружия была 30 при радиусе притяжения 3.4 — около 80% опыта просто оставалось лежать у стен. После правки цифр бот стал добираться до 8-9 уровня за две минуты.

Такое не ловится чтением кода. Только запуском.

Где человек всё ещё нужен?

Модель отлично закрывает «сделай, чтобы работало и не тормозило». Но она не чувствует игру.

Насколько приятно управление, не слишком ли долго ждать первого босса, не раздражает ли тряска камеры, не громкий ли фоновый дрон — всё это пришлось смотреть и решать самому. Opus честно писал в отчёте, что именно эти вещи он проверить не может, и предлагал список того, что стоит потыкать руками.

Плюс постановка задачи. Разница между «сделай игру» и промптом с ограничениями из начала статьи — это разница между кашей и проектом, который потом можно расширять.

Видео урок

Весь процесс разработки я показал в видео ниже:

Попробуйте сами

Скачивайте исходники по ссылке выше, запускайте npm install и npm run dev — игра стартует локально.

Если хотите понимать, что именно там происходит под капотом, а не просто принимать код от нейросети на веру — у нас есть полноценный курс 3D Дизайн на Three.js. Там разбираются сцены, освещение, текстуры, анимации и загрузка моделей с нуля.

А если соберёте на этой базе что-то своё — кидайте ссылку в комментарии, интересно посмотреть, куда вы это утащите.

Источник