Как оформлять карты в цифровых и печатных карточных играх?
При создании карточный игры, не важно, печатной или цифровой, каждый разработчик задумывается не только о принципе работы его карт, но и об оформлении. На первый взгляд может показаться, что «Карта — она и в цифре карта, и на бумаге карта». Однако оформление этих карт отличается в зависимости от формата игры.
Я имею большой опыт игры в цифровые карточные игры (Gwent, Legends of Runeterra, PvZ: Heroes, Card Thief и др.), чуть меньший в настольные (Unmatched, UNO, Дурак, Red 7).
Cоздал две настольные и одну цифровую карточные игры. С моими работами можете ознакомиться ниже: DANGER ZONE 2.0, SWINGBALL, Gunt.
В процессе работы над этими играми так и не нашёл концентрированного гайда по этой теме. Не о том «Как создать настольную игру», не «Как сделать карточную игру» —, а именно работа над оформлением карты.
Есть ролики, где об этом достаточно рассказывается, но:
В них есть вода в виде личной истории создания игры, которая больше интересна зрителям канала, чем гейм-дизайнерам;
Упоминается больше производственная часть разработки (подготовка к печати, «как сделать ККИ на Unity»), нежели дизайнерская.
И самое главное: нигде не видел роликов о разнице разработки цифровой карточной игры и печатной, и на что стоит обращать внимание в каждой из отраслей.
В целом, в русскоязычном сегменте мало информации о разработке карточных игр. Либо она разрозненная, либо расплывчатая, или много воды.
В этой статье мы разберём как оформлять карты в целом; И отдельно посмотрим как оформлять цифровые карты, и как оформлять печатные.
Начнём с общих…
Правил дизайна,
…которые нужно учитывать при прочтении всех следующих пунктов:
Не слишком яркие, иначе глаза будут уставать.
Не слишком однотонные, иначе информация не будет считываться.
Для простоты можете перейти на Adobe Color, Специальные возможности и проверить контрастность там.
Текст, еле помещающийся на карте; одна иконка впритык к другой — очень удешевляют дизайн вашей карты.
На том же Adobe Color или Coolors можете подобрать цветовую палитру под свои нужды. Может быть полезно как для дизайна всей карточной игры, так и для отдельных карт, типов, классов или фракций
Gwent и её цветовые схемы для каждой фракции
После получения минимальной базы перейдём к…
Плану действий
…и советам по оформлению карт:
Какая информация должна быть на карте?
Соберите список из всего содержательного, что должно быть на вашей карте.
К примеру:
«На моей карте должны быть указаны:
Как должны выглядеть эти элементы на вашей карте?
Блок текста /
Эмблема /
Символ в тексте, набор символов /
может Цвет рамки /
или Маленький кружок в углу.
Помните:
Человеку легче воспринимать визуальную информацию, чем письменную.
По возможности избегайте оформления текстом. Или замените часть текста на символы.
Ещё правило:
Чем чаще игрок пользуется той или иной информацией, тем лучше она должна быть видна на карте.
Присмотритесь к картам Unmatched (либо Red 7, если на вашей карте не много элементов).
Самые важные элементы находятся в левой части карта и занимают много места. Менее важные стоят либо справа (Усиление в кружке справа), либо ещё расписано мелким шрифтом самым нижнем углу карты (Принадлежность к персонажу; Кол-во карт в колоде)
Размер и форма карты
Эти темы часто переплетаются друг с другом, поэтому обсудим в одном пункте.
Несколько правил для правильного выбора:
Большие карты тяжело держать в руке в большом количестве (7–10).
Поэтому размер карты должен быть максимально большим, чтобы лучше считывались изображения и текст — Но такого размера, чтобы карты удобно лежали в руке.
При уменьшении размера карты не забывайте о правиле дизайна — свободное пространство между объектами.
Можете воспользоваться одним из стандартных размеров карт: 41×63 мм, 44×68, 56×87, 59×92 или 63,5×89. Или взять размер с карты уже знакомой вам игры.
(печат.) Сглаженные углы
Если оставить углы прямыми, игрок будет о них резаться, что сильно испортит экспириенс от продукта.
(цифр.) «ПКМ — Подробнее»
В цифровой игре менее нужную информацию вы можете скрыть в отдельное окно, которое будет открываться после определённого действия игрока.
К примеру, в Gwent: The Witcher Card Game на карте изначально располагается только
— изображение карты, очки карты и, при наличии, число брони и разного рода эффекты.
После наведения курсора на карту, справа появляется окошко, на котором указано — название, класс карты и способность.
А при нажатии ПКМ на весь экран показывается карта и справа окно сведений — На карте появляется число Провизии (сила карты, учитывается при сборе колоды, за ненадобностью не отображается в бою), в новом окне помимо параметров из маленького окошка появляется сеттинговое описание персонажа на карте, а справа появляется справка с объяснением всех ключевых слов, упомянутых в способности карты.
Таким образом удаётся и указать всю необходимую информацию, и не перегружать интерфейс карты и игры в целом.
В печатной версии такое провернуть либо не удастся,
Пример — MTG, где всё указано на самой карте
…либо придётся указывать способности карт в правилах игры.
Red 7, UNO, и др.
Или, если это сеттинговое описание и прочая необязательная информация, сделать альманах либо артбук.
Plants vs. Zombies
Расположение элементов, поиск и анализ референсов
Теперь, когда вы полностью поняли как примерно должна выглядеть ваша карта, можно поискать игры с похожим количеством элементов и подметить для себя удачные решения каждой из них, которые могут пригодиться вам для своей карточной игры.
Всматриваемся в каждый элемент на карте выбранной игры и отвечаем себе на вопросы:
Почему дизайнер поставил этот объект именно сюда? какие плюсы это даёт;
Какие у этого есть минусы или могут быть в вашей игре? из-за разных правил или стиля самой игры;
Где ещё можно было бы поставить этот элемент, и чтобы он также хорошо смотрелся? для избежания плагиата.
Например, для своей DANGER ZONE 2.0 я опирался на дизайн карт Gwent, MTG, Inscryption, Unmatched и Трон Кубов;
Для SWINGBALL: UNO, Red 7 и кастомные Покер-колоды;
А для Gunt — UNO, Red 7 и Гвинт.
У печатных карт в руке не видно элементы в правом нижнем углу, т.к. эту часть занимает большой палец.
Располагайте там только неважную информацию, к которой игрок будет редко ссылаться (Описание карты в MTG)
10% людей на земле — левши. Поэтому в левый нижний угол тоже ставить элементы нежелательно, хоть и менее критично. Идеальным вариантом
В руке у большинства карт виден только левый верхний угол, т.к. карты накладываются друг на друга.
Поэтому числовые значения, тип / класс карты и прочие сведения, на которые игрок смотрит в первую очередь, располагайте там (UNO, Дурак, Red 7, Gwent)
Первый окончательный вариант
После того как вы определились с первым финальным вариантом, нужно сделать:
Черновой вариант карандашами на бумаге (плохо сработает для цифровой игры, т.к. не получится «разворачивать информацию» при выполнении некоего действия)
Сделать схематичный концепт на компьютере (Adobe Illustrator, да хоть Paint) и напечатать карты на принтере.
Сделать схематичный концепт в Miro и протестировать его там.
(Для печатной игры учитывайте правила удобства в уме (размер карт, правый нижний угол) т.к. здесь вы не сможете проверить эти качества)
Удобно тестировать игру с другим человеком на расстоянии
Экономия денег и времени на производстве карт
Отличный вариант для будущих создателей цифровой игры, если вы пока не умеете программировать / работать в движке.
Прототип на движке (Unity, Unreal Engine, Game Maker и др.)
Возможность «разворачивать» сведения карты, изменять размер, создавать новые окна;
Изменять элементы на карте после внешних воздействий (Получение урона, наложение эффекта, изменение статуса и пр.
Цикл тестов и корректировок
Тестируете
Лучше с другом — желательно, внимательным к деталям, с конструктивной критикой; в идеале, с базой знаний о дизайне и/или гейм-дизайне.Подмечаете недочёты
Сверяете с пунктами, описанными выше — учтено ли <это правило> в дизайне моей карты? Обязательно после партии спрашивайте у тестировщика (ков) что им особенно понравилось или наоборот не понравилось:Как по внешнему виду, красиво ли выглядит;
Так и функционально, удобно ли находить нужную информацию.
После указания проблемы спросите, есть ли идеи для её решения. Даже если у вас уже есть варианты — прибавив к ним идеи тестировщиков, вашего будущего коммьюнити, и выбирая лучший вариант из общей выборки — сможете применить лучшее решение. Благодаря этому дизайн ваших карт станет ещё удобнее и красивее, чем у тех, кто не умеет работать в команде.
Пробуете примечательные варианты — до тех пор, пока не найдёте хороший / отличный / или идеальный.
Зависит от ваших амбиций, перфекционизма, и свободного времени в купе с навыками / опытом.Если дошли до этого этапа, перепробовали все имеющиеся, а проблема не решилась — повторяете цикл.
В таком случае рекомендуется найти другого тестировщика, который сможет дать свежий взгляд на проблему.
Пробуйте тестировать одновременно с несколькими тестировщиками — тогда мысли каждого тестирующего будут помогать другим развить свои собственные.
Так шансы найти наилучшее решение сильно возрастают :)
Итог
Мы поэтапно разобрали что нужно сделать для создания красивого, а главное, удобного дизайна ваших карт. Вы получили перечень советов: от общей теории дизайна до оформления самих карт. Также были приведены отдельные правила и рекомендации для печатных и цифровых продуктов по отдельности, благодаря чему после реализации игры в одном издании, сможете реализовать её же в другой.
Теперь у вас есть чёткий пайплайн, по которому вы можете двигаться на пути к созданию своей карточной игры и избежать негативных отзывов от ваших игроков, которые получают те, кто этих знаний не имеет.