Гайд · Нейросети для игр · август 2026

Нейросеть для создания игр: своя Змейка за один вечер

Игра Змейка, собранная нейросетью, запущена в браузере: змейка из шести сегментов на тёмном игровом поле, счёт 30

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

К концу статьи у тебя будет своя запущенная игра и понимание того, как попросить нейросеть собрать уже свою, не Змейку

Скопируй готовый код из этой статьи, сохрани его в текстовый файл с именем index.html и открой этот файл в браузере - через секунду на экране будет твоя рабочая игра Змейка. Код собрала нейросеть Claude одним промптом, без движка и без строчки, написанной руками. Дальше в статье - что делать, если игра не открылась, и как попросить нейросеть собрать свою игру с нуля

Шаг 1. Скопировать готовый код

Внизу лежит весь код игры целиком - выделить и скопировать одним куском

Это не фрагмент и не упрощённый пример - это тот самый файл, который нейросеть отдала за один ответ, 181 строка. Разметка страницы, тёмная тема и вся логика игры лежат в одном месте

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Змейка</title>
<style>
  :root { --bg:#1C1815; --panel:#272220; --accent:#BE4A24; --paper:#FAF6EF; --grid:#332C27; }
  * { box-sizing: border-box; }
  body {
    margin: 0; min-height: 100vh; display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 16px;
    background: var(--bg); color: var(--paper);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  }
  h1 { font-size: 20px; margin: 0; letter-spacing: 0.02em; }
  #hud { display: flex; gap: 24px; font-size: 16px; }
  #hud span { color: var(--accent); font-weight: 700; }
  #board {
    background: var(--panel); border: 2px solid var(--grid); border-radius: 8px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.45);
  }
  #overlay {
    position: fixed; inset: 0; background: rgba(28,24,21,0.92);
    display: none; align-items: center; justify-content: center; flex-direction: column; gap: 14px;
  }
  #overlay.show { display: flex; }
  #overlay h2 { margin: 0; font-size: 26px; }
  #overlay p { margin: 0; opacity: 0.8; }
  button {
    background: var(--accent); color: var(--paper); border: none; border-radius: 6px;
    padding: 10px 22px; font-size: 15px; cursor: pointer; font-weight: 600;
  }
  button:hover { filter: brightness(1.08); }
  #hint { font-size: 13px; opacity: 0.6; }
</style>
</head>
<body>
  <h1>Змейка</h1>
  <div id="hud">Счёт: <span id="score">0</span> &nbsp; Рекорд: <span id="best">0</span></div>
  <canvas id="board" width="400" height="400"></canvas>
  <p id="hint">Стрелки или WASD - управление. Пробел - пауза.</p>

  <div id="overlay">
    <h2 id="overlayTitle">Игра окончена</h2>
    <p id="overlayScore">Счёт: 0</p>
    <button id="restartBtn">Играть заново</button>
  </div>

<script>
(function () {
  const canvas = document.getElementById('board');
  const ctx = canvas.getContext('2d');
  const CELL = 20;
  const COLS = canvas.width / CELL;
  const ROWS = canvas.height / CELL;

  const scoreEl = document.getElementById('score');
  const bestEl = document.getElementById('best');
  const overlay = document.getElementById('overlay');
  const overlayTitle = document.getElementById('overlayTitle');
  const overlayScore = document.getElementById('overlayScore');
  const restartBtn = document.getElementById('restartBtn');

  let snake, dir, nextDir, food, score, best, speedMs, timer, paused, gameOver;
  best = Number(localStorage.getItem('snake_best') || 0);
  bestEl.textContent = best;

  function reset() {
    snake = [{x: 8, y: 10}, {x: 7, y: 10}, {x: 6, y: 10}];
    dir = {x: 1, y: 0};
    nextDir = {x: 1, y: 0};
    score = 0;
    speedMs = 140;
    paused = false;
    gameOver = false;
    scoreEl.textContent = score;
    placeFood();
    overlay.classList.remove('show');
    if (timer) clearInterval(timer);
    timer = setInterval(tick, speedMs);
  }

  function placeFood() {
    let ok = false;
    while (!ok) {
      food = { x: Math.floor(Math.random() * COLS), y: Math.floor(Math.random() * ROWS) };
      ok = !snake.some(s => s.x === food.x && s.y === food.y);
    }
  }

  function tick() {
    if (paused || gameOver) return;
    dir = nextDir;
    const head = { x: snake[0].x + dir.x, y: snake[0].y + dir.y };

    if (head.x < 0 || head.y < 0 || head.x >= COLS || head.y >= ROWS ||
        snake.some(s => s.x === head.x && s.y === head.y)) {
      endGame();
      return;
    }

    snake.unshift(head);

    if (head.x === food.x && head.y === food.y) {
      score += 10;
      scoreEl.textContent = score;
      placeFood();
      if (score % 50 === 0 && speedMs > 60) {
        speedMs -= 10;
        clearInterval(timer);
        timer = setInterval(tick, speedMs);
      }
    } else {
      snake.pop();
    }
    draw();
  }

  function endGame() {
    gameOver = true;
    clearInterval(timer);
    if (score > best) {
      best = score;
      localStorage.setItem('snake_best', String(best));
      bestEl.textContent = best;
      overlayTitle.textContent = 'Новый рекорд!';
    } else {
      overlayTitle.textContent = 'Игра окончена';
    }
    overlayScore.textContent = 'Счёт: ' + score;
    overlay.classList.add('show');
  }

  function draw() {
    ctx.fillStyle = '#272220';
    ctx.fillRect(0, 0, canvas.width, canvas.height);

    ctx.strokeStyle = '#332C27';
    ctx.lineWidth = 1;
    for (let x = 0; x <= COLS; x++) {
      ctx.beginPath(); ctx.moveTo(x * CELL, 0); ctx.lineTo(x * CELL, canvas.height); ctx.stroke();
    }
    for (let y = 0; y <= ROWS; y++) {
      ctx.beginPath(); ctx.moveTo(0, y * CELL); ctx.lineTo(canvas.width, y * CELL); ctx.stroke();
    }

    ctx.fillStyle = '#BE4A24';
    ctx.beginPath();
    ctx.arc(food.x * CELL + CELL / 2, food.y * CELL + CELL / 2, CELL / 2 - 2, 0, Math.PI * 2);
    ctx.fill();

    snake.forEach((s, i) => {
      ctx.fillStyle = i === 0 ? '#FAF6EF' : '#D8CFC0';
      ctx.fillRect(s.x * CELL + 1, s.y * CELL + 1, CELL - 2, CELL - 2);
    });
  }

  window.addEventListener('keydown', (e) => {
    const key = e.key.toLowerCase();
    if (key === ' ') { paused = !paused; return; }
    const map = {
      arrowup: {x:0,y:-1}, w: {x:0,y:-1},
      arrowdown: {x:0,y:1}, s: {x:0,y:1},
      arrowleft: {x:-1,y:0}, a: {x:-1,y:0},
      arrowright: {x:1,y:0}, d: {x:1,y:0},
    };
    const nd = map[key];
    if (!nd) return;
    if (nd.x === -dir.x && nd.y === -dir.y) return; // запрет разворота на 180
    nextDir = nd;
  });

  restartBtn.addEventListener('click', reset);

  reset();
  draw();
})();
</script>
</body>
</html>

Что увидишь после копирования: код целиком выделен и лежит в буфере обмена - можно вставлять

Что это тебе даёт: у тебя в руках точная копия того, что нейросеть написала за один ответ - ничего добавлять и чинить не нужно

Шаг 2. Сохранить как файл index.html

Открыть любой текстовый редактор, вставить код, сохранить с именем index.html

Куда нажать. На Windows - открой «Блокнот» (найди через «Пуск»), на Mac - «TextEdit» из папки «Программы». Вставь скопированный код (Ctrl+V или Cmd+V), потом сохрани файл (Ctrl+S или Cmd+S) с именем index.html в любую пустую папку, например на рабочем столе

Важная деталь для Mac: в TextEdit перед вставкой нужно выбрать в меню «Формат» пункт «Сделать обычным текстом» - иначе редактор превратит текст в оформленный документ, и код сломается

Что увидишь: файл с именем index.html и значком браузера появится в выбранной папке

Что это тебе даёт: у тебя есть рабочий файл игры, который откроет любой браузер на любом компьютере без интернета и без установки чего-либо

Шаг 3. Открыть файл в браузере

Дважды кликнуть по сохранённому файлу - игра откроется и заработает сразу

Что увидишь: браузер откроет тёмный экран с полем для игры, счётом 0 и надписью про управление стрелками или клавишами WASD

Стартовый экран игры Змейка в браузере: три белых квадрата в центре и оранжевая точка еды
Первый запуск: змейка из трёх сегментов в центре поля, счёт 0, готова к первому нажатию стрелки

Что это тебе даёт: это твой результат. Нажимай стрелки - змейка двигается, съедает оранжевую точку, растёт, счёт увеличивается

Файл дополнительно прогнан headless-браузером для этой статьи, чтобы проверить, что игра реально считает, а не просто рисует картинку: нажатия стрелок ушли в настоящий обработчик клавиш страницы, а координаты головы и еды на каждом шаге читались из состояния canvas. Ниже - тот же файл спустя пять секунд движения, когда змейка съела три порции еды подряд, выросла с трёх сегментов до шести и подняла счёт до 30 - и то, и другое посчитал игровой код, а не заранее нарисованная картинка

Игра в движении: змейка из шести сегментов изогнулась на игровом поле, счёт 30 виден сверху
Тот же файл спустя пять секунд игры: змейка съела три порции еды подряд, выросла до шести сегментов, счёт 30 посчитан игровым кодом

Частая грабля новичка на этом шаге - открыть файл не двойным кликом, а через «Показать код» в окне какого-нибудь редактора и удивиться, что «ничего не происходит». Смотреть нужно именно на файл, открытый браузером, а не на текст в окне редактора

Если хочешь свою игру, а не готовую Змейку

Тот же результат получается своим промптом нейросети - что писать и куда вставлять

Открой любую нейросеть с чатом и поддержкой артефактов в браузере (например Claude на claude.ai - бесплатно, без установки) и вставь вот такой запрос, заменив описание механики на своё:

Сделай мини-игру [название] одной HTML-страницей: [опиши механику -
что двигается, что собирается или чего избегать, как считается очко].
Всё в одном файле index.html, без внешних библиотек, без сборки -
просто открыть в браузере, тёмная тема.

Каждая часть этого запроса решает конкретную задачу. «Одной HTML-страницей» и «без внешних библиотек» убирают из ответа команды установки и сборщики - файл получится таким, что открывается двойным щелчком, без терминала. Перечисление механик (что двигается, как считается очко, что означает конец игры) не даёт нейросети додумать упрощённую версию без важных частей

Что увидишь: нейросеть ответит готовым кодом одной HTML-страницы, иногда с коротким пояснением сверху

Что это тебе даёт: код, который сохраняешь и открываешь ровно так же, как в шагах 1-3 выше, только это уже твоя игра, а не Змейка

Одна вещь, которую стоит знать заранее: заказывать сразу много механик в одном промпте (мультиплеер, сохранение рекорда на сервере, таблицу лидеров) - плохая идея. Нейросеть в этом случае либо тихо упрощает часть без предупреждения, либо выдаёт нерабочий кусок кода. Для первой игры одна механика и один экран честнее, чем пять несвязанных идей сразу

Если под рукой есть терминал с установленным Claude Code (платная подписка), путь тот же самый, только быстрее: создаёшь пустую папку, открываешь в ней терминал и даёшь тот же промпт - Claude Code сохранит файл index.html сам, копировать код руками не понадобится. Как поставить Claude Code, разобрано в отдельном гайде установки

Если что-то не открылось: 5 частых сбоев

У этого пути есть пять типичных мест, где новичок спотыкается, и у каждого понятное решение

Что видишьЧто это значитЧто сделать
Файл открылся, а внутри виден весь код текстом, а не играФайл сохранён не с расширением .html, а как .txt - Блокнот и TextEdit иногда доклеивают своё расширениеПересохрани файл, явно указав имя index.html с точкой, и в диалоге сохранения выбери «Все файлы» вместо «Текстовый документ»
В TextEdit на Mac код вставился с кавычками-«ёлочками» и жирным текстом вместо обычных символовРедактор превратил вставку в оформленный документВ меню «Формат» выбери «Сделать обычным текстом» ДО вставки кода, потом вставь заново
Игра открылась, но стрелки не двигают змейкуКлик мышью попал не на страницу игры, а на адресную строку или другое окно, и клавиатура слушает не то окноКликни один раз в любое пустое место игрового поля, потом пробуй стрелки снова
Игра открывается, но при каждом обновлении рекорд сбрасывается на 0Обычно так себя ведёт приватное окно браузера (инкогнито) - оно не сохраняет localStorage между сессиямиОткрой файл в обычном, не приватном окне - рекорд начнёт сохраняться между запусками
После копирования кода в игре появилась лишняя пустая строка или значок в начале файла и игра не запускаетсяТекстовый редактор добавил невидимые служебные символы при сохраненииПересохрани файл через простой текстовый редактор (Блокнот на Windows, TextEdit с режимом обычного текста на Mac), не через Word или похожие программы с форматированием

Таблица прокручивается вбок →

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

Когда вместо своего промпта нужен готовый конструктор

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

Rosebud AI - браузерная среда, где нейросеть собирает игру внутри готового редактора с шаблонами по жанрам. GDevelop - открытый движок с визуальными блоками логики (без кода) и встроенным ИИ-помощником. Дальше в этих средах код чаще спрятан за визуальным редактором - контроля меньше, чем в диалоге с нейросетью, но и возможностей для сложной игры больше

GDevelop сам формулирует свой бесплатный план без оговорок про пробный период:

«Создавайте свою первую игру на 100% бесплатно»

GDevelop, страница тарифов, gdevelop.io/pricing

Для генерации спрайтов и звука под такую игру есть отдельные инструменты (Sprite-AI, PixelLab, ElevenLabs Sound Effects) с бесплатными лимитами без карты - но это уже задача следующего шага, когда игра из одного экрана выросла в проект с своей графикой

Проверка доступа с московского сервера 17.08.2026 показала: Rosebud AI и GDevelop открываются из России без VPN. Оплата платных уровней - отдельная история, там нужна зарубежная карта, разобрано в гайде как оплатить нейросети из России

Что нейросеть не сделает: честная граница до Steam

Промпт в чате не соберёт готовую игру для Steam. Для релиза там нужны вещи, которых у одностраничного HTML-файла нет: движок со сборкой под платформы, защита от взлома и прохождение модерации магазина. Прототип, игрушку для друзей и учебный пример нейросеть соберёт за вечер бесплатно - а платный релиз с достижениями и защитой от читеров это уже отдельный проект с движком и месяцами работы, где нейросеть один из инструментов команды, а не вся команда сразу

Что дальше, если хочется не игрушку, а настоящий проект

Змейка показывает механику целиком за один вечер: один промпт, один файл, рабочая игра. Следующий шаг - не «выучить движок с нуля», а взять тот же навык диалога с нейросетью и применить его к рабочему инструменту или сайту, где код пишет нейросеть, а ты формулируешь задачу и проверяешь результат. Разбор этой части - в гайде Контент-план нейросетью: план на 4 недели за один вечер

13 мин чтения Иван Сергеев

Источники

  • GDevelop, тарифы - условия бесплатного плана, снято 17.08.2026
  • Rosebud AI - браузерная среда для сборки игр с ИИ, снято 17.08.2026
  • Sprite-AI - бесплатный лимит генерации спрайтов, снято 17.08.2026
  • ElevenLabs Sound Effects - бесплатный лимит генератора звука, снято 17.08.2026

Памятка: игра нейросетью за один вечер

Пять строк пути от пустого экрана до рабочей игры

Сохрани себе

  • Скопирован готовый код из статьи или получен свой промптом нейросети
  • Код сохранён в текстовом редакторе как index.html обычным текстом, без форматирования
  • Файл открыт двойным щелчком, а не через «Показать код» в окне редактора
  • Игра пройдена от старта до game over: стрелки двигают змейку, счёт растёт от еды
  • Понятна честная граница: прототип для себя и друзей - да, релиз в Steam - отдельный проект

После первой игры

Игра за вечер - это разминка, не потолок

Змейка была тестом на то, что диалог с нейросетью превращается в рабочий код. Каждый вечер без этого навыка - это ещё одна идея, которая осталась только в голове, потому что «я не умею программировать» казалось весомой причиной остановиться

Забрать разбор

Частые вопросы

Можно ли сделать игру нейросетью без опыта в программировании?

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

Какая нейросеть подходит для создания игр?

Для одностраничной браузерной игры подойдёт любая нейросеть с чатом и артефактами в браузере (например Claude) - задача чисто текстовая, специальный инструмент для игр не нужен

Сколько стоит сделать игру с помощью нейросети?

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

Можно ли выпустить такую игру в Steam?

Нет. Steam требует полноценный движок, сборку под платформы и модерацию. Одна HTML-страница - это прототип и игрушка для друзей, а не коммерческий релиз

Чем вайбкодинг игры отличается от готового конструктора с ИИ?

Вайбкодинг - диалог с нейросетью, которая пишет код с нуля под твою идею, весь код виден текстом, как в этой статье. Готовый конструктор (Rosebud AI, GDevelop) даёт готовую среду с шаблонами, где нейросеть - один из инструментов внутри, а код чаще спрятан за визуальным редактором - туда стоит идти, когда в игре нужны уровни и физика, а не один экран

Почему код не запускается, а просто показывается текстом?

Скорее всего файл сохранился с расширением .txt вместо .html. Пересохрани его, явно указав имя index.html и выбрав «Все файлы» вместо «Текстовый документ» в диалоге сохранения

Работают ли конструкторы с ИИ (Rosebud, GDevelop) из России без VPN?

Проверка с московского сервера 17.08.2026 показала: оба открываются без VPN. Оплата платных уровней отдельно требует зарубежную карту