Как сделать игру из шаблона: путь новичка в 7 шагов

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

Это руководство проходит этот путь в семь шагов, с настоящими именами файлов из страниц товаров и инструкций наших шаблонов, чтобы вы поняли, что значит «поменять уровни», ещё до покупки. Оно написано для тех, кто никогда не выпускал игр: учителя, маркетолога, веб-разработчика, который впервые пробует игры. Там, где шагу нужны Node.js или редактор кода, мы об этом говорим.

Как сделать игру из шаблона: семь шагов

1. Выберите шаблон, который близок к нужной вам игре.
2. Играйте в демо, пока не узнаете каждый экран.
3. Прочитайте инструкцию и найдите файлы, которые она называет.
4. Меняйте тексты и языки.
5. Меняйте графику и бренд.
6. Меняйте уровни, слова или правила.
7. Проверьте, затем разместите игру или упакуйте её как приложение.

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

Посмотреть шаблоны игр, с которых можно начать

Шаг 1: выберите шаблон, близкий к вашей идее

Шаблон экономит время, только если вы оставляете в нём большую часть. Если вам нужна словесная игра, начинайте с словесной игры; превратить футбольную игру в викторину — это переписывание, а не работа с шаблоном. Три вопроса помогут сузить выбор.

• Что делает игрок? Соединяет пары, проводит по словам, целится, сортирует фигуры. Выберите шаблон, основное действие которого совпадает с вашим.
• Как вы будете менять игру? В некоторых изданиях большинство правок делается в одном файле настроек; другие — это проекты на TypeScript, которые вы пересобираете. Страница товара говорит, какие именно.
• Где игра будет работать? Каждое наше издание работает со статического веб-сайта. Нативные приложения и публикация в магазинах не входят ни в одно издание.

Цены в нашем магазине — от US$5 до US$59 по прайс-листу, а на каждой странице товара есть живое демо и список «Not included in this edition» (не входит в это издание). Читайте этот список так же внимательно, как перечень возможностей.

Шаг 2: поиграйте в демо как тестировщик

Играйте в демо полчаса, а не две минуты. Откройте каждое меню, пройдите один уровень, проиграйте один, смените язык, перезагрузите страницу и проверьте, что прогресс сохранился. Составьте список каждого экрана и каждого текста, который видите. Этот список — ваша карта для следующих шагов: каждый его пункт лежит где-то в файлах.

Также поиграйте на телефоне. Если ваши игроки будут пользоваться телефонами, демо на телефоне — настоящая проверка шаблона, а не демо на ноутбуке.

Попробовать демо Tenguin, головоломки на пары чисел

Шаг 3: откройте пакет и прочитайте инструкцию

Шаблон — это папка, а не программа, которую нужно установить. В наших пакетах вы найдёте одни и те же части, описанные на каждой странице товара:

• game/: готовая к размещению игра с index.html, графикой, аудио и шрифтами. Именно это выкладывается в сеть.
• Source: читаемый код, который вы редактируете. В некоторых изданиях, например Ricopop, файлы в game/ и есть исходник, без шага сборки. В других, например Gridspark, есть отдельная папка исходника, которую вы пересобираете в game/.
• Documentation: иллюстрированная инструкция. В Gridspark она охватывает установку, настройку, 20 вопросов и устранение неполадок; Ricopop и Zabum также содержат файл START-HERE.txt.
• THIRD-PARTY-LICENSES: уведомления о шрифтах и библиотеках. Наши условия требуют сохранять их вместе с вашим продуктом.

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

Шаг 4: сначала тексты и языки

Тексты учат структуре файлов с минимальным риском. Примеры из страниц наших товаров:

• Gridspark: текст интерфейса находится в src/locales.js.
• Pinloop, Trimora и Twirldrop: текст интерфейса в i18n.ts, а brand.ts хранит название игры.
• Bodoku: текст лежит в словарях src/i18n, и на странице предупреждается, что плейсхолдеры для подстановки нужно сохранить.
• Golazo: тексты находятся в словарях языков, а команды — в teams.js.

Ловушка — это плейсхолдеры. Строка вроде «Уровень {n} пройден» требует, чтобы {n} остался точно таким же на каждом языке. Меняйте слова вокруг него, но никогда не скобки.

Языки — тоже часть выбора. Большинство наших изданий поставляются с 14 языками интерфейса; у Letter River, Plop и Zabum их 3. Удалить язык проще, чем добавить, а добавить язык значит перевести каждую строку, а не только меню.

Шаг 5: меняем графику и бренд

Лицензия разрешает white label: вы можете заменить название и логотип Polar Games своими и менять код, графику и аудио внутри своего продукта. Как именно это делать, зависит от издания.

• Tenguin: большинство настроек лежит в одном файле tenguin.config.js рядом с index.html: заголовок, путь к логотипу, акцентный цвет, язык по умолчанию, награды и цены. Измените значение, загрузите файл, перезагрузите страницу. Без сборки.
• Bodoku и Frogdoku: графика объявлена в src/art/manifest.ts.
• Pinloop: в brand.ts лежат заголовок, цвета, 30 мишеней и 12 фонов; звук и музыка находятся в public/audio.
• Ricopop: музыка и эффекты — это MP3-файлы, которые можно заменить, а ricopop.config.js управляет экраном запуска по нажатию и кнопкой полноэкранного режима.

Сохраняйте тот же размер и формат изображения, что и у заменяемого файла. Логотип вдвое шире оригинала сдвинет меню так, как код не предусматривал.

Посмотреть Pinloop и его файл brand.ts

Шаг 6: меняем уровни, слова или правила

Здесь ваша игра перестаёт выглядеть как копия чужой. Здесь же инструменты проверки нужнее всего.

• Ricopop: 50 уровней — это текстовые карты в src/levels.js. Необязательный инструмент node tools/validate.mjs проверяет, что каждый уровень всё ещё проходим после правки карты.
• Letter River: слова и подсказки лежат в source/words/en.js, pt.js и es.js, а генерация головоломок — в source/js/levels.js. Команда node test/check.js проверяет списки слов и 80 уровней на каждый язык.
• Deepforge: камеры, выбор, баланс и текст находятся в source/src/data/chambers.ts.
• Gridspark: константы правил и цветовая палитра — в src/config.js, а правила головоломки — в game.js, board.js, generator.js и shapes.js.

Правила — самое рискованное изменение. Меняйте по одному числу, сыграйте три раунда, затем переходите к следующему. Если игра ощущается неправильно, вернитесь к копии «original» и сравните.

Посмотреть Letter River, словесную головоломку с редактируемыми списками слов

Шаг 7: проверьте, затем размещайте или упаковывайте

Проверяйте на локальном сервере, а не двойным кликом

Несколько страниц наших товаров прямо говорят, что игра не работает из file:// — адреса, который вы получаете, дважды щёлкнув index.html. Проверяйте через локальный веб-сервер: во многих редакторах кода он есть, а необязательные инструменты разработчика Ricopop тоже его включают. Издания на TypeScript нужно пересобирать с Node.js: например, Gridspark запускает npm test и npm run build, чтобы скопировать играбельные файлы в game/; Pinloop собирается в dist/, который вы копируете в game/.

Размещение

Загрузите содержимое game/ на любой статический HTTP(S)-хостинг. Нашим изданиям не нужны PHP и база данных, чтобы работать; у Zabum и Ricopop есть необязательные таблицы рекордов на PHP, выключенные по умолчанию. Держите все папки рядом с index.html, как написано в инструкциях.

Или упакуйте как приложение

Инструменты вроде Capacitor помещают веб-игру внутрь проекта для Android или iOS. Страница «getting started» Capacitor просит папку с собранными веб-ресурсами и index.html в корне, добавляет платформы командами npx cap add android и npx cap add ios и копирует файлы командой npx cap sync. Это шаг дальше первой недели новичка, а ни одно из наших изданий не включает нативные сборки или публикацию в магазинах; такую работу мы оцениваем отдельно.

1. Каждый экран из вашего списка на шаге 2 показывает ваши тексты и графику.
2. Прогресс сохраняется после перезагрузки.
3. Игра работает на телефоне в ожидаемой ориентации.
4. Уведомления THIRD-PARTY-LICENSES всё ещё лежат рядом с файлами.
5. Вы можете объяснить, что изменили, файл за файлом.

Что лицензия разрешает делать с вашей игрой

Каждая покупка даёт бессрочную неэксклюзивную лицензию на один конечный продукт, ваш или одного клиента. Игроки могут играть бесплатно или через монетизацию рекламой. Вы можете менять код, графику и аудио и заменять наше название и логотип. Перепродавать или передавать шаблон, его код или ассеты отдельно, как шаблон, набор или пакет ассетов, нельзя. Поддержка длится 6 месяцев или 12 с расширением и покрывает установку и использование переданных файлов и воспроизводимые дефекты. Доработки и новые функции — отдельные услуги, которые согласуются до начала работ.

Прочитать полные условия лицензии

Часто задаваемые вопросы

Можно ли сделать игру, не умея программировать?

Многое можно поменять без кода: тексты, цвета, изображения и часть настроек лежат в обычных файлах. Tenguin держит большинство настроек в одном файле конфигурации. Менять правила или уровни в издании на TypeScript нужно уметь читать базовый код и пересобирать через Node.js.

Что нужно установить?

Для изданий без шага сборки, например Ricopop и Golazo, достаточно редактора кода и браузера. Издания на TypeScript требуют Node.js и npm для пересборки; на странице каждого товара указана версия.

Можно ли продавать или публиковать игру, которую я сделал из шаблона?

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

Почему при открытии index.html показывается пустая страница?

Обычно потому, что файл открыт через file://. Запустите игру через локальный веб-сервер или загрузите на хостинг, как описано в инструкциях.

Сколько это занимает времени?

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

Начните с одной игры

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

Посмотреть все шаблоны игр

Запросить смету на изменения