ТЕМА: Выбираем шрифт и оформляем текст в своей игре

Выбираем шрифт и оформляем текст в своей игре

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

В первую очередь вы должны задать себе вопрос: зачем и как я хочу передать текст, находящийся внутри игры?


В игре What Remains of Edith Finch текст буквально встроен в игру.

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

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

Какие бывают шрифты?

Семейства шрифтов (или гарнитуры) делят на разные типы. Классификация неполная, но ее будет достаточно.

Самые старые шрифты — это те, что с засечками (хвостиками на концах букв). Относятся они к классу антиква, в файлах обычно называются serif.

Такие шрифты мы чаще всего встречаем в книгах, и не зря. Классические шрифты с засечками идеальны для больших объемов текста: наш взгляд беспрепятственно двигается от слова к слову благодаря этим хвостикам.

Но хороши ли они для мониторов? Не совсем. Если текст мелкий, то засечки превращаются в визуальный мусор из-за маленького разрешения, что мешает легко воспринимать текст. Поэтому рекомендую использовать этот шрифт для блоков текста (типа дневников) и не мельчить его.


Шрифт: Constantia Regular

Следующий тип шрифтов — без засечек или по-другому гротески, в файлах называются sans-serif. Такие шрифты раньше не пользовались популярностью, но с развитием персональных компьютеров вошли в нашу жизнь. Например, гарнитура Helvetica используется на Mac, а Arial — на Windows. Шрифты без засечек чаще всего не имеют контрастов: то есть вертикальные и горизонтальные линии имеют одинаковую ширину.

Эти шрифты скучны, безлики, но хорошо считываются. На самом деле именно этот тип шрифтов — именно тот, который нам нужен! Шрифты без засечек хорошо подходят для текста субтитров и интерфейса. Они отлично делают своё дело: передают информацию и не отвлекают игрока на свой внешний вид.


Шрифт: Arial Regular

Еще есть тип брусковых шрифтов, называются в файлах slab-serif. Можно подумать, что это шрифты с засечками, но это обманчивое ощущение. На самом деле брусковые шрифты — это шрифты “без засечек”, потому что эти прямые хвостики выполняют здесь исключительно декоративную функцию.

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


Шрифт: Roboto Slab Regular

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

Шрифт: Bad Script Regular

Следующие шрифты лучше вообще не трогать. Я серьёзно. Называются они декоративные. И они не подходят для текста. Совсем. Максимум, где их можно использовать — для текстур, которые не несут в себе никакой смысловой нагрузки. Еще вариант их использования — для названия и логотипа игры, но тут нужно быть очень осторожными, ведь цель названия и логотипа — быть узнаваемыми и запоминаемыми. Декоративные шрифты полны деталей, которые уводят внимание зрителя. Если вы полный ноль в типографике, то лучше воспользуйтесь интересными шрифтами из типов с засечками и без засечек.


Шрифт:VARS Font1 Regular

Какой шрифт выбрать для субтитров и интерфейса?

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

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


Выбирайте шрифты, где есть и строчные, и прописные буквы.

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


Шрифт должен быть средней толщины.

И конечно же, текст субтитров или интерфейса должен контрастировать с фоном. Либо делайте небольшую обводку или подложку под текст.


Темно-синий текст не контрастирует с темно-серым фоном.

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

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

Мой ответ: шрифт должен быть незаметным. Я считаю, что в основе визуального стиля игры должны лежать графика тайлсетов, фейсов, баттлеров и оформление интерфейса, а не шрифт. Главная задача шрифта — передавать информацию игроку. Да, шрифт может быть стилизован, но не настолько, чтобы мешать игрокам, в том числе людям, которые имеют проблемы со зрением.

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



И текст считывается, и шрифт идеально подходит под стиль игры! Всё бы ничего, если бы в вашей игре не было нескончаемых потоков диалогов, рассуждений главных героев и отдельных описаний. Игроки будут напрягаться, вчитываясь в текст, набранный этим шрифтом. Они захотят просматривать диалоги по диагонали, но с таким шрифтом сложно пробегать текст глазами. Поэтому есть два варианта: либо ваши диалоги настолько хороши, что игроки будут дальше сосредоточенно читать текст, либо… они будут просто проскипывать диалоги.

Решение: заменить “старославянский” шрифт на шрифт с засечками. Такой шрифт тоже будет выглядеть “по-старинному”, но считываемость явно увеличится.



Другой пример: у вас милая мультяшная игра, и шрифт вы подбираете соответствующий.



Прочитать можно. Но всё становится хуже с увеличением количества текста. Опять же снижается считываемость, игроки начинают тратить больше времени на чтение, чем им хотелось бы.

Решение: если у вас мультяшно-детская игра и в ней много текста, то переделывайте игру. А если серьёзно: меняйте шрифт на шрифт без засечек, чтобы не мучить игроков. Если диалоги ограничиваются парой фраз, то рукописный шрифт может подойти.

А если в игре есть книга или письмо?

Но помимо текста в субтитрах и интерфейсе, в игре бывают еще записки, дневники, документы, книги и прочее. Как правильно их оформить?

Тут все немножко сложнее. Если субтитры должны быть безликими, то, например, в записке нужно передать почерк. Нет никакой проблемы использовать рукописный или декоративный шрифт, если в записке написано пару фраз типа “Ушла. Приду поздно”.

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

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

Если у вас в игре есть книга, есть также несколько вариантов. Первый — выбрать шрифт с декоративными элементами, но в общем и целом читабельный.

Например, книги из The Elder Scrolls V: Skyrim. Не самый удачный пример, так как буквы слишком толстые, а строчные выглядят как прописные, что снижает считываемость. На месте разработчиков я бы выбрала шрифт попроще (когда меня позовут работать в Bethesda, обязательно им передам).



Второй вариант — сразу делать текст книги в виде удобочитаемого электронного текста и забить на то, чтобы книга выглядела как-то по-древнему или по-особенному. Такой вариант вы можете видеть в The Witcher 3: Wild Hunt и не только с книгами, но и с записками.



Как оформить текст, чтобы его хотелось прочесть?

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



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



Где брать шрифты?

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

1. Google Fonts
Все гарнитуры на этом сайте бесплатны даже для коммерческого использования, так что можете пользоваться ими без зазрений совести.

Чтобы найти кириллические гарнитуры, нужно выбрать “Cyrillic” или “Cyrillic Extended” в графе “Language”.


2. MyFonts
Вместе с платными есть бесплатные шрифты. Чтобы их найти, в верхней строке поиска выберите “Free fonts” и нажмите “Search”.

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

В самом шрифте загляните в пункт “Licensing”, чтобы знать, при каких условиях его можно использовать коммерчески.

3. DaFont
В основном здесь представлены гарнитуры для личного использования (for personal use), то есть не для коммерческих проектов. Если вам нужен бесплатный шрифт для коммерческого проекта, ищите “100% free”

Для начала выберите категорию шрифта: например, basic > sans serif.
Затем введите в строке “preview” какой-нибудь текст на русском языке, чтобы найти кириллические шрифты. Да, снова придется искать вручную.


Послесловие

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

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

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

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

из плюсов:

- структурированно
- все понятно

из минусов:

- просто конспект любого урока по типографике с примерами из мукера.