В процессе разработки своей настольной игры Архитеон заметил, что есть ряд проблем характерных как глобально для отрасли, так и для российской индустрии в частности.
В этой статье я попробую предложить бесплатные инструменты для решения проблем, с которыми я столкнулся, надеюсь кому то из разработчиков будет полезно.
Одна из основных проблем настольных игр в России - недотестированность. Продукты выходят сырыми, из-за его они низко конкурентно способны, быстро теряют аудиторию и не имеют потенциала к продолжению.
Чтобы игру тестировать, необходимо распечатывать каждую её итерацию, со всеми изменениями, переделывать много раз дизайн и параметры, следовательно каждая распечатка — это несколько тысяч рублей и куча времени.
Для того чтобы собрать новый билд для распечатки геймдизайнеру нужно потратить кучу времени чтобы поменять все цифры/параметры на игровых элементах, что занимает много времени и сил.
Игра часто тестируется без артов, на бумажках, потому что за эту часть отвечает издатель. В результате арт не дружит с дизайном, дизайн не дружит гейм-дизайном итд. И все эти проблемы выплывают на этапе, когда игра уже напечатана.
Решение
Я долго искал для себя удобные (бесплатные) инструменты, которые бы помогли мне автоматизировать процесс разработки и тестирования и подружили мои гугл таблички с визуалом настольной игры. Пару месяцев назад натолкнулся на решение.
Google Sheets + Dextrous + Tabletop simulator (он же TTS) - вариант хороший для тех, у кого куплен TTS, и у всех ваших тестировщиков тоже)
Google Sheets + Dextrous + Screentop.gg - вариант хороший для тех, у кого нет TTS, но при этом есть навыки работы с javascript. Руками там сделать конечно что-то можно, но по моим ощущениям автоматизацию писать в разы сложнее (а это как раз то, за что мы любим онлайн симуляторы настолок 🥲)
Ниже подробно расскажу о первом решении, которое использую сам. Со вторым я пока не смог полноценно разобраться, может со временем напишу о нём тоже.
Сначала распишу зачем нужна каждая программа.
Google Sheets - здесь мы храним все наши данные об игре, считаем баланс, агрегируем данные и формируем названия файлов изображений, к которым мы будем обращаться.
Dextrous — это наш онлайн верстальщик. Сайт можете найти по названию в поиске. В нём мы будем автоматически получать и обновлять данные из Гугл таблиц, собирать их в шаблоны карт и прочих серийных элементов настольной игры, и сохранять свёрстанные страницы для передачи в настольную игру.
Tabletop simulator - здесь мы раскладываем виртуально поле нашей настольной игры, задаём правила и создаём автоматизации, для удобства, и играем.
Инструкция
Теперь дам пошаговую инструкцию на примере карт для моей игры.
Подготовка данных
Делаем таблицу - исходник в Google Sheet. В этой таблице у меня в строке - игровая карта. Как видно на скриншоте, у каждой карты есть множество параметров. И параметры бывают как текстовые, так и числовые (например, урон или дальность), так и картинки (например элемент или схема поражения).
Исходная таблица со всеми данными для карт
Так же вычисление некоторых параметров происходит на других таблицах и сюда передаются через функцию.
(Например, урон карты вычисляется в зависимости от здоровья персонажа, направленности карты, дальности поражения и её ценности на листе Calculate2. Если вам нужна будет помощь с подобными формулами, пишите в группе в телеграмме, постараюсь помочь в силу знаний🥸)
Наша задача создать такой лист, на котором будут все необходимые данные для всех карт. Технические колонки я называю на английском, чтобы потом их использовать без проблем. У меня в игре 12 персонажей, у каждого персонажа есть 6 карт, которые формируют колоду персонажа. Поэтому строки располагаются в той же логике, в блоках по 6 строк.
С числовыми и текстовыми колонками всё просто, их мы напрямую будем забирать из таблицы, а вот для изображений нужно будет сформировать название файла, на которое мы будем в дальнейшем ссылаться.
Разберём на примере «элемента» карты. Бывает 3 элемента: Freedom (Свобода), True (Истина) и Chaos (Хаос).
Теперь подготавливаем 3 изображения и называем их Freedom.png, True.png, Chaos.png соответственно, сохраняем их.
Формат PNG используется чтобы у изображений был прозрачный, а не белый фон
Это можно сделать в любом редакторе изображений, я использую CorelDraw.
После того как загрузили нужные файлы, формируем названия файлов в Google. Добавляем колонку Element и вставляем формулу
=IFS(G2="Свобода";"ARHTN/Freedom.png";G2="Истина";"ARHTN/True.png";G2="Хаос";"ARHTN/Chaos.png")
В формуле мы проверяем какое слово у нас хранится в колонке G на русском, и в зависимости от значения выводим значение. Протягиваем формулу, и теперь у нас есть полное название файла элемента для каждой карты.
По аналогии поступаем с другими параметрами карты. Теперь наша задача для каждой колоды карт сделать отдельный файл, чтобы мы могли в дальнейшем для каждой колоды сделать и назначить свой шаблон в Dextrous. В моём случае для каждого героя я создавал отдельную колоду.
Создаём новую таблицу, и вставляем часть данных из исходной таблицы. В первую строку заголовки, в строки 2-7 данные карт конкретного героя. Для этого используем формулу =IMPORTRANGE
Готовая таблица одного героя
Теперь эту таблицу публикуем в интернете для доступа к данным.
Файл-> Поделиться-> Опубликовать в интернете
Обязательно выбираем тип данных Файл CSV и жмём "Опубликовать"
Сохраняем ссылку, которую нам выдаёт гугл, она нам пригодиться.
Dextrous
Теперь регистрируемся в Dextrous. Затем заходим во вкладку images и создаём папку с названием нашей игры (у меня это «ARHTN»). Здесь мы будем хранить все наши изображения которые мы будем использовать на картах.
Должен сразу предупредить, что в Dextrous бесплатно можно хранить до 50Мб файлов, поэтому если у вас большие изображения на картах, нужно их будет оптимизировать и сохранить в более низком качестве. Тем не менее, этого размера достаточно для полноценной игры, например мои 100 карт я сохранил в большом разрешении, сжав до 160Кб, и качество осталось вполне приемлемое. Получилось, что все фоновые иллюстрации заняли около 17Мб.
Пример иллюстрации 300х452мм сжатой до 163Кб
Теперь нужно создать шаблон карты. Нам нужна вкладка Layout. Можно создать шаблон на основе заготовки, но я советую делать самостоятельно, потому что Dextrous очень странно работает с размерами, и сжимает наши уже сжатые изображения еще раза в четыре. Из-за этого получается очень плохо. Поэтому я советую делать шаблон в два раза больше, чем будут карты физически у вас распечатываться, а в TTS мы просто уменьшим их масштаб.
Тут нужен отдельный туториал как создавать шаблоны, я думаю при необходимости на ютубе можно найти. Я предлагаю делать так - сохраняем для фона одну карту, на которой обозначаем внутренние выносы (обычно это 3 мм от края карты) и дальше на это изображение добавляем все наши элементы шаблона, которые будем визуализировать. Посоветую только брать карту с максимальным заполнением, либо использовать текст максимальной длины, чтобы быть уверенным, что все текстовые описания точно поместятся.
Так же советую создать изображение Null - с одним прозрачным пикселем, чтобы использовать его как заглушку, если мы не хотим выводить изображение по умолчанию, а на шаблоне оно у нас есть, и иногда нужно этот элемент отображать.
Как выглядит заготовка шаблона и использование Null изображения
На этом этапе очень важно называть все элементы точно так же как мы называли колонки в Google, так как связываться они будут именно по названию! Для ранее созданных файлов элементов я добавил объект изображение и задал ему название Element.
Как только готов шаблон, во вкладке Projects создаём новый проект. В проекте у нас будут лежать наши колоды.
Заходим в проект, добавляем компонент и в качестве него указываем наш шаблон.
Project->Add component->Existing layout
Теперь будет самое волшебство. Нажимаем внизу Import CSV и в открывшемся окне вставляем ту ссылку, которую нам предоставил Google когда мы публиковали таблицу.
Если вы всё сделали правильно, то произойдёт волшебство и все строки разложатся автоматически по картам колоды. Если каких-то данных вы не видите, или они не корректны, то нужно проверить шаблон и названия файлов.
На скриншоте видно что я использовал различные иконки прямо в тексте карты - это тоже не сложно делается, гайд есть на сайте Dextrous.
Самое замечательное, что в дальнейшем, когда мы будет тестировать игру, мы можем буквально на ходу обновлять данные во всём проекте. Достаточно просто нажать import all CSVs.
Так же мы видим, что Dextrous понял где необходимо вставить какой элемент, получив данные из колонки Elements. Эти элементы я расположил в левом верхнем углу.
Подскажу еще одну хитрость: обратите внимание на колонку Card Nickname – это название карты, которое будет отображаться в TTS. В дальнейшем я это использую в скриптах TTS, расскажу об этом в отдельной статье.
Когда мы подготовим все колоды которые будут участвовать у нас в проекте, останется добавить рубашки картам - есть несколько вариантов как это сделать, в простом случае где у нас одна рубашка для всех карт, выбираем в правом меню common и подгружаем шаблон рубашки.
Выбор и настройка рубашки
Осталось экспортировать наш файл в TTS. Нажимаем на значок принтера🖨️ в правом верхнем углу и на следующей странице снова нажимам на принтер 🖨️ и выбираем Create Tabletop Simulator file.
Ждём окончания генерации и скачиваем JSON в папку TTS в ваших Документах:
C:\Users\liardy\Documents\My Games\Tabletop Simulator\Saves\Saved Objects
Tabletop Simulator
Теперь открываем TTS, создаём новую игру и открываем вкладку objects. Нам нужен блок SAVED OBJECTS. Это как раз та папка, в которую мы положили наш JSON файл с картами.
Перетягиваем файл на область игрового поля и получаем наши колоды. Дальше с этими колодами мы делаем всё что угодно: раскладываем игру, пишем автоматизации для выбора героев или карт итд. И сохраняем файл с игрой.
Если нам нужно будет внести какие-то изменения в наши карты, нам не нужно будет заново переделывать макеты, пресоздавать колоды, переписывать код с автоматизацией, перераскладывать все исправленные карты!
Нужно будет сделать 2 вещи, которые занимают пару минут:
1. Внести изменения в таблицу Google
2. В Dextrous нажать import all CSVs и сохранить новый файл JSON с заменой старого в папке Saved Objects.
После этого открываем игру в TTS и все изменения уже есть на всех картах в игре!
Итог
Как предложенный инструмент помогает решить озвученные в начале статьи проблемы:
Эта комбинация инструментов позволяет увеличить количество тестов, их объем и качество
Изменения после каждой итерации занимают считаные минуты, вплоть до того, что можно прямо во время игры изменить какие-то данные
Временные и финансовые затраты геймдзиайнера оптимизированы в рамках цифровых платформ
При желании верстать можно с выпусками в реальном размере и сохранять файл для печати. Это позволяет подружить геймдзиайн, арт и дизайн, чтобы предусмотреть размеры всех элементов и текстовых блоков относительно друг друга, подобрать оптимальный шрифт, грамотно проверить несколько вариантов шаблонов, прежде чем выбрать идеальный.
Надеюсь статья найдёт своего читателя и будет полезна хотя бы начинающим разработчикам. Если будут вопросы под постом, постараюсь всем ответить.
Так же оставлю ссылку на свою группу в тг, чтобы вы могли со мной связаться лично или задать вопросы по вашим настройкам)
https://t.me/Archytheon