Gamedev Дмитрий Мучкин
2 845

Как правильно форматировать внутриигровой текст

Несколько советов от инди-разработчиков.

В закладки

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

Разработчики Джо Хамфри (Joe Humfrey) и Брендон Чанг (Brendon Chung) рассказали Kotaku, как избежать самых распространённых ошибок при форматировании внутриигрового текста.

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

Самая частая ошибка — слишком мелкий текст.

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

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

Джо Хамфри
разработчик

Брендон Чанг, создатель Quadrilateral Cowboy и Thirty Flights of Loving, уделяет особое внимание шрифтам в игре. По его словам, найти подходящее начертание — задача не из лёгких.

Уже много раз было так, что я находил идеальный шрифт, но потом обнаруживал, что прописная «j» в нём выглядит странно, или у заглавной «G» нет горизонтальной линии.

Конечно, люди способны узнать букву, даже если она выглядит необычно, но я предпочитаю, чтобы они тратили силы на другие вещи.

Брендон Чанг
разработчик

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

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

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

Брендон Чанг
разработчик

По словам Чанга, во время разработки игры нужно создать правила использования текста в ней. Сколько важной информации будет подано через текст? Можно ли его пропустить? Есть ли разделение между кусками текста, имеющими разные функции (диалог, актуальный квест, название локации)? Когда эти правила установлены, игроки быстро адаптируются к ним. Главное — не нарушать эти условия и сделать текст читаемым.

Как утверждает Хамфри, чтобы игроку было легче читать, нужно следить за темпом и акцентами текста.

Акценты и темп — это как гармония и мелодия. Акценты — это правильное распределение текста в отдельно взятый момент, а темп — то, как текст появляется на экране.

Джо Хамфри
разработчик

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

Также важны чёткость — возможность разобрать отдельные буквы, — и удобство. Например, в The Elder Scrolls IV: Oblivion для текста в книгах выбран хороший шрифт: он подходит к сеттингу, и буквы в нём легко узнать. Но из-за расположения текста читать его неудобно.

Слева — вариант Хамфри, справа — оригинал

В своей презентации на недавней конференции GDC Хамфри показал свой вариант вёрстки: он выбрал другой шрифт, увеличил пробелы между словами, строками и абзацами и уменьшил количество текста на странице.

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

Типографические улучшения помогут игроку сконцентрироваться на важном тексте и лучше понять его.

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

Джо Хамфри
разработчик

#инди #игры #опыт

Материал опубликован пользователем. Нажмите кнопку «Написать», чтобы поделиться мнением или рассказать о своём проекте.

Написать
{ "author_name": "Дмитрий Мучкин", "author_type": "self", "tags": ["\u043e\u043f\u044b\u0442","\u0438\u043d\u0434\u0438","\u0438\u0433\u0440\u044b"], "comments": 23, "likes": 53, "favorites": 56, "is_advertisement": false, "subsite_label": "gamedev", "id": 18342, "is_wide": false, "is_ugc": true, "date": "Tue, 10 Apr 2018 11:33:26 +0300" }
{ "id": 18342, "author_id": 6322, "diff_limit": 1000, "urls": {"diff":"\/comments\/18342\/get","add":"\/comments\/18342\/add","edit":"\/comments\/edit","remove":"\/admin\/comments\/remove","pin":"\/admin\/comments\/pin","get4edit":"\/comments\/get4edit","complain":"\/comments\/complain","load_more":"\/comments\/loading\/18342"}, "attach_limit": 2, "max_comment_text_length": 5000, "subsite_id": 64954, "possessions": [] }

23 комментария 23 комм.

Популярные

По порядку

Написать комментарий...
7

Но потом придут они - русские локализаторы

Ответить
26

Это не русские локализаторы. Это криворукая, не гибкая и не резиновая вёрстка интерфейса, сделанная без учёта локализации. Именно это - основная причина проблемы: если вы заказываете локализацию на 15 языков, то обязательно нужно закладываться на длинные строки, короткие строки, пары суррогатов в юникоде (если работаете с UTF16) и прочие весёлые вещи.

Ответить
0

Спасибо, очень грамотно объяснили!)

Ответить
1

без оригинала не очень понятно что вы хотели сказать

Ответить
7

Эх, с одной стороны согласен с разработчиками (в 80 days, кстати, с читаемостью текста все отлично!), но. Как ПК игрок, я просто терпеть не могу, когда шрифты и интерфейс в игре огромные (а такое встречается).

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

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

Опять же, как в основном ПК-игрок, - вообще не согласен. Сделал только хуже. Я всегда не любил читать книги в играх серии TES, потому что там и так крупный текст, отчего на одну страницу влезает только пара предложений. И приходится каждые пять секунд их листать. Это очень раздражает! А с вариантом Хамфри вообще придется кликать каждые две секунды (ну, немного утрирую). Опять же, была бы возможность масштабировать текст - было бы идеально.

Ответить
5

Перелистывание не так страшно, как абсолютная нечитаемость оригинального варианта. Больно и сразу хочется закрыть. Хотя на мой взгляд это ещё и со шрифтом выбранным тоже связано

Ответить
0

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

Ответить
7

А мне оригинальный вариант книги нравится больше.

Ответить
5

Нравится и читаемый это немного разные дела.
Я не очень хорошо знаю английский и мне проще, а главное быстрее, прочитать вариант Хамфри, чем оригинал.
Оригинал выглядит, но и только.
Извечный баланс и его поиски...

Ответить
6

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

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

Ответить
2

Слева — вариант Хамфри, справа — оригинал

Претензия не к автору, но не могу не промолчать: как можно заботиться о читаемости текста и в примерах было/стало отходить от привычного многим правила "было — слева"?

Ответить
0

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

Ответить
2

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

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

Ответить
0

Я знал, что беседка - инди-разработчик

Ответить
7

Сначала студия выпустила инди-хит Skyrim, сделанный в RPG Maker, а потом набралась опыта — Fallout 4 уже была разработана на Unity.

Ответить
0

Молодой вы еще, сначала вышла TES: Arena на программируемом калькуляторе Электроника МК-54

Ответить
4

Если я не ошибаюсь, это был студенческий проект Тодда Говарда ещё до того, как он основал Bethesda. Где он достал «Электронику МК-54», до сих пор неизвестно. Есть теории, что у разработчика русские корни.

Ответить
0

Ну же, игровой журналист, разве так можно? Беседка создалась в 1986, Арена вышла в 1994.

Ответить
0

Мы же параллельную вселенную описывали!

Ответить
0

Даже в параллельных вселенных основные события происходят одинаково.

Ответить
1

Ну да. Естественно.

Ответить
1

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

Ответить
0

В ГТА5,например,сабы вообще почти нечитабельны. Их временами просто не замечаешь. Хорошо я английский неплохо знаю,и улавливал о чём речь на слух,но так делать нельзя всё равно.

Ответить
0

Прямой эфир

[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "clmf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fjog" } } }, { "id": 10, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "clmf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-250597-0", "render_to": "inpage_VI-250597-0-1134314964", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=clmf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudo", "p2": "ftjf" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fzvc" } } } ]
В лутбоксы начали включать багфиксы
Подписаться на push-уведомления